diff --git a/about.html b/about.html deleted file mode 100644 index 985de39..0000000 --- a/about.html +++ /dev/null @@ -1,59 +0,0 @@ - - - - - - - - - À 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/assets/amenities-btn.svg b/assets/amenities-btn.svg deleted file mode 100644 index 69a848a..0000000 --- a/assets/amenities-btn.svg +++ /dev/null @@ -1,680 +0,0 @@ - - - -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/couches/batiments.geojson b/couches/batiments.geojson index ddc2f41..0dd01a7 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, "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 ] ] ] ] } } +{ "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 ] ] ] ] } } ] } diff --git a/css/about.css b/css/about.css deleted file mode 100644 index 6dd31b8..0000000 --- a/css/about.css +++ /dev/null @@ -1,46 +0,0 @@ -.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 63b8494..0474dad 100644 --- a/css/style.css +++ b/css/style.css @@ -13,8 +13,6 @@ body { align-items: stretch; min-height: 100vh; - - background: black; } body > * { @@ -52,17 +50,8 @@ body > hr { } #main-header #logo { - 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; + filter: drop-shadow(rgba(0,0,0,0.5) 0 0 10px); } /* MAP */ @@ -76,10 +65,6 @@ body > hr { z-index: -1; } -.leaflet-container { - background: #3f3f3f; -} - .leaflet-container .leaflet-control-attribution { background: rgba(0, 0, 0, 0.5); color: white; @@ -95,13 +80,12 @@ 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 { @@ -211,22 +195,6 @@ body > hr { left: 5px; } -@media screen and (max-width: 599.9px) { - #search-section:has(input:focus) { - position: fixed; - bottom: 10px; - 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; @@ -558,47 +526,4 @@ 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 3301234..f4a09a3 100644 --- a/index.html +++ b/index.html @@ -8,38 +8,21 @@ - -
- +
- -

@@ -55,7 +38,5 @@ - - diff --git a/js/components/coords.js b/js/components/coords.js index 03bcd74..85f2e13 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/components/feature-legend.js b/js/components/feature-legend.js index 42bf594..8967d62 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: column; + flex-direction: row; justify-content: center; align-items: center; @@ -21,23 +21,22 @@ TEMPLATE.innerHTML = ` box-sizing: border-box; border: solid 1px transparent; - gap: 3px; } #legend-container[hidden] { display: none; } -.marker-icon { +#marker-icon { max-height: 2em; } -[data-n-marker="2"] .marker-icon { - max-height: 1.25em; +#marker-icon:not([src]) { + display: none; }
- +
` @@ -62,23 +61,11 @@ 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" - - 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) + if(symbol.markerUrl){ + marker.src = symbol.markerUrl + } else { + marker.removeAttribute("src") } - container.dataset.nMarker = markers.children.length; - container.replaceChildren(markers) } } diff --git a/js/components/html.js b/js/components/html.js deleted file mode 100644 index 67e286d..0000000 --- a/js/components/html.js +++ /dev/null @@ -1,25 +0,0 @@ -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 b7009d8..5eea888 100644 --- a/js/index.js +++ b/js/index.js @@ -163,27 +163,21 @@ function openSearchResultItem(feature){ } } -function openFeature(...feature){ +function openFeature(feature){ let panel = document.getElementById("result-panel") - let root = document.createDocumentFragment() - for(let featureItem of feature){ - let featureEl = document.createElement("camp-feature") - featureEl.feature = featureItem - root.append(featureEl) - } + let root = document.createElement("camp-feature") + root.feature = feature panel.replaceChildren(root) requestAnimationFrame(() => { panel.setActiveChildrenIndex(0, {behavior: "instant"}) }) - updateActiveFeature(feature[0]) + updateActiveFeature(feature) } function updateActiveFeature(feature_or_featureid){ let newUrl = new URL(window.location) - if(typeof feature_or_featureid == "string"){ - newUrl.hash = encodeURIComponent(feature_or_featureid) - } else if(feature_or_featureid){ - newUrl.hash = encodeURIComponent(feature_or_featureid.id) + if(feature_or_featureid){ + newUrl.hash = encodeURIComponent(feature_or_featureid.id || feature_or_featureid) } else { newUrl.hash = ""; } @@ -206,33 +200,6 @@ 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") -bindButtonToCategory(document.getElementById("explore-toilets"), "toilets") - -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} */ diff --git a/js/map.js b/js/map.js index 906e1df..1e84919 100644 --- a/js/map.js +++ b/js/map.js @@ -117,12 +117,9 @@ export async function init_places(places_db){ let symbol = feature.mapSymbol; if(symbol.markerUrl) { - 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) - } + let iconEl = document.createElement("img") + iconEl.src = symbol.markerUrl + contentEl.append(iconEl) } if(symbol.borderColor && symbol.borderColor != "white"){ diff --git a/js/places.js b/js/places.js index 031406c..51c3a9d 100644 --- a/js/places.js +++ b/js/places.js @@ -8,14 +8,6 @@ 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, - "toilets": (feature) => feature.properties["toilettes"] || feature.properties["douches"] -} - /** * Base de données locale des différents endroits du lieu */ @@ -29,8 +21,6 @@ export class PlaceDatabase extends EventTarget { fullTextIndex = null - featuresByCategory = {} - /** * Résultats d'une recherche dans la base de données * @typedef {Object} SearchResult @@ -188,9 +178,6 @@ 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}) @@ -232,16 +219,6 @@ 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, diff --git a/js/symbols.js b/js/symbols.js index 87a8765..a35123f 100644 --- a/js/symbols.js +++ b/js/symbols.js @@ -108,11 +108,11 @@ function getBaseSymbolForFeature(feature){ return CAMPING_SYMBOL } - if(feature.properties["toilettes"] && feature.properties["douches"]) { - return SHOWER_AND_TOILETS_SYMBOL - } else if(feature.properties["toilettes"]){ + if(feature.properties["toilettes"]){ return TOILETS_SYMBOL - } else if(feature.properties["douches"]){ + } + + if(feature.properties["douches"]){ return SHOWER_SYMBOL } @@ -185,8 +185,6 @@ 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", @@ -265,8 +263,6 @@ 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", @@ -293,23 +289,7 @@ 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 = "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 - ] + SHOWER_SYMBOL.genericName = "Douche" } export const SWIMMING_POOL_SYMBOL = new MapSymbol() @@ -397,8 +377,6 @@ 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", @@ -408,6 +386,7 @@ 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", diff --git a/package-prod.sh b/package-prod.sh index 5348796..0a6a6da 100755 --- a/package-prod.sh +++ b/package-prod.sh @@ -9,7 +9,6 @@ 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" @@ -17,13 +16,9 @@ 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" -cp -v ./assets/favicon.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"