IT-Works/Wegwichtel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update editor and add tests

Browse Source
This commit is contained in:
Florian Zumpe
2026-09-26 20:40:05 +02:00
parent bdc0aabc07
commit 96b379d8d6
14 changed files with 2099 additions and 587 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+48 -45
View File
@@ -26,7 +26,6 @@
<span aria-hidden="true">🧭</span>
<h1>Wegwichtel</h1>
<p>Der Wegwichtel bereitet Routen und Medien vor.</p>
<div class="privacy-summary">
<p><strong>Cookies:</strong> Diese Anwendung setzt derzeit keine Cookies und verwendet weder Werbung noch Tracking.</p>
<label class="switch-row switch-disabled">
@@ -47,7 +46,6 @@
</label>
</div>
<p id="storage-cleanup-status" class="storage-cleanup-status" hidden></p>
<progress id="bootstrap-progress" max="6" value="0"></progress>
<ol id="bootstrap-steps">
<li data-step="jquery">jQuery laden</li>
@@ -64,11 +62,30 @@
</section>
</div>
<main id="app-shell" hidden>
<div class="route-control">
<button id="route-control-button" class="route-control-button" type="button" aria-label="Strecke auswählen oder wechseln" title="Strecke auswählen oder wechseln" aria-haspopup="true" aria-expanded="false" aria-controls="route-control-dropdown">
<strong id="route-control-title">Route wählen</strong>
<small id="route-control-next">Aktive und lokale Strecken</small>
</button>
<nav id="route-control-dropdown" class="route-control-dropdown" aria-label="Streckenauswahl und Streckenverwaltung" hidden>
<section aria-labelledby="route-control-server-title">
<h2 id="route-control-server-title">Aktive Strecken</h2>
<ul id="route-control-server-list" class="route-control-list" aria-live="polite"></ul>
</section>
<section aria-labelledby="route-control-local-title">
<h2 id="route-control-local-title">Lokale Strecken</h2>
<ul id="route-control-local-list" class="route-control-list" aria-live="polite"></ul>
</section>
<div class="route-control-actions">
<button id="editor-button" class="editor-button" type="button" aria-label="Streckenverwaltung öffnen" title="Streckenverwaltung öffnen" aria-haspopup="dialog" aria-expanded="false" aria-controls="editor-dialog">Strecken verwalten</button>
<button id="route-control-new" class="editor-primary-button" type="button">Neue lokale Strecke</button>
</div>
</nav>
</div>
<section id="routes-page" class="app-page">
<header>
<h1>Wegwichtel</h1>
</header>
<div class="content">
<p id="location-hint" class="notice">Standort wird für nahe Routen lokal auf diesem Gerät ermittelt.</p>
@@ -81,7 +98,6 @@
<section>
<h2>Alle Routen</h2>
<label for="route-search">Routen durchsuchen</label>
<div class="search-row">
<input
id="route-search"
@@ -96,15 +112,12 @@
<li><p>Routen werden geladen …</p></li>
</ul>
</section>
<section class="editor-entry-panel" aria-labelledby="editor-entry-title">
<div>
<h2 id="editor-entry-title">Strecken verwalten</h2>
<p>Strecken, Stationen, Bilder und Audiodateien bearbeiten.</p>
</div>
<button id="editor-button" class="editor-button" type="button" aria-label="Streckeneditor öffnen" title="Streckeneditor öffnen" aria-haspopup="dialog" aria-expanded="false" aria-controls="editor-dialog">
<span aria-hidden="true">+</span>
</button>
<section aria-labelledby="local-route-title">
<h2 id="local-route-title">Lokale Strecken</h2>
<p>Diese Entwürfe bestehen aus GPX- und JSON-Daten und sind ausschließlich in diesem Browser gespeichert.</p>
<ul id="local-route-list" class="route-list" aria-live="polite">
<li><p>Lokale Strecken werden geladen …</p></li>
</ul>
</section>
</div>
</section>
@@ -115,7 +128,6 @@
</button>
<h1 id="route-title">Route</h1>
</header>
<div class="content">
<p id="route-description"></p>
<dl>
@@ -140,7 +152,6 @@
<ul id="poi-list" class="route-list"></ul>
</div>
</section>
<section id="poi-page" class="app-page" hidden>
<header class="has-back-button">
<button class="back-button" type="button" data-page-target="#route-page" aria-label="Zurück zur Route" title="Zurück zur Route">
@@ -225,11 +236,14 @@
<input class="progress-storage-toggle" type="checkbox" role="switch" aria-checked="false">
<span class="switch-track" aria-hidden="true"></span>
</label>
<h3>5. Cookies und Tracking</h3>
<h3>5. Lokale Streckenentwürfe</h3>
<p>Neu angelegte Strecken werden zunächst ausschließlich im Local Storage dieses Browsers gespeichert. Die GPX-Daten enthalten den Streckenverlauf und die POI-Koordinaten. Ergänzende JSON-Daten ordnen den POIs Texte, Audiodateien und Bilder zu. Medien werden dafür als lokale Browserdaten gespeichert.</p>
<p>Lokale Streckenentwürfe sind bewusst von der freiwilligen Fortschrittsspeicherung getrennt. Sie werden nicht durch die 24-Stunden-Bereinigung entfernt und beim Ausschalten der Fortschrittsspeicherung nicht gelöscht. Sie verbleiben im Browser, bis sie ausdrücklich gelöscht werden oder die Browserdaten entfernt werden. Eine Übertragung an den Server findet derzeit nicht statt.</p>
<h3>6. Cookies und Tracking</h3>
<p>Die Anwendung setzt derzeit keine Cookies. Sie verwendet keine Reichweitenmessung, keine personalisierte Werbung und keine Trackingdienste. Eine technisch notwendige Local-Storage-Einstellung merkt sich lediglich, ob die freiwillige Speicherung des Streckenfortschritts aktiviert wurde.</p>
<h3>6. Inhalte von Schülerinnen und Schülern</h3>
<h3>7. Inhalte von Schülerinnen und Schülern</h3>
<p>Fotos, Texte und Sprachaufnahmen dürfen nur veröffentlicht werden, wenn die erforderlichen Rechte und Einwilligungen vorliegen. Besonders bei erkennbaren Kindern sind die Vorgaben der Schule und die Einwilligungen der Sorgeberechtigten zu beachten.</p>
<h3>7. Rechte betroffener Personen</h3>
<h3>8. Rechte betroffener Personen</h3>
<p>Betroffene Personen können je nach rechtlicher Voraussetzung Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch verlangen. Erteilte Einwilligungen können für die Zukunft widerrufen werden. Außerdem besteht das Recht, sich bei einer Datenschutzaufsichtsbehörde über die Verarbeitung personenbezogener Daten zu beschweren.</p>
<p>
Zuständige Datenschutzaufsicht:<br>
@@ -250,7 +264,6 @@
Zum Eichig 3<br>
98617 Meiningen / OT Herpf
</p>
<h3>Kontakt</h3>
<p>
Telefon: (036943) 63722<br>
@@ -268,7 +281,6 @@
</p>
<h3>Inhaltlich verantwortlich</h3>
<p>Frau Wichert</p>
<h3>Weitere Pflichtangaben</h3>
<p>Je nach konkretem Betrieb der Wegwichtel-Instanz können zusätzliche Angaben erforderlich sein, zum Beispiel zur technischen Betreiberin, zum Hosting oder zu ergänzenden Zuständigkeiten. Nicht benötigte Angaben sind zu entfernen.</p>
<h3>Haftung für Inhalte und Verweise</h3>
@@ -289,6 +301,7 @@
</label>
<h3>Local Storage</h3>
<p>Der Browser kann auf Wunsch Streckenfortschritte lokal speichern. Verwendet werden die Schlüssel <code>wegwichtel.privacy.v1</code> für die gewählte Einstellung und <code>wegwichtel.route-progress.v1</code> für die freiwilligen Streckendaten. Die Streckendaten werden nach 24 Stunden bereinigt oder beim Ausschalten sofort entfernt.</p>
<p>Lokale Streckenentwürfe werden getrennt davon unter <code>wegwichtel.local-routes.v1.*</code> gespeichert. Pro Entwurf werden GPX- und JSON-Daten vorgehalten; Bilder und Audiodateien liegen als Bestandteil der lokalen JSON-Daten im Browser. Diese Entwürfe werden nicht nach 24 Stunden bereinigt und sind nicht vom Schalter für den Streckenfortschritt abhängig. Durch Mediendateien kann das Speicherlimit des Browsers vergleichsweise schnell erreicht werden.</p>
<label class="switch-row compact-switch">
<span>
<strong>Streckenfortschritt lokal speichern</strong>
@@ -301,7 +314,7 @@
<ul>
<li><strong>jQuery 4.0.0:</strong> DOM-Zugriffe, Ereignisbehandlung und API-Anfragen.</li>
<li><strong>jQuery UI 1.14.2:</strong> Schaltflächen und Suchvorschläge.</li>
<li><strong>Wegwichtel-Module:</strong> Routenanzeige, Navigation, Standort, Geräteausrichtung, Bilder, Audio, Vibration, Datenschutz und lokaler Fortschritt.</li>
<li><strong>Wegwichtel-Module:</strong> Routenanzeige, Navigation, Standort, Geräteausrichtung, Bilder, Audio, Vibration, Datenschutz, lokaler Fortschritt und lokale Streckenentwürfe.</li>
</ul>
<p>Alle Bibliotheken werden vom eigenen Server ausgeliefert. Die Anwendung lädt keine JavaScripts, Schriftarten oder Analysepixel von externen Anbietern.</p>
<h3>Browser-Schnittstellen</h3>
@@ -310,42 +323,38 @@
<li>Device Orientation API für den Richtungspfeil,</li>
<li>Vibration API für Hinweise bei erreichten Stationen,</li>
<li>HTML-Audio und HTML-Bilder für lokal bereitgestellte Medien,</li>
<li>FileReader und XML-Schnittstellen zum lokalen Verarbeiten von GPX-, Bild- und Audiodateien,</li>
<li>History API für die Navigation zwischen den Ansichten.</li>
</ul>
<h3>Technische Grenzen</h3>
<p>Browser und Betriebssystem können Standort, Kompass, Audio, Vibration oder Local Storage sperren. Die Anwendung bleibt grundsätzlich nutzbar, einzelne Komfortfunktionen können dann jedoch fehlen.</p>
<p>Browser und Betriebssystem können Standort, Kompass, Audio, Vibration oder Local Storage sperren. Die Anwendung bleibt grundsätzlich nutzbar, einzelne Komfortfunktionen können dann jedoch fehlen. Für lokale Streckenentwürfe gilt zusätzlich das vom Browser vorgegebene Local-Storage-Limit.</p>
</article>
</div>
</div>
</dialog>
<dialog id="editor-dialog" class="editor-dialog" aria-labelledby="editor-dialog-title">
<div class="editor-dialog-shell">
<header class="editor-dialog-header">
<h2 id="editor-dialog-title">Streckeneditor</h2>
<button id="editor-close" type="button" aria-label="Streckeneditor schließen" title="Schließen">×</button>
<h2 id="editor-dialog-title">Streckenverwaltung</h2>
<button id="editor-close" type="button" aria-label="Streckenverwaltung schließen" title="Schließen">×</button>
</header>
<output id="editor-status" class="editor-status" aria-live="polite" hidden></output>
<section id="editor-route-list-view" class="editor-view" aria-labelledby="editor-route-list-title">
<div class="editor-toolbar">
<h3 id="editor-route-list-title">Vorhandene Strecken</h3>
<button id="editor-new-route" class="editor-round-button" type="button" aria-label="Neue Strecke anlegen" title="Neue Strecke anlegen">
<button id="editor-new-route" class="editor-round-button" type="button" aria-label="Neue lokale Strecke anlegen" title="Neue lokale Strecke anlegen">
<span aria-hidden="true">+</span>
</button>
</div>
<p class="editor-muted">Veröffentlichte Serverstrecken und ausschließlich in diesem Browser gespeicherte Entwürfe werden getrennt dargestellt.</p>
<ul id="editor-route-list" class="editor-route-list" aria-live="polite"></ul>
</section>
<section id="editor-route-detail-view" class="editor-view" aria-labelledby="editor-route-detail-title" hidden>
<div class="editor-toolbar editor-toolbar-back">
<button id="editor-route-back" class="editor-secondary-button" type="button">Zurück</button>
<h3 id="editor-route-detail-title">Streckendetails</h3>
</div>
<form id="editor-route-form" class="editor-form">
<input id="editor-route-id" type="hidden">
<label for="editor-route-name">Name der Strecke</label>
@@ -353,24 +362,21 @@
<label for="editor-route-description">Beschreibung</label>
<textarea id="editor-route-description" rows="4"></textarea>
<label for="editor-route-gpx">GPX-Datei optional ersetzen oder ergänzen</label>
<label for="editor-route-gpx">GPX-Datei importieren oder ersetzen</label>
<input id="editor-route-gpx" type="file" accept=".gpx,application/gpx+xml,text/xml,application/xml">
<p id="editor-route-activated" class="editor-muted">Neue Strecken bleiben unveröffentlicht, bis sie manuell in der Datenbank aktiviert werden.</p>
<p id="editor-route-activated" class="editor-muted">Neue Strecken werden als lokaler GPX-/JSON-Entwurf gespeichert und nicht an den Server übertragen.</p>
<button id="editor-route-save" class="editor-primary-button" type="submit">Strecke speichern</button>
</form>
<div class="editor-toolbar editor-poi-toolbar">
<h3>Stationen</h3>
<button id="editor-add-poi" class="editor-round-button" type="button" aria-label="POI hinzufügen" title="POI hinzufügen">
<button id="editor-add-poi" class="editor-round-button" type="button" aria-label="GPX-POI hinzufügen" title="GPX-POI hinzufügen">
<span aria-hidden="true">+</span>
</button>
</div>
<ol id="editor-poi-list" class="editor-poi-list"></ol>
</section>
<section id="editor-poi-form-view" class="editor-view" aria-labelledby="editor-poi-form-title" hidden>
<div class="editor-toolbar editor-toolbar-back">
<button id="editor-poi-cancel" class="editor-secondary-button" type="button">Zurück zur Strecke</button>
@@ -379,7 +385,6 @@
<form id="editor-poi-form" class="editor-form">
<input id="editor-poi-id" type="hidden">
<label for="editor-poi-title">Titel</label>
<input id="editor-poi-title" type="text" autocomplete="off" required>
@@ -388,19 +393,17 @@
<div class="editor-coordinate-grid">
<label for="editor-poi-lat">Breite</label>
<input id="editor-poi-lat" type="number" inputmode="decimal" step="0.000001">
<input id="editor-poi-lat" type="number" inputmode="decimal" step="0.000001" required>
<label for="editor-poi-lon">Länge</label>
<input id="editor-poi-lon" type="number" inputmode="decimal" step="0.000001">
<input id="editor-poi-lon" type="number" inputmode="decimal" step="0.000001" required>
<label for="editor-poi-radius">Auslöseradius in Metern</label>
<input id="editor-poi-radius" type="number" inputmode="numeric" min="1" step="1" value="25">
</div>
<label for="editor-poi-audio">Audiodatei optional hochladen</label>
<label for="editor-poi-audio">Audiodatei verknüpfen</label>
<input id="editor-poi-audio" type="file" accept="audio/*">
<label for="editor-poi-images">Bilder optional hochladen</label>
<label for="editor-poi-images">Bilder verknüpfen</label>
<input id="editor-poi-images" type="file" accept="image/*" multiple>
<button id="editor-poi-save" class="editor-primary-button" type="submit">Station speichern</button>
@@ -408,7 +411,7 @@
</section>
</div>
</dialog>
<script src="js/local-routes.js?v=0.12.14"></script>
<script src="js/editor-ui.js?v=0.12.14"></script>
<script src="js/privacy-storage.js?v=0.12.14"></script>
<script src="js/legal-ui.js?v=0.12.14"></script>