simplify application and remove window references

public/js/api-client.js

@@ -8,4 +8,4 @@
     routes: position => request('/routes' + (position ? `?lat=${encodeURIComponent(position.lat)}&lon=${encodeURIComponent(position.lon)}&radiusKm=${ns.Config.routeRadiusKm}` : '')),
     route: id => request(`/routes/${encodeURIComponent(id)}`)
   };
-}(window.Wegwichtel, window.jQuery));
+}(globalThis.Wegwichtel, globalThis.jQuery));

public/js/app.js

@@ -9,7 +9,6 @@
     routeState: 'idle',
     activePage: null,
     routeProgressIndex: null,
-    activePoiId: null,
     deviceHeading: null
   };
 
@@ -21,7 +20,7 @@
     $(document)
       .on('pointerup', selector, function (event) {
         const pointer = event.originalEvent;
-        if (pointer && pointer.isPrimary === false) return;
+        if (pointer?.isPrimary === false) return;
         if (pointer?.pointerType === 'mouse' && pointer.button !== 0) return;
         event.preventDefault();
         handler.call(this, event);
@@ -38,10 +37,10 @@
     if (!target.length) throw new Error(`Unbekannte Ansicht: ${pageSelector}`);
 
     const previous = state.activePage;
-    $('.app-page').attr('hidden', true).removeClass('is-active');
-    target.removeAttr('hidden').addClass('is-active');
+    $('.app-page').attr('hidden', true);
+    target.removeAttr('hidden');
     state.activePage = pageSelector;
-    window.scrollTo({ top: 0, behavior: options.instant ? 'auto' : 'smooth' });
+    globalThis.scrollTo({ top: 0, behavior: options.instant ? 'auto' : 'smooth' });
 
     if (options.updateHistory === false) return;
     const historyState = { page: pageSelector, previous };
@@ -52,7 +51,7 @@
   function normalizeSearch(value) {
     return String(value ?? '')
       .normalize('NFKD')
-      .replace(/[\u0300-\u036f]/g, '')
+      .replaceAll(/[\u0300-\u036f]/g, '')
       .toLocaleLowerCase('de');
   }
 
@@ -172,11 +171,10 @@
   }
 
   function setActivePoi(poiId) {
-    state.activePoiId = poiId == null ? null : Number(poiId);
     $('#poi-list [data-poi-id]').removeAttr('aria-current');
-    if (state.activePoiId != null) {
-      $(`#poi-list [data-poi-id="${state.activePoiId}"]`).attr('aria-current', 'step');
-    }
+    if (poiId == null) return;
+
+    $(`#poi-list [data-poi-id="${Number(poiId)}"]`).attr('aria-current', 'step');
   }
 
   function endRoute({ announce = true, returnToRoutes = false } = {}) {
@@ -451,7 +449,7 @@
     const metrics = updatePoiIndicators(position);
     if (state.routeState !== 'running') return;
 
-    let nearest = nearestPendingPoi(metrics);
+    const nearest = nearestPendingPoi(metrics);
     updateNavigation(position);
 
     $('#tracking-status').text(
@@ -463,7 +461,6 @@
       state.triggered.add(nearest.poi.id);
       ns.Vibration.start(ns.Vibration.Patterns.ACTIVE_POI);
       showPoi(nearest.poi);
-      nearest = nearestPendingPoi(metrics);
       updateNavigation(position);
     }
   }
@@ -545,7 +542,7 @@
       endRoute({ returnToRoutes: true });
     });
 
-    window.addEventListener('popstate', event => {
+    globalThis.addEventListener('popstate', event => {
       const page = event.state?.page || '#routes-page';
       navigate(page, { updateHistory: false, instant: true });
     });
@@ -587,4 +584,4 @@
       hideNavigation();
     }
   };
-}(window.Wegwichtel, window.jQuery));
+}(globalThis.Wegwichtel, globalThis.jQuery));

public/js/audio-player.js

@@ -36,4 +36,4 @@
 
     unload
   };
-}(window.Wegwichtel, window.jQuery));
+}(globalThis.Wegwichtel, globalThis.jQuery));

public/js/bootstrap-loader.js

@@ -41,7 +41,7 @@
   }
 
   function initializeJqueryUi() {
-    const $ = window.jQuery;
+    const $ = globalThis.jQuery;
     $('#bootstrap-retry').button({ icon: 'ui-icon-refresh' });
     $('.back-button').button();
     $('#clear-route-search').button({ icon: 'ui-icon-close', showLabel: false });
@@ -56,7 +56,7 @@
     try {
       await loadScript(
         `vendor/jquery/jquery-${versions.jquery}.min.js`,
-        () => window.jQuery?.fn?.jquery === versions.jquery
+        () => globalThis.jQuery?.fn?.jquery === versions.jquery
       );
       mark('jquery', 'done');
 
@@ -64,20 +64,20 @@
       await loadStyle('css/app.css');
       await loadScript(
         `vendor/jquery-ui/jquery-ui-${versions.jqueryUi}.min.js`,
-        () => window.jQuery?.ui?.version === versions.jqueryUi
+        () => globalThis.jQuery?.ui?.version === versions.jqueryUi
       );
       initializeJqueryUi();
       mark('jquery-ui', 'done');
 
       for (const module of ['config', 'api-client', 'distance', 'geolocation', 'orientation', 'slideshow', 'audio-player', 'vibration', 'app']) {
-        await loadScript(`js/${module}.js`, () => Boolean(window.Wegwichtel));
+        await loadScript(`js/${module}.js`, () => Boolean(globalThis.Wegwichtel));
       }
       mark('modules', 'done');
 
-      await window.Wegwichtel.App.initialize({ markStep: mark });
+      await globalThis.Wegwichtel.App.initialize({ markStep: mark });
       document.getElementById('bootstrap-screen').hidden = true;
       document.getElementById('app-shell').hidden = false;
-      window.Wegwichtel.App.navigate('#routes-page', { replace: true });
+      globalThis.Wegwichtel.App.navigate('#routes-page', { replace: true });
     } catch (error) {
       console.error(error);
       const current = steps.find(step => !document.querySelector(`[data-step="${step}"]`)?.classList.contains('done'));

public/js/config.js

@@ -1,2 +1,2 @@
-window.Wegwichtel = window.Wegwichtel || {};
-window.Wegwichtel.Config = Object.freeze({ apiBase: '/api', routeRadiusKm: 25, geolocationTimeoutMs: 12000 });
+globalThis.Wegwichtel ??= {};
+globalThis.Wegwichtel.Config = Object.freeze({ apiBase: '/api', routeRadiusKm: 25, geolocationTimeoutMs: 12000 });

public/js/distance.js

@@ -30,4 +30,4 @@
       return meters < 1000 ? `${Math.round(meters)} m` : `${(meters / 1000).toFixed(1)} km`;
     }
   };
-}(window.Wegwichtel));
+}(globalThis.Wegwichtel));

public/js/geolocation.js

@@ -1,8 +1,17 @@
 (function (ns) {
   'use strict';
 
+  const WATCH_OPTIONS = Object.freeze({
+    enableHighAccuracy: true,
+    timeout: 20000,
+    maximumAge: 5000
+  });
   let watchId = null;
 
+  function geolocation() {
+    return globalThis.navigator?.geolocation;
+  }
+
   function normalize(position) {
     return {
       lat: position.coords.latitude,
@@ -15,19 +24,24 @@
     };
   }
 
+  function unsupportedError() {
+    return new Error('Dieses Gerät unterstützt keine Geolokalisierung.');
+  }
+
   ns.Geo = {
     current() {
       return new Promise((resolve, reject) => {
-        if (!navigator.geolocation) {
-          reject(new Error('Dieses Gerät unterstützt keine Geolokalisierung.'));
+        const service = geolocation();
+        if (!service) {
+          reject(unsupportedError());
           return;
         }
 
-        navigator.geolocation.getCurrentPosition(
+        service.getCurrentPosition(
           position => resolve(normalize(position)),
           reject,
           {
-            enableHighAccuracy: true,
+            ...WATCH_OPTIONS,
             timeout: ns.Config.geolocationTimeoutMs,
             maximumAge: 30000
           }
@@ -37,25 +51,23 @@
 
     start(callback, onError) {
       this.stop();
-      if (!navigator.geolocation) {
-        onError?.(new Error('Dieses Gerät unterstützt keine Geolokalisierung.'));
+      const service = geolocation();
+      if (!service) {
+        onError?.(unsupportedError());
         return;
       }
 
-      watchId = navigator.geolocation.watchPosition(
+      watchId = service.watchPosition(
         position => callback(normalize(position)),
         onError,
-        {
-          enableHighAccuracy: true,
-          timeout: 20000,
-          maximumAge: 5000
-        }
+        WATCH_OPTIONS
       );
     },
 
     stop() {
-      if (watchId != null) navigator.geolocation.clearWatch(watchId);
+      const service = geolocation();
+      if (watchId != null) service?.clearWatch(watchId);
       watchId = null;
     }
   };
-}(window.Wegwichtel));
+}(globalThis.Wegwichtel));

public/js/orientation.js

@@ -22,7 +22,7 @@
   }
 
   async function requestPermission() {
-    const orientation = window.DeviceOrientationEvent;
+    const orientation = globalThis.DeviceOrientationEvent;
     if (!orientation) return false;
 
     if (typeof orientation.requestPermission === 'function') {
@@ -51,14 +51,14 @@
         if (heading != null) callback?.(heading);
       };
 
-      eventNames.forEach(name => window.addEventListener(name, listener, true));
+      eventNames.forEach(name => globalThis.addEventListener(name, listener, true));
       return true;
     },
 
     stop() {
-      if (listener) eventNames.forEach(name => window.removeEventListener(name, listener, true));
+      if (listener) eventNames.forEach(name => globalThis.removeEventListener(name, listener, true));
       listener = null;
       callback = null;
     }
   };
-}(window.Wegwichtel));
+}(globalThis.Wegwichtel));

public/js/slideshow.js

@@ -9,7 +9,7 @@
     $(document)
       .on('pointerup', selector, function (event) {
         const pointer = event.originalEvent;
-        if (pointer && pointer.isPrimary === false) return;
+        if (pointer?.isPrimary === false) return;
         if (pointer?.pointerType === 'mouse' && pointer.button !== 0) return;
         event.preventDefault();
         handler.call(this, event);
@@ -29,7 +29,6 @@
   function render() {
     const hasImages = images.length > 0;
     $('#slideshow').toggle(hasImages);
-    $('#slide-controls').attr('data-image-count', images.length);
     if (!hasImages) return;
 
     const image = images[index];
@@ -86,4 +85,4 @@
       if (deltaX < 0) ns.Slideshow.next();
       else ns.Slideshow.previous();
     });
-}(window.Wegwichtel, window.jQuery));
+}(globalThis.Wegwichtel, globalThis.jQuery));

public/js/vibration.js

@@ -30,7 +30,7 @@
     if (!Number.isFinite(duration) || duration < 0) {
       throw new TypeError('Die Vibrationsdauer muss eine nichtnegative Millisekundenangabe sein.');
     }
-    return duration;
+    return [duration];
   }
 
   function start(pattern = Patterns.LONG) {
@@ -50,4 +50,4 @@
     start,
     stop
   });
-}(window.Wegwichtel));
+}(globalThis.Wegwichtel));