From 9c5c4181b259fe9814ddbfee7ef875d157b9c7e7 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Sun, 14 Jun 2026 14:11:39 +0200 Subject: [PATCH] =?UTF-8?q?Ajout=C3=A9=20quelques=20widgets?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/style.css | 79 ++++++++++++++++++++++++++ css/widgets.css | 38 ++----------- js/feature-widgets/capacite-dortoir.js | 22 +++++++ js/feature-widgets/capacite-espace.js | 28 +++++++++ js/feature-widgets/capacite-parking.js | 22 +++++++ js/feature-widgets/feature-widgets.js | 10 +++- js/feature-widgets/mixite-choisie.js | 24 ++++++++ js/feature-widgets/zone-interdite.js | 1 + 8 files changed, 189 insertions(+), 35 deletions(-) create mode 100644 js/feature-widgets/capacite-dortoir.js create mode 100644 js/feature-widgets/capacite-espace.js create mode 100644 js/feature-widgets/capacite-parking.js create mode 100644 js/feature-widgets/mixite-choisie.js diff --git a/css/style.css b/css/style.css index 1c21b35..cc2e78e 100644 --- a/css/style.css +++ b/css/style.css @@ -361,6 +361,17 @@ camp-feature .feature-header { margin-bottom: 1.5em; } +camp-feature .feature-widgets { + display: grid; + grid-template-columns: max-content minmax(50%, 1fr); + grid-auto-rows: max-content; + grid-auto-flow: column; +} + +camp-feature .feature-widgets > * { + grid-column: 1 / 3; +} + camp-feature .widget > :first-child { margin-top: 0; } @@ -379,4 +390,72 @@ camp-feature .widget p { margin-top: 1ex; margin-bottom: 1ex; line-height: 1.5; +} + +.table-widget { + display: grid; + grid-template-columns: max-content minmax(50%, 1fr); + column-gap: 1ex; + row-gap: 1ex; +} + +camp-feature .table-widget { + grid-template-columns: subgrid; + grid-column: 1 / 3; +} + +.table-widget > * { + margin: 0 !important; +} + +.table-widget > * { + grid-column: 2; +} + +.table-widget > h2 { + grid-column: 1; +} + +camp-feature .table-widget > h2 { + text-transform: none; +} + +.box-widget { + --box-color: white; + border: solid 3px var(--box-color); + padding: 10px; + box-sizing: border-box; +} + +.box-widget h2 { + float: left; + background-color: var(--box-color); + color: white; + padding: 5px 10px; + display: block; + width: fit-content; + position: relative; + font-size: 1em; +} + +.box-widget p:first-of-type { + margin-top: 0; +} + +.box-widget h2::after { + content: ""; + width: 0; height: 0; + border-style: solid; + border-width: calc(1em + 17.667px) calc(1em + 10px) 0px 0px; + border-color: var(--box-color) transparent transparent transparent; + position: absolute; + right: calc((1em + 9px) * -1); + top: 0; +} + +camp-feature .box-widget h2:first-child, +.box-widget h2 { + margin-left: -10px; + margin-top: -10px; + margin-right: 2em; } \ No newline at end of file diff --git a/css/widgets.css b/css/widgets.css index e65a06d..e6f0fdf 100644 --- a/css/widgets.css +++ b/css/widgets.css @@ -1,42 +1,12 @@ :root { --verboten-color:#c51a00; + --mixite-choisie-color: #640aa4; } .zone-interdite-widget { - border: solid 3px var(--verboten-color); - padding: 10px; - box-sizing: border-box; + --box-color: var(--verboten-color); } -.zone-interdite-widget h2 { - float: left; - background-color: var(--verboten-color); - color: white; - padding: 5px 10px; - display: block; - width: fit-content; - position: relative; - font-size: 1em; -} - -.zone-interdite-widget p:first-of-type { - margin-top: 0; -} - -.zone-interdite-widget h2::after { - content: ""; - width: 0; height: 0; - border-style: solid; - border-width: calc(1em + 17.667px) calc(1em + 10px) 0px 0px; - border-color: var(--verboten-color) transparent transparent transparent; - position: absolute; - right: calc((1em + 9px) * -1); - top: 0; -} - -camp-feature .zone-interdite-widget h2:first-child, -.zone-interdite-widget h2 { - margin-left: -10px; - margin-top: -10px; - margin-right: 2em; +.mixite-choisie-widget { + --box-color: var(--mixite-choisie-color); } \ No newline at end of file diff --git a/js/feature-widgets/capacite-dortoir.js b/js/feature-widgets/capacite-dortoir.js new file mode 100644 index 0000000..4ebad61 --- /dev/null +++ b/js/feature-widgets/capacite-dortoir.js @@ -0,0 +1,22 @@ +export function capaciteDortoirWidget(feature){ + if(feature.properties["n couchage"]){ + let content = document.createElement("div") + content.classList.add("widget") + content.classList.add("table-widget") + content.classList.add("capacite-dortoir-widget") + + let fielName = document.createElement("h2"); + fielName.textContent = "Capacité :" + content.append(fielName) + + let value = document.createElement("p"); + if(feature.properties["n couchage"] > 1){ + value.textContent = `${feature.properties["n couchage"]} lits` + } else { + value.textContent = `${feature.properties["n couchage"]} lit` + } + content.append(value) + + return content + } +} \ No newline at end of file diff --git a/js/feature-widgets/capacite-espace.js b/js/feature-widgets/capacite-espace.js new file mode 100644 index 0000000..a302940 --- /dev/null +++ b/js/feature-widgets/capacite-espace.js @@ -0,0 +1,28 @@ +function exclude(feature){ + return feature.properties["Parking"] || + feature.properties["n couchage"]; +} + +export function capaciteEspaceWidget(feature){ + let capacityValue = feature.properties["capacity"] || feature.properties["capacite"] + if((capacityValue !== undefined && capacityValue !== null) && !(exclude(feature))){ + let content = document.createElement("div") + content.classList.add("widget") + content.classList.add("table-widget") + content.classList.add("capacite-espace-widget") + + let fielName = document.createElement("h2"); + fielName.textContent = "Capacité :" + content.append(fielName) + + let value = document.createElement("p"); + if(capacityValue > 1){ + value.textContent = `${capacityValue} personnes` + } else { + value.textContent = `${capacityValue} personne` + } + content.append(value) + + return content + } +} \ No newline at end of file diff --git a/js/feature-widgets/capacite-parking.js b/js/feature-widgets/capacite-parking.js new file mode 100644 index 0000000..22c3295 --- /dev/null +++ b/js/feature-widgets/capacite-parking.js @@ -0,0 +1,22 @@ +export function capaciteParkingWidget(feature){ + if(feature.properties["Parking"] && feature.properties["capacite"]){ + let content = document.createElement("div") + content.classList.add("widget") + content.classList.add("table-widget") + content.classList.add("capacite-parking-widget") + + let fielName = document.createElement("h2"); + fielName.textContent = "Capacité :" + content.append(fielName) + + let value = document.createElement("p"); + if(feature.properties["capacite"] > 1){ + value.textContent = `${feature.properties["capacite"]} places` + } else { + value.textContent = `${feature.properties["capacite"]} place` + } + content.append(value) + + return content + } +} \ No newline at end of file diff --git a/js/feature-widgets/feature-widgets.js b/js/feature-widgets/feature-widgets.js index fa0a52d..9432f75 100644 --- a/js/feature-widgets/feature-widgets.js +++ b/js/feature-widgets/feature-widgets.js @@ -1,7 +1,15 @@ +import { capaciteDortoirWidget } from "./capacite-dortoir.js" +import { capaciteEspaceWidget } from "./capacite-espace.js" +import { capaciteParkingWidget } from "./capacite-parking.js" +import { mixiteChoisieWidget } from "./mixite-choisie.js" import { zoneInterditeWidget } from "./zone-interdite.js" export const FEATURE_WIDGETS = [ - zoneInterditeWidget + capaciteParkingWidget, + capaciteDortoirWidget, + capaciteEspaceWidget, + mixiteChoisieWidget, + zoneInterditeWidget, ] export default FEATURE_WIDGETS \ No newline at end of file diff --git a/js/feature-widgets/mixite-choisie.js b/js/feature-widgets/mixite-choisie.js new file mode 100644 index 0000000..a8ab513 --- /dev/null +++ b/js/feature-widgets/mixite-choisie.js @@ -0,0 +1,24 @@ +export function mixiteChoisieWidget(feature){ + if(feature.properties["mixite-choisie"]){ + let content = document.createElement("div") + content.classList.add("mixite-choisie-widget") + content.classList.add("widget") + content.classList.add("box-widget") + + let h2 = document.createElement("h2") + h2.textContent = "Mixité choisie" + content.append(h2) + + if(feature.properties["description-mixite-choisie"]){ + let description = document.createElement("p") + description.textContent = feature.properties["description-mixite-choisie"] + content.append(description) + } else { + let p = document.createElement("p") + p.textContent = `Cet espace est en mixité choisie sans mecs cis` + content.append(p) + } + + return content + } +} \ No newline at end of file diff --git a/js/feature-widgets/zone-interdite.js b/js/feature-widgets/zone-interdite.js index 22bdbb6..3774792 100644 --- a/js/feature-widgets/zone-interdite.js +++ b/js/feature-widgets/zone-interdite.js @@ -3,6 +3,7 @@ export function zoneInterditeWidget(feature){ let content = document.createElement("div") content.classList.add("zone-interdite-widget") content.classList.add("widget") + content.classList.add("box-widget") let h2 = document.createElement("h2") h2.textContent = "Zone interdite"