epickiwi/2026.camp.carte
1
1
Fork 0
Code Issues 1 Pull requests Projects Releases 1 Packages Wiki Activity Actions

Amelioration de la navigation sur la carte

Browse source
This commit is contained in:
EpicKiwi 2026-06-13 15:37:07 +02:00
parent aa8ea624c7
commit 799dd817ae
Signed by: epickiwi
GPG key ID: C4B28FD2729941CE
5 changed files with 171 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

82
js/index.js
View file

@ -26,13 +26,44 @@ search_form.elements["query"].addEventListener("change", () => search_form.reque
search_form.elements["query"].addEventListener("input", () => search_form.requestSubmit())
window.addEventListener("hashchange", () => {
let place_id = decodeURIComponent(location.hash.substring(1))
if(place_id){
MAP.highlight(place_id)
} else {
MAP.unhighlight_all()
}
let place_id = decodeURIComponent(location.hash.substring(1))
if (place_id) {
let feature = places.getFeatureById(place_id);
if (feature) {
MAP.highlight(place_id)
if(document.getElementById("search-result")) {
openSearchResultItem(feature)
} else {
let foundIndex = null;
let panelChildren = document.getElementById("result-panel").children
for(let i = 0; i<panelChildren.length; i++) {
let feature_el = panelChildren[i];
if(feature_el instanceof FeatureElement && feature_el.feature.id == feature.id){
foundIndex = i;
break;
}
}
if(foundIndex != null){
document.getElementById("result-panel").setActiveChildrenIndex(foundIndex, {behavior: "instant"})
} else {
openFeature(feature)
}
}
for(let feature_el of document.getElementById("result-panel").children) {
if(feature_el instanceof FeatureElement){
MAP.show(feature_el.feature)
}
}
}
} else {
MAP.unhighlight_all()
}
})
if(location.hash){
window.dispatchEvent(new Event("hashchange"))
}
search_form.addEventListener("submit", e => {
e.preventDefault()
@ -44,23 +75,23 @@ search_form.addEventListener("submit", e => {
let search_results = places.search(data.get("query"))
MAP.unhighlight_all();
for(let result_item of search_results){
let el = document.createElement("li")
let a = document.createElement("a")
el.append(a)
a.href = "#"+encodeURIComponent(result_item.ref)
a.addEventListener("click", e => {
e.preventDefault()
openSearchResultItem(result_item.feature)
})
let header = document.createElement("camp-feature-short-header")
header.feature = result_item.feature
a.append(header)
let header = document.createElement("camp-feature-short-header")
header.feature = result_item.feature
a.append(header)
resultElements.push(el)
MAP.show(result_item.feature)
}
if(!document.getElementById("search-result")){
let el = document.createElement("ol")
el.id = "search-result"
document.getElementById("result-panel").replaceChildren(el)
}
@ -71,7 +102,6 @@ search_form.addEventListener("submit", e => {
document.getElementById("search-result").replaceChildren(document.createTextNode("Pas de resultat"))
}
document.getElementById("search-result").children[0]?.scrollIntoView()
} else {
document.getElementById("search-result")?.remove()
}
@ -112,25 +142,39 @@ function openSearchResultItem(feature){
}
}
function openFeature(feature){
let panel = document.getElementById("result-panel")
let root = document.createElement("camp-feature")
root.feature = feature
panel.replaceChildren(root)
requestAnimationFrame(() => {
panel.setActiveChildrenIndex(0, {behavior: "instant"})
})
updateActiveFeature(feature)
}
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)
} else {
delete newUrl.hash;
newUrl.hash = "";
}
if(newUrl.toString() != location.toString()){
window.history.replaceState(null, "", newUrl.toString())
window.dispatchEvent(new Event("hashchange"))
}
window.history.replaceState(null, "", newUrl.toString())
window.dispatchEvent(new Event("hashchange"))
}
document.getElementById("result-panel").addEventListener("activePanelChange", e => {
if(e.activePanelIndex){
console.log("Panel changed", e.activePanelIndex)
if(e.activePanelIndex || e.activePanelIndex === 0){
let activeElement = e.target.children[e.activePanelIndex]
if(activeElement instanceof FeatureElement){
let feature = activeElement.feature
updateActiveFeature(feature)
} else {
MAP.unhighlight_all()
updateActiveFeature(null)
}
}
})