konrad/karten
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace the panel labels with circled icons that strike through when a section is open, and name the download switch after the current view.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
konrad
2026-10-09 09:44:13 +02:00
co-authored by Cursor
parent 3a49d52681
commit 1a865330fe
6 changed files with 72 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/index-Bq5oV54d.css → public/assets/index-BIwdVEBe.css
+1 -1
View File
File diff suppressed because one or more lines are too long
public/assets/index-COdGoMDk.js → public/assets/index-DjxrnCdH.js
+6 -6
View File
@@ -14,11 +14,11 @@ northing meters `+e);let f=d/2,p=0,m=0,h=1e5/10**f;if(f>0){let t=e.substring(a,a
<div class="panel-head">
<h1>Karte</h1>
<div class="head-actions">
<button type="button" class="secondary fold-toggle" aria-expanded="true" aria-controls="ziele">Einklappen</button>
<button type="button" class="secondary einstellungen-toggle" aria-expanded="false" aria-controls="einstellungen">Einstellungen</button>
<button type="button" class="secondary icon-button fold-toggle" aria-expanded="false" aria-controls="ziele" aria-label="Ziele" title="Ziele">${Lb}${Bb}</button>
<button type="button" class="secondary icon-button einstellungen-toggle" aria-expanded="false" aria-controls="einstellungen" aria-label="Einstellungen" title="Einstellungen">${Rb}${Bb}</button>
</div>
</div>
<div id="ziele" class="fold">
<div id="ziele" class="fold" hidden>
<form>
<div class="fields">
<label>Gitter <input name="gitter" type="text" autocomplete="off" spellcheck="false" autocapitalize="off" /></label>
@@ -33,7 +33,7 @@ northing meters `+e);let f=d/2,p=0,m=0,h=1e5/10**f;if(f>0){let t=e.substring(a,a
</div>
</div>
<div id="einstellungen" class="fold" hidden>
<label class="download-knopf"><input type="checkbox" /> Download-Knopf</label>
<label class="download-knopf"><input type="checkbox" /> <span>Download-Knopf (aktueller Sichtbereich)</span></label>
<div class="gebiet">
<p hidden></p>
<button type="button" class="hessen-download">Hessen herunterladen</button>
@@ -48,5 +48,5 @@ northing meters `+e);let f=d/2,p=0,m=0,h=1e5/10**f;if(f>0){let t=e.substring(a,a
<button type="button" class="confirm"></button>
<button type="button" class="secondary cancel">Abbrechen</button>
</div>
`,e.append(i,r,a);let o=i.querySelector(`#ziele`),s=i.querySelector(`.fold-toggle`),c=i.querySelector(`#einstellungen`),l=i.querySelector(`.einstellungen-toggle`),u=i.querySelector(`form`),d=i.querySelector(`input[name="gitter"]`),f=i.querySelector(`input[name="rechtswert"]`),p=i.querySelector(`input[name="hochwert"]`),m=i.querySelector(`.ziel-list`),h=i.querySelector(`.actions button`),g=i.querySelector(`.download-knopf input`),_=i.querySelector(`.gebiet`),v=i.querySelector(`.gebiet p`),y=i.querySelector(`.gebiet button`),b=i.querySelector(`.wipe`),x=i.querySelector(`.notice`),S=a.querySelector(`.ask`),C=a.querySelector(`.explain`),w=a.querySelector(`.confirm`),T=a.querySelector(`.cancel`);if(!o||!s||!c||!l||!u||!d||!f||!p||!m||!h||!g||!_||!v||!y||!b||!x||!S||!C||!w||!T)return;let E=t.snapshot();d.value=E.koordinate.gitter,f.value=E.koordinate.rechtswert,p.value=E.koordinate.hochwert;let D=Mb(r,n,t),O=document.createElement(`button`);O.type=`button`,O.className=`map-download`,O.textContent=`Diese Ansicht herunterladen`,O.addEventListener(`click`,()=>t.downloadView());let k=!1,ee=Ib(t.snapshot());u.addEventListener(`submit`,e=>{e.preventDefault(),t.enterKoordinate({gitter:d.value,rechtswert:f.value,hochwert:p.value})}),s.addEventListener(`click`,()=>{let e=o.hasAttribute(`hidden`);o.toggleAttribute(`hidden`,!e),s.setAttribute(`aria-expanded`,e?`true`:`false`),s.textContent=e?`Einklappen`:`Ziele`}),l.addEventListener(`click`,()=>{let e=c.hasAttribute(`hidden`);c.toggleAttribute(`hidden`,!e),l.setAttribute(`aria-expanded`,e?`true`:`false`)}),h.addEventListener(`click`,()=>t.centerOnStandort()),g.addEventListener(`change`,()=>{t.setDownloadKnopf(g.checked)}),y.addEventListener(`click`,()=>{y.disabled||t.startHessen()}),b.addEventListener(`click`,()=>re()),w.addEventListener(`click`,()=>{let e=k;k=!1,a.close(),e&&t.deleteCache()}),T.addEventListener(`click`,()=>{k=!1,a.open&&a.close()}),a.addEventListener(`cancel`,()=>{k=!1});let te=()=>{let e=t.snapshot();D.apply(e);let n=Ib(e);n!==ee&&(ee=n,D.refreshTiles()),ne(e)},ne=e=>{m.replaceChildren();for(let n of e.ziele){let e=document.createElement(`li`),r=document.createElement(`button`);r.type=`button`,r.className=`secondary ziel-open`,r.textContent=n.entfernung?`${n.koordinate} ${n.entfernung.text}`:n.koordinate,r.addEventListener(`click`,()=>t.centerOnZiel(n.koordinate));let i=document.createElement(`button`);i.type=`button`,i.className=`secondary`,i.textContent=`Löschen`,i.addEventListener(`click`,()=>t.deleteZiel(n.koordinate)),e.append(r,i),m.append(e)}e.notice?(x.hidden=!1,x.textContent=e.notice):(x.hidden=!0,x.textContent=``),g.checked=e.downloadKnopf,e.downloadKnopf?r.append(O):O.remove();let n=e.hessen.arrived<e.hessen.total;_.hidden=!1,y.textContent=`Hessen herunterladen`,y.disabled=!n,y.classList.toggle(`hessen-download`,n),e.visit?(v.hidden=!1,v.textContent=`Kacheln: ${e.visit.arrived} von ${e.visit.total}`):(v.hidden=!0,v.textContent=``)},re=()=>{a.open||(k=!0,S.textContent=`Den ganzen Cache löschen?`,C.textContent=`Alle Kacheln werden gelöscht.`,w.textContent=`Löschen`,a.showModal())};t.subscribe(te),te()}function Ib(e){return e.kacheln.map(e=>`${e.id}:${e.appearance}`).join(`
`)}Lb();async function Lb(){let e=document.querySelector(`#app`);if(e instanceof HTMLElement){navigator.storage?.persist&&navigator.storage.persist(),u({immediate:!0});try{let[t,n]=await Promise.all([Rb(),zb()]),r=await ks({uebersicht:t,cache:m(),marks:ne(),kacheln:w(),config:Xo,viewport:{widthPx:window.innerWidth,heightPx:window.innerHeight},...n===void 0?{}:{standort:n},online:navigator.onLine,appOpen:document.visibilityState===`visible`});Fb(e,r,t),S(),Bb(r)}catch(t){As(e,t)}}}async function Rb(){let e=await fetch(`/uebersicht.json`);if(!e.ok)throw Error(`Übersicht fehlt`);return await e.json()}function zb(){return navigator.geolocation?new Promise(e=>{navigator.geolocation.getCurrentPosition(t=>{e(Jo(t.coords.longitude,t.coords.latitude))},t=>{t.code===t.TIMEOUT?e(void 0):e(`denied`)},{maximumAge:3e4,timeout:2e3})}):Promise.resolve(`denied`)}function Bb(e){let t=null,n=n=>{t?.(),t=null,n&&(t=Yo(t=>e.reportStandort(t)))};document.addEventListener(`visibilitychange`,()=>{document.visibilityState===`visible`?(e.setAppOpen(!0),n(!0)):(n(!1),e.setAppOpen(!1))}),window.addEventListener(`online`,()=>e.setOnline(!0)),window.addEventListener(`offline`,()=>e.setOnline(!1)),n(document.visibilityState===`visible`)}
`,e.append(i,r,a);let o=i.querySelector(`#ziele`),s=i.querySelector(`.fold-toggle`),c=i.querySelector(`#einstellungen`),l=i.querySelector(`.einstellungen-toggle`),u=i.querySelector(`form`),d=i.querySelector(`input[name="gitter"]`),f=i.querySelector(`input[name="rechtswert"]`),p=i.querySelector(`input[name="hochwert"]`),m=i.querySelector(`.ziel-list`),h=i.querySelector(`.actions button`),g=i.querySelector(`.download-knopf input`),_=i.querySelector(`.gebiet`),v=i.querySelector(`.gebiet p`),y=i.querySelector(`.gebiet button`),b=i.querySelector(`.wipe`),x=i.querySelector(`.notice`),S=a.querySelector(`.ask`),C=a.querySelector(`.explain`),w=a.querySelector(`.confirm`),T=a.querySelector(`.cancel`);if(!o||!s||!c||!l||!u||!d||!f||!p||!m||!h||!g||!_||!v||!y||!b||!x||!S||!C||!w||!T)return;let E=t.snapshot();d.value=E.koordinate.gitter,f.value=E.koordinate.rechtswert,p.value=E.koordinate.hochwert;let D=Mb(r,n,t),O=document.createElement(`button`);O.type=`button`,O.className=`map-download icon-button`,O.setAttribute(`aria-label`,`Diese Ansicht herunterladen`),O.title=`Diese Ansicht herunterladen`,O.innerHTML=zb,O.addEventListener(`click`,()=>t.downloadView());let k=!1,ee=Ib(t.snapshot());u.addEventListener(`submit`,e=>{e.preventDefault(),t.enterKoordinate({gitter:d.value,rechtswert:f.value,hochwert:p.value})}),s.addEventListener(`click`,()=>{let e=o.hasAttribute(`hidden`);o.toggleAttribute(`hidden`,!e),s.setAttribute(`aria-expanded`,e?`true`:`false`)}),l.addEventListener(`click`,()=>{let e=c.hasAttribute(`hidden`);c.toggleAttribute(`hidden`,!e),l.setAttribute(`aria-expanded`,e?`true`:`false`)}),h.addEventListener(`click`,()=>t.centerOnStandort()),g.addEventListener(`change`,()=>{t.setDownloadKnopf(g.checked)}),y.addEventListener(`click`,()=>{y.disabled||t.startHessen()}),b.addEventListener(`click`,()=>re()),w.addEventListener(`click`,()=>{let e=k;k=!1,a.close(),e&&t.deleteCache()}),T.addEventListener(`click`,()=>{k=!1,a.open&&a.close()}),a.addEventListener(`cancel`,()=>{k=!1});let te=()=>{let e=t.snapshot();D.apply(e);let n=Ib(e);n!==ee&&(ee=n,D.refreshTiles()),ne(e)},ne=e=>{m.replaceChildren();for(let n of e.ziele){let e=document.createElement(`li`),r=document.createElement(`button`);r.type=`button`,r.className=`secondary ziel-open`,r.textContent=n.entfernung?`${n.koordinate} ${n.entfernung.text}`:n.koordinate,r.addEventListener(`click`,()=>t.centerOnZiel(n.koordinate));let i=document.createElement(`button`);i.type=`button`,i.className=`secondary`,i.textContent=`Löschen`,i.addEventListener(`click`,()=>t.deleteZiel(n.koordinate)),e.append(r,i),m.append(e)}e.notice?(x.hidden=!1,x.textContent=e.notice):(x.hidden=!0,x.textContent=``),g.checked=e.downloadKnopf,e.downloadKnopf?r.append(O):O.remove();let n=e.hessen.arrived<e.hessen.total;_.hidden=!1,y.textContent=`Hessen herunterladen`,y.disabled=!n,y.classList.toggle(`hessen-download`,n),e.visit?(v.hidden=!1,v.textContent=`Kacheln: ${e.visit.arrived} von ${e.visit.total}`):(v.hidden=!0,v.textContent=``)},re=()=>{a.open||(k=!0,S.textContent=`Den ganzen Cache löschen?`,C.textContent=`Alle Kacheln werden gelöscht.`,w.textContent=`Löschen`,a.showModal())};t.subscribe(te),te()}function Ib(e){return e.kacheln.map(e=>`${e.id}:${e.appearance}`).join(`
`)}var Lb=`<svg class="glyph" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M6.5 2.2h1.7V21h-1.7z"/><path fill="#b42318" d="M8.2 3.6 17.4 8.4 8.2 13.2z"/></svg>`,Rb=`<svg class="glyph" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" fill-rule="evenodd" d="M10.59 5.55L9.69 1.45L14.31 1.45L13.41 5.55L15.56 6.44L17.82 2.9L21.1 6.18L17.56 8.44L18.45 10.59L22.55 9.69L22.55 14.31L18.45 13.41L17.56 15.56L21.1 17.82L17.82 21.1L15.56 17.56L13.41 18.45L14.31 22.55L9.69 22.55L10.59 18.45L8.44 17.56L6.18 21.1L2.9 17.82L6.44 15.56L5.55 13.41L1.45 14.31L1.45 9.69L5.55 10.59L6.44 8.44L2.9 6.18L6.18 2.9L8.44 6.44ZM12 9.1a2.9 2.9 0 1 0 .01 0z"/></svg>`,zb=`<svg class="glyph" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M11 2.5h2v9.1l2.9-2.9 1.4 1.4L12 15.9 6.7 10.1l1.4-1.4 2.9 2.9V2.5zM4.2 18.2h15.6V21H4.2z"/></svg>`,Bb=`<svg class="strike" viewBox="0 0 24 24" aria-hidden="true"><line x1="3" y1="21" x2="21" y2="3" stroke="#e7e1d4" stroke-width="4.5" stroke-linecap="round"/><line x1="3" y1="21" x2="21" y2="3" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>`;Vb();async function Vb(){let e=document.querySelector(`#app`);if(e instanceof HTMLElement){navigator.storage?.persist&&navigator.storage.persist(),u({immediate:!0});try{let[t,n]=await Promise.all([Hb(),Ub()]),r=await ks({uebersicht:t,cache:m(),marks:ne(),kacheln:w(),config:Xo,viewport:{widthPx:window.innerWidth,heightPx:window.innerHeight},...n===void 0?{}:{standort:n},online:navigator.onLine,appOpen:document.visibilityState===`visible`});Fb(e,r,t),S(),Wb(r)}catch(t){As(e,t)}}}async function Hb(){let e=await fetch(`/uebersicht.json`);if(!e.ok)throw Error(`Übersicht fehlt`);return await e.json()}function Ub(){return navigator.geolocation?new Promise(e=>{navigator.geolocation.getCurrentPosition(t=>{e(Jo(t.coords.longitude,t.coords.latitude))},t=>{t.code===t.TIMEOUT?e(void 0):e(`denied`)},{maximumAge:3e4,timeout:2e3})}):Promise.resolve(`denied`)}function Wb(e){let t=null,n=n=>{t?.(),t=null,n&&(t=Yo(t=>e.reportStandort(t)))};document.addEventListener(`visibilitychange`,()=>{document.visibilityState===`visible`?(e.setAppOpen(!0),n(!0)):(n(!1),e.setAppOpen(!1))}),window.addEventListener(`online`,()=>e.setOnline(!0)),window.addEventListener(`offline`,()=>e.setOnline(!1)),n(document.visibilityState===`visible`)}