From 7e654b46409d60ea71bf6bb2c794eb1b8a0ce00c Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 21:54:50 +0200 Subject: [PATCH 01/13] Ajout des categories --- assets/amenities-btn.svg | 680 +++++++++++++++++++++++++++++++++++++++ css/style.css | 59 ++++ index.html | 12 + js/components/coords.js | 2 +- js/index.js | 35 +- js/places.js | 22 ++ 6 files changed, 803 insertions(+), 7 deletions(-) create mode 100644 assets/amenities-btn.svg diff --git a/assets/amenities-btn.svg b/assets/amenities-btn.svg new file mode 100644 index 0000000..69a848a --- /dev/null +++ b/assets/amenities-btn.svg @@ -0,0 +1,680 @@ + + + +Piscine++++++++++++Piscine de l'AntenneAu centre de la pelouse d'entree sur le site, a cote des jeux pour enfantGrand atelier de nage libre, tous cyborg accepteEVENEMENTS A VENIRNage libre3 Juil17:00-19:00++++++ diff --git a/css/style.css b/css/style.css index 0474dad..6406fc2 100644 --- a/css/style.css +++ b/css/style.css @@ -195,6 +195,22 @@ body > hr { left: 5px; } +@media screen and (max-width: 599.9px) { + #search-section:has(input:focus) { + position: fixed; + top: 25px; + left: 10px; + width: calc(100vw - 20px); + margin: 0; + height: min-content; + box-sizing: border-box; + } +} + +#search-result { + min-height: 100vh; +} + #search-section input { background: black; font-size: 1em; @@ -526,4 +542,47 @@ camp-talk[data-track-id="34"] { camp-talk.active { animation: active-talk 1.5s alternate-reverse infinite linear; +} + +/* EXPLORE NAV */ + +#explore { + position: absolute; + bottom: 10px; + right: 10px; + width: min-content; +} + +#explore:has( ~ dialog:not([open])) { + position: fixed; +} + +#explore details { + display: flex; + flex-direction: column-reverse; + align-items: center; + + row-gap: 15px; +} + +#explore details > summary { + display: block; +} + +#explore details > summary img { + height: calc(20px + 2em + 2ex); + display: block; +} + +#explore details button { + display: block; + border: none; + background: none; + padding: 0; + margin: 0; + cursor: pointer; +} + +#explore details > button img { + height: 2.7em; } \ No newline at end of file diff --git a/index.html b/index.html index f4a09a3..46778a1 100644 --- a/index.html +++ b/index.html @@ -23,6 +23,18 @@
+ +

diff --git a/js/components/coords.js b/js/components/coords.js index 85f2e13..03bcd74 100644 --- a/js/components/coords.js +++ b/js/components/coords.js @@ -23,7 +23,7 @@ class CoordsElement extends HTMLElement { } updateContent(){ - this.#shadow.replaceChildren( + this.#shadow?.replaceChildren( this.formatCoordComponent(this.lat), ", ", this.formatCoordComponent(this.lon) diff --git a/js/index.js b/js/index.js index 5eea888..0dc54a1 100644 --- a/js/index.js +++ b/js/index.js @@ -163,21 +163,27 @@ function openSearchResultItem(feature){ } } -function openFeature(feature){ +function openFeature(...feature){ let panel = document.getElementById("result-panel") - let root = document.createElement("camp-feature") - root.feature = feature + let root = document.createDocumentFragment() + for(let featureItem of feature){ + let featureEl = document.createElement("camp-feature") + featureEl.feature = featureItem + root.append(featureEl) + } panel.replaceChildren(root) requestAnimationFrame(() => { panel.setActiveChildrenIndex(0, {behavior: "instant"}) }) - updateActiveFeature(feature) + updateActiveFeature(feature[0]) } function updateActiveFeature(feature_or_featureid){ let newUrl = new URL(window.location) - if(feature_or_featureid){ - newUrl.hash = encodeURIComponent(feature_or_featureid.id || feature_or_featureid) + if(typeof feature_or_featureid == "string"){ + newUrl.hash = encodeURIComponent(feature_or_featureid) + } else if(feature_or_featureid){ + newUrl.hash = encodeURIComponent(feature_or_featureid.id) } else { newUrl.hash = ""; } @@ -200,6 +206,23 @@ document.getElementById("result-panel").addEventListener("activePanelChange", e } }) +document.getElementById("explore-toggle-btn").addEventListener("click", () => { + let details = document.querySelector("#explore > details") + details.open = !details.open +}) + +function bindButtonToCategory(button, category){ + button.addEventListener("click", e => { + e.preventDefault() + openFeature(...places.featuresByCategory[category]); + }) +} + +bindButtonToCategory(document.getElementById("explore-drinking-water"), "drinking-water") +bindButtonToCategory(document.getElementById("explore-on-schedule"), "on-schedule") +bindButtonToCategory(document.getElementById("explore-dodo"), "dodo") +bindButtonToCategory(document.getElementById("explore-bin"), "bin") + { const RESULT_PANEL = document.getElementById("result-panel") /** @type {HTMLDialogElement} */ diff --git a/js/places.js b/js/places.js index 51c3a9d..4785a36 100644 --- a/js/places.js +++ b/js/places.js @@ -8,6 +8,13 @@ lunrFr(lunr) const FEATURE_INDEX = Symbol("Feature index") export const FEATURE_ID = Symbol("Feature id") +const CATEGORIES = { + "drinking-water": (feature) => feature.properties["eau potable"] || feature.properties["douches"] || feature.properties["toilettes"], + "bin": (feature) => feature.properties["poubelle"], + "dodo": (feature) => feature.properties["n couchage"] > 0 || feature.properties["camping"], + "on-schedule": (feature) => feature.properties["pretalx-room-id"] || feature.properties["pretalx-room-id"] == 0 +} + /** * Base de données locale des différents endroits du lieu */ @@ -21,6 +28,8 @@ export class PlaceDatabase extends EventTarget { fullTextIndex = null + featuresByCategory = {} + /** * Résultats d'une recherche dans la base de données * @typedef {Object} SearchResult @@ -178,6 +187,9 @@ export class PlaceDatabase extends EventTarget { this.featuresShownOnEmptyMap = [] let showOnEmptyMap = this.featuresShownOnEmptyMap + let placesThis = this + this.featuresByCategory = {} + this.fullTextIndex = lunr(function(){ this.ref("id") this.field("name", {boost: 3}) @@ -219,6 +231,16 @@ export class PlaceDatabase extends EventTarget { boost = sym.searchBoost } + for(let [categoryName, categoryFilter] of Object.entries(CATEGORIES)){ + if(!Array.isArray(placesThis.featuresByCategory[categoryName])){ + placesThis.featuresByCategory[categoryName] = [] + } + + if(categoryFilter(feature)){ + placesThis.featuresByCategory[categoryName].push(feature) + } + } + this.add({ id, name: feature.properties.name || sym.genericName, From cb10cc189ca3425bee3d08c14597d3da51954404 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:02:53 +0200 Subject: [PATCH 02/13] Ajout d'une page a propos --- about.html | 59 +++++++++++++++++++++++++++++++++++++++++++ css/about.css | 46 +++++++++++++++++++++++++++++++++ css/style.css | 11 +++++++- index.html | 8 +++++- js/components/html.js | 25 ++++++++++++++++++ js/index.js | 9 +++++++ 6 files changed, 156 insertions(+), 2 deletions(-) create mode 100644 about.html create mode 100644 css/about.css create mode 100644 js/components/html.js diff --git a/about.html b/about.html new file mode 100644 index 0000000..985de39 --- /dev/null +++ b/about.html @@ -0,0 +1,59 @@ + + + + + + + + + À propos de la carte du Camp Interhack + + +
+ + Interhack Camp + +

À propos de la carte du Camp Interhack

+ +

+ La carte de Camp à été élaborée par la commission Ambiance et Spacialisation. + On espère qu'elle vous sera utile. +

+ +

+ Si vous avez un soucis, que vous avez trouvé un bug ou que vous voulez contribuer, vous pouvez vous rendre sur le GIT de l'interhack et parciper à son amélioration. + Vous pouvez aussi trouver Kiwi qui se fera une joie de vous expliquer comment contribuer ou comment la carte fonctionne. +

+ +
+ +

+ Nous avons élaboré cette carte avec QGIS, un logiciel libre d'analyse et d'édition de cartes. + Pour la partie interactive sur le site, nous avons utilisé du HTML, du CSS et du JavaScript. Les icones ont été fabriquées sur Inkscape, les textures du fond de carte sur Gimp et les éléments 3D dans Blender. +

+ +
+ +

+ Le code source de la carte est en license libre AGPLv3. Les données sont en license CC-BY-SA et incluses dans le code source. +

+ +

+ Le code source peut être téléchargé et redistribué librement: Télécharger le code source +

+ +
+ + \ No newline at end of file diff --git a/css/about.css b/css/about.css new file mode 100644 index 0000000..6dd31b8 --- /dev/null +++ b/css/about.css @@ -0,0 +1,46 @@ +.about { + font-family: sans-serif; +} + +.about img[src="./assets/favicon@512.png"] { + margin-top: 50px; + margin-bottom: 50px; + height: 100px; + max-height: 50vw; + + display: block; + margin-left: auto; + margin-right: auto; + + filter: drop-shadow(currentColor 0px 0px 1px) drop-shadow(currentColor 0px 0px 1px) drop-shadow(currentColor 0px 0px 1px); +} +/* +#result-panel-dialog .about img[src="./assets/favicon@512.png"] { + display: none; +}*/ + +.about h1 { + font-weight: normal; + font-size: 2em; + text-align: center; + margin-top: 50px; + margin-bottom: 50px; +} + +.about h1 small { + display: block; + font-size: 0.7em; +} + +.about a { + color: inherit; +} + +.about hr { + border: none; + height: 50px; +} + +.about p { + line-height: 1.5; +} \ No newline at end of file diff --git a/css/style.css b/css/style.css index 6406fc2..68982c7 100644 --- a/css/style.css +++ b/css/style.css @@ -50,8 +50,17 @@ body > hr { } #main-header #logo { - max-height: clamp(2rem, 10vh, 5rem); + border: none; + background: none; + padding: 0; + margin: 0; filter: drop-shadow(rgba(0,0,0,0.5) 0 0 10px); + cursor: pointer; +} + +#main-header #logo img { + max-height: clamp(2rem, 10vh, 5rem); + display: block; } /* MAP */ diff --git a/index.html b/index.html index 46778a1..964369e 100644 --- a/index.html +++ b/index.html @@ -8,16 +8,20 @@ + +
- +
@@ -50,5 +54,7 @@ + + diff --git a/js/components/html.js b/js/components/html.js new file mode 100644 index 0000000..67e286d --- /dev/null +++ b/js/components/html.js @@ -0,0 +1,25 @@ +class HTMLImportElement extends HTMLTemplateElement { + + get src(){ + return new URL(this.getAttribute("src"), this.baseURI).toString(); + } + + connectedCallback(){ + this.load() + } + + async load(){ + let res = await fetch(this.src); + if(!res.ok){ + console.error(`Server responded with code ${res.status} ${res.statusText}`) + return + } + + let htmlStr = await res.text() + let html = new DOMParser().parseFromString(htmlStr, "text/html"); + + this.content.replaceChildren(...Array.from(html.querySelector("body").childNodes)) + } +} + +customElements.define("camp-html", HTMLImportElement, {extends: "template"}) \ No newline at end of file diff --git a/js/index.js b/js/index.js index 0dc54a1..d24a694 100644 --- a/js/index.js +++ b/js/index.js @@ -223,6 +223,15 @@ bindButtonToCategory(document.getElementById("explore-on-schedule"), "on-schedul bindButtonToCategory(document.getElementById("explore-dodo"), "dodo") bindButtonToCategory(document.getElementById("explore-bin"), "bin") +document.getElementById("logo").addEventListener("click", e => { + openFeature() + let panel = document.getElementById("result-panel") + panel.replaceChildren(document.getElementById("about-template").content.cloneNode(true)); + requestAnimationFrame(() => { + panel.setActiveChildrenIndex(0, {behavior: "instant"}) + }) +}) + { const RESULT_PANEL = document.getElementById("result-panel") /** @type {HTMLDialogElement} */ From b2a8af6db21fb922f042453dac8d0546ab113770 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:05:53 +0200 Subject: [PATCH 03/13] Ajout d'une categorie toilettes --- index.html | 5 +++-- js/index.js | 1 + js/places.js | 3 ++- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 964369e..3301234 100644 --- a/index.html +++ b/index.html @@ -33,9 +33,10 @@ - - + + + diff --git a/js/index.js b/js/index.js index d24a694..b7009d8 100644 --- a/js/index.js +++ b/js/index.js @@ -222,6 +222,7 @@ bindButtonToCategory(document.getElementById("explore-drinking-water"), "drinkin bindButtonToCategory(document.getElementById("explore-on-schedule"), "on-schedule") bindButtonToCategory(document.getElementById("explore-dodo"), "dodo") bindButtonToCategory(document.getElementById("explore-bin"), "bin") +bindButtonToCategory(document.getElementById("explore-toilets"), "toilets") document.getElementById("logo").addEventListener("click", e => { openFeature() diff --git a/js/places.js b/js/places.js index 4785a36..031406c 100644 --- a/js/places.js +++ b/js/places.js @@ -12,7 +12,8 @@ const CATEGORIES = { "drinking-water": (feature) => feature.properties["eau potable"] || feature.properties["douches"] || feature.properties["toilettes"], "bin": (feature) => feature.properties["poubelle"], "dodo": (feature) => feature.properties["n couchage"] > 0 || feature.properties["camping"], - "on-schedule": (feature) => feature.properties["pretalx-room-id"] || feature.properties["pretalx-room-id"] == 0 + "on-schedule": (feature) => feature.properties["pretalx-room-id"] || feature.properties["pretalx-room-id"] == 0, + "toilets": (feature) => feature.properties["toilettes"] || feature.properties["douches"] } /** From 5eb2266d685f1397cc99632ce7b5ce9757115312 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:10:05 +0200 Subject: [PATCH 04/13] Ajout des favicons dans le package de prod --- package-prod.sh | 3 +++ 1 file changed, 3 insertions(+) diff --git a/package-prod.sh b/package-prod.sh index 0a6a6da..20522b4 100755 --- a/package-prod.sh +++ b/package-prod.sh @@ -19,6 +19,9 @@ mkdir "$OUT/assets" cp -v ./assets/button-stepped-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image-corner.svg "$OUT/assets" +cp -v ./assets/favicon.svg "$OUT/assets" +cp -v ./assets/favicon@192.svg "$OUT/assets" +cp -v ./assets/favicon@512.svg "$OUT/assets" echo "Copie des données" mkdir "$OUT/couches" From 79a2ff3f309c632d72a544568fe4f9d3ee65ef32 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:12:21 +0200 Subject: [PATCH 05/13] Fix autel a dons --- js/symbols.js | 1 - 1 file changed, 1 deletion(-) diff --git a/js/symbols.js b/js/symbols.js index a35123f..387eaa9 100644 --- a/js/symbols.js +++ b/js/symbols.js @@ -386,7 +386,6 @@ export const STAGE_SYMBOL = new MapSymbol() export const MONEY_SYMBOL = new MapSymbol() { - MONEY_SYMBOL.genericName = "Scène" MONEY_SYMBOL.markerUrl = new URL("../icons/dons.svg", import.meta.url) MONEY_SYMBOL.indexSynonyms = [ "argent", From 54bcf7d0af42bd87c3a93a607808dace596d3795 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:16:09 +0200 Subject: [PATCH 06/13] Ajustement du comportement de la barre de recherche --- css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/style.css b/css/style.css index 68982c7..6f352b5 100644 --- a/css/style.css +++ b/css/style.css @@ -207,7 +207,7 @@ body > hr { @media screen and (max-width: 599.9px) { #search-section:has(input:focus) { position: fixed; - top: 25px; + bottom: 10px; left: 10px; width: calc(100vw - 20px); margin: 0; From 17a93f3dbc5b8b245f71e79fd7f70abcb5c6f61b Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:22:13 +0200 Subject: [PATCH 07/13] =?UTF-8?q?Cacher=20les=20batiments=20trop=20g=C3=A9?= =?UTF-8?q?n=C3=A9riques?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- couches/batiments.geojson | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/couches/batiments.geojson b/couches/batiments.geojson index 0dd01a7..ddc2f41 100644 --- a/couches/batiments.geojson +++ b/couches/batiments.geojson @@ -3,8 +3,8 @@ "name": "batiments", "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } }, "features": [ -{ "type": "Feature", "properties": { "id": 1, "nom": "Batiment A", "batiment": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091581996371882, 47.541032945940522 ], [ -2.09151399426637, 47.541497984433285 ], [ -2.091312011285422, 47.541481979469303 ], [ -2.091326034403365, 47.541400730704773 ], [ -2.091241014242576, 47.541394942672135 ], [ -2.091251030755392, 47.541319968658911 ], [ -2.091334848934643, 47.541327974547109 ], [ -2.091346067428997, 47.541254515067628 ], [ -2.091304879528295, 47.541251918559851 ], [ -2.091309046397626, 47.541206046901102 ], [ -2.091353038921917, 47.541207940189693 ], [ -2.091375035184063, 47.541061913344244 ], [ -2.091330882395567, 47.541059965956265 ], [ -2.091335990817103, 47.541026008366721 ], [ -2.091380744596368, 47.54102704967903 ], [ -2.091381966610932, 47.541019003174263 ], [ -2.091581996371882, 47.541032945940522 ] ] ] ] } }, -{ "type": "Feature", "properties": { "id": 2, "nom": "Batiment B", "batiment": true, "electricite-triphase": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091630987136071, 47.541689935433055 ], [ -2.091803321239079, 47.54170457447416 ], [ -2.091796950736927, 47.541739951576218 ], [ -2.092355992350255, 47.541780954364874 ], [ -2.092339965929748, 47.54185403445365 ], [ -2.091958937782201, 47.541822011214833 ], [ -2.09193297498098, 47.54193998862457 ], [ -2.091763976376737, 47.541926005529561 ], [ -2.091756003232534, 47.541964993201951 ], [ -2.091590991200393, 47.541954999486393 ], [ -2.091630987136071, 47.541689935433055 ] ] ] ] } }, -{ "type": "Feature", "properties": { "id": 10, "nom": "Toilettes sèches", "batiment": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091342607190285, 47.541484412003662 ], [ -2.091438001950184, 47.541492274863295 ], [ -2.09143324403292, 47.541516949622384 ], [ -2.09133755253389, 47.541508679404679 ], [ -2.091342607190285, 47.541484412003662 ] ] ] ] } } +{ "type": "Feature", "properties": { "id": 1, "name": "Batiment A", "ignore": true, "batiment": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091581996371882, 47.541032945940522 ], [ -2.09151399426637, 47.541497984433285 ], [ -2.091312011285422, 47.541481979469303 ], [ -2.091326034403365, 47.541400730704773 ], [ -2.091241014242576, 47.541394942672135 ], [ -2.091251030755392, 47.541319968658911 ], [ -2.091334848934643, 47.541327974547109 ], [ -2.091346067428997, 47.541254515067628 ], [ -2.091304879528295, 47.541251918559851 ], [ -2.091309046397626, 47.541206046901102 ], [ -2.091353038921917, 47.541207940189693 ], [ -2.091375035184063, 47.541061913344244 ], [ -2.091330882395567, 47.541059965956265 ], [ -2.091335990817103, 47.541026008366721 ], [ -2.091380744596368, 47.54102704967903 ], [ -2.091381966610932, 47.541019003174263 ], [ -2.091581996371882, 47.541032945940522 ] ] ] ] } }, +{ "type": "Feature", "properties": { "id": 2, "name": "Batiment B", "ignore": true, "batiment": true, "electricite-triphase": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091630987136071, 47.541689935433055 ], [ -2.091803321239079, 47.54170457447416 ], [ -2.091796950736927, 47.541739951576218 ], [ -2.092355992350255, 47.541780954364874 ], [ -2.092339965929748, 47.54185403445365 ], [ -2.091958937782201, 47.541822011214833 ], [ -2.09193297498098, 47.54193998862457 ], [ -2.091763976376737, 47.541926005529561 ], [ -2.091756003232534, 47.541964993201951 ], [ -2.091590991200393, 47.541954999486393 ], [ -2.091630987136071, 47.541689935433055 ] ] ] ] } }, +{ "type": "Feature", "properties": { "id": 10, "name": "Toilettes sèches", "ignore": true, "batiment": true }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -2.091342607190285, 47.541484412003662 ], [ -2.091438001950184, 47.541492274863295 ], [ -2.09143324403292, 47.541516949622384 ], [ -2.09133755253389, 47.541508679404679 ], [ -2.091342607190285, 47.541484412003662 ] ] ] ] } } ] } From a9f220e596edffbe139da90e620f11c9afe94116 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:22:21 +0200 Subject: [PATCH 08/13] Ajustement mineur du style --- css/style.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/css/style.css b/css/style.css index 6f352b5..ae6ae9d 100644 --- a/css/style.css +++ b/css/style.css @@ -13,6 +13,8 @@ body { align-items: stretch; min-height: 100vh; + + background: black; } body > * { @@ -74,6 +76,10 @@ body > hr { z-index: -1; } +.leaflet-container { + background: #3f3f3f; +} + .leaflet-container .leaflet-control-attribution { background: rgba(0, 0, 0, 0.5); color: white; From 25cf94a52a4b8ce4fa75a794c8be4b5e0e5c8f8c Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:45:05 +0200 Subject: [PATCH 09/13] =?UTF-8?q?De=20multiples=20icones=20peuvemt=20maint?= =?UTF-8?q?enant=20etre=20utilis=C3=A9es?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/style.css | 3 ++- js/components/feature-legend.js | 31 ++++++++++++++++++++++--------- js/map.js | 9 ++++++--- 3 files changed, 30 insertions(+), 13 deletions(-) diff --git a/css/style.css b/css/style.css index ae6ae9d..63b8494 100644 --- a/css/style.css +++ b/css/style.css @@ -95,12 +95,13 @@ body > hr { #map .highlight-point-icon > * { width: fit-content; height: fit-content; - transform: translateX(-50%) translateY(-50%); + transform: translateX(-50%) translateY(-50%); display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; + gap: 3px; } #map .highlight-point-icon > a { diff --git a/js/components/feature-legend.js b/js/components/feature-legend.js index 8967d62..42bf594 100644 --- a/js/components/feature-legend.js +++ b/js/components/feature-legend.js @@ -13,7 +13,7 @@ TEMPLATE.innerHTML = ` height: 100%; display: flex; - flex-direction: row; + flex-direction: column; justify-content: center; align-items: center; @@ -21,22 +21,23 @@ TEMPLATE.innerHTML = ` box-sizing: border-box; border: solid 1px transparent; + gap: 3px; } #legend-container[hidden] { display: none; } -#marker-icon { +.marker-icon { max-height: 2em; } -#marker-icon:not([src]) { - display: none; +[data-n-marker="2"] .marker-icon { + max-height: 1.25em; }
- +
` @@ -61,11 +62,23 @@ export class FeatureLegendElement extends HTMLElement { container.style.setProperty("--background-color", symbol.backgroundColor || "transparent"); container.style.backgroundImage = symbol.backgroundUrl ? `url(${symbol.backgroundUrl})` : "none" container.style.borderColor = symbol.borderColor || "transparent" - if(symbol.markerUrl){ - marker.src = symbol.markerUrl - } else { - marker.removeAttribute("src") + + let markers = document.createDocumentFragment() + if(Array.isArray(symbol.markerUrl)){ + for(let markerUrl of symbol.markerUrl){ + let el = document.createElement("img") + el.classList.add("marker-icon") + el.src = markerUrl + markers.append(el) + } + } else if(symbol.markerUrl){ + let el = document.createElement("img") + el.classList.add("marker-icon") + el.src = symbol.markerUrl + markers.append(el) } + container.dataset.nMarker = markers.children.length; + container.replaceChildren(markers) } } diff --git a/js/map.js b/js/map.js index 1e84919..906e1df 100644 --- a/js/map.js +++ b/js/map.js @@ -117,9 +117,12 @@ export async function init_places(places_db){ let symbol = feature.mapSymbol; if(symbol.markerUrl) { - let iconEl = document.createElement("img") - iconEl.src = symbol.markerUrl - contentEl.append(iconEl) + let markerList = Array.isArray(symbol.markerUrl) ? symbol.markerUrl : [symbol.markerUrl]; + for(let marker of markerList){ + let iconEl = document.createElement("img") + iconEl.src = marker + contentEl.append(iconEl) + } } if(symbol.borderColor && symbol.borderColor != "white"){ From 46f616fc6690fc62dbc4106139bfc444b92b51d2 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:45:42 +0200 Subject: [PATCH 10/13] Ameliorations des symboles --- js/symbols.js | 32 +++++++++++++++++++++++++++----- 1 file changed, 27 insertions(+), 5 deletions(-) diff --git a/js/symbols.js b/js/symbols.js index 387eaa9..87a8765 100644 --- a/js/symbols.js +++ b/js/symbols.js @@ -108,11 +108,11 @@ function getBaseSymbolForFeature(feature){ return CAMPING_SYMBOL } - if(feature.properties["toilettes"]){ + if(feature.properties["toilettes"] && feature.properties["douches"]) { + return SHOWER_AND_TOILETS_SYMBOL + } else if(feature.properties["toilettes"]){ return TOILETS_SYMBOL - } - - if(feature.properties["douches"]){ + } else if(feature.properties["douches"]){ return SHOWER_SYMBOL } @@ -185,6 +185,8 @@ export const SLEEPING_SYMBOL = new MapSymbol() { SLEEPING_SYMBOL.markerUrl = new URL("../icons/dortoir.svg", import.meta.url) SLEEPING_SYMBOL.genericName = "Dortoir" + SLEEPING_SYMBOL.backgroundColor = "grey" + SLEEPING_SYMBOL.borderColor = "grey" SLEEPING_SYMBOL.indexSynonyms = [ "dodo", "dortoir", @@ -263,6 +265,8 @@ export const TOILETS_SYMBOL = new MapSymbol() { TOILETS_SYMBOL.markerUrl = new URL("../icons/toilettes.svg", import.meta.url) TOILETS_SYMBOL.genericName = "Toilettes" + TOILETS_SYMBOL.backgroundColor = "#8800ff" + TOILETS_SYMBOL.borderColor = "#8800ff" TOILETS_SYMBOL.indexSynonyms = [ "caca", "pipi", @@ -289,7 +293,23 @@ export const TOILETS_SYMBOL = new MapSymbol() export const SHOWER_SYMBOL = new MapSymbol() { SHOWER_SYMBOL.markerUrl = new URL("../icons/douches.svg", import.meta.url) - SHOWER_SYMBOL.genericName = "Douche" + SHOWER_SYMBOL.genericName = "Douches" + SHOWER_SYMBOL.backgroundColor = "#8800ff" + SHOWER_SYMBOL.borderColor = "#8800ff" +} + +export const SHOWER_AND_TOILETS_SYMBOL = new MapSymbol(); +{ + SHOWER_AND_TOILETS_SYMBOL.markerUrl = [ + TOILETS_SYMBOL.markerUrl, + SHOWER_SYMBOL.markerUrl + ] + SHOWER_AND_TOILETS_SYMBOL.backgroundColor = "#8800ff" + SHOWER_AND_TOILETS_SYMBOL.borderColor = "#8800ff" + SHOWER_AND_TOILETS_SYMBOL.genericName = "Toilettes & douches" + SHOWER_AND_TOILETS_SYMBOL.indexSynonyms = [ + ...TOILETS_SYMBOL.indexSynonyms + ] } export const SWIMMING_POOL_SYMBOL = new MapSymbol() @@ -377,6 +397,8 @@ export const STAGE_SYMBOL = new MapSymbol() { STAGE_SYMBOL.genericName = "Scène" STAGE_SYMBOL.markerUrl = new URL("../icons/scene.svg", import.meta.url) + STAGE_SYMBOL.backgroundColor = "#ffbf3e" + STAGE_SYMBOL.borderColor = "#ffbf3e" STAGE_SYMBOL.indexSynonyms = [ "scène", "musique", From 05890e4a870421bf63b65787685e5a5382ea0849 Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:53:08 +0200 Subject: [PATCH 11/13] Fix: ajout du bouton amenities dans le package de prod --- package-prod.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/package-prod.sh b/package-prod.sh index 20522b4..4c6156b 100755 --- a/package-prod.sh +++ b/package-prod.sh @@ -16,6 +16,7 @@ cp -v -r ./css "$OUT" cp -v -r ./icons "$OUT" mkdir "$OUT/assets" +cp -v ./assets/amenities-btn.svg "$OUT/assets" cp -v ./assets/button-stepped-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image-corner.svg "$OUT/assets" From c305992d4ddce0bd185ab56889a4582e4a033d7f Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:56:16 +0200 Subject: [PATCH 12/13] Fix des favicons --- package-prod.sh | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package-prod.sh b/package-prod.sh index 4c6156b..cc74290 100755 --- a/package-prod.sh +++ b/package-prod.sh @@ -21,8 +21,8 @@ cp -v ./assets/button-stepped-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image.svg "$OUT/assets" cp -v ./assets/neon-border-image-corner.svg "$OUT/assets" cp -v ./assets/favicon.svg "$OUT/assets" -cp -v ./assets/favicon@192.svg "$OUT/assets" -cp -v ./assets/favicon@512.svg "$OUT/assets" +cp -v ./assets/favicon@192.png "$OUT/assets" +cp -v ./assets/favicon@512.png "$OUT/assets" echo "Copie des données" mkdir "$OUT/couches" From fc975b0bce7cafca340a69354eabe50fdb9f171a Mon Sep 17 00:00:00 2001 From: EpicKiwi Date: Mon, 29 Jun 2026 23:57:55 +0200 Subject: [PATCH 13/13] Fix: Ajout de la page a propos dans le package de prod --- package-prod.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/package-prod.sh b/package-prod.sh index cc74290..5348796 100755 --- a/package-prod.sh +++ b/package-prod.sh @@ -9,6 +9,7 @@ mkdir -p "$OUT" echo "Copie des fichiers source" cp -v index.html "$OUT" +cp -v about.html "$OUT" cp -v logo.png "$OUT" cp -v manifest.json "$OUT" cp -v -r ./js "$OUT"