rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Karte: Follow-Mode + Live-Strecke bei Routen-Aufzeichnung (Wunsch Rene)

Browse source 
- MapGLMini-Polyline hatte KEIN addLatLng (nur setLatLngs) -> TypeError im
  Rec-Overlay: Strecke unsichtbar, Marker fror ein, kein Folgen. Facade
  ergaenzt (Leaflet-kompatibel).
- Rec-Overlay (routes.js): Follow-Mode default AN — Karte wandert mit dem
  Standort, Drag pausiert, Crosshair-Button (unten rechts) reaktiviert;
  erster Fix setzt Zoom 16, danach bleibt der Zoom erhalten
- Zentrale Karte (map.js): Standort-Button aktiviert Follow (+Toast),
  dragstart beendet es (beide Engines); GPS-Tracking folgt sanft (easeTo);
  Aufzeichnung startet im Follow-Mode, _updateRecMap pant nur noch im Follow
Bump v1238
This commit is contained in:
rene 2026-06-06 17:20:38 +02:00
parent 2cdb743ce7
commit abd7447d29
8 changed files with 61 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

14
backend/static/js/pages/map.js
View file

@ -17,6 +17,7 @@ window.Page_map = (() => {
let _tileLayer = null;
let _usingVector = false; // true wenn Vektor-Basemap (PMTiles) statt OSM-Raster
let _engineGL = false; // true wenn MapLibre GL statt Leaflet (zentrale Karte)
let _followGps = false; // Karte folgt dem Standort (Standort-Button an, Drag aus)
let _maplibreLoaded = false;
let _glLayersReady = false; // GL: POI-Sources/Layer angelegt?
let _pmtilesProtoReg = false; // pmtiles-Protokoll bei MapLibre registriert?
@ -364,6 +365,10 @@ window.Page_map = (() => {
_sdEl?.classList.remove('open');
if (_userPos) {
_mapSetView(_userPos.lat, _userPos.lon, 16);
// Follow-Mode (René 2026-06-08): Karte wandert ab jetzt mit dem Standort;
// manuelles Verschieben beendet das Folgen (dragstart-Listener im Map-Init).
_followGps = true;
UI.toast.info('Karte folgt deinem Standort — zum Beenden Karte verschieben.');
} else {
UI.toast.error('Standort noch nicht verfügbar.');
}
@ -744,6 +749,7 @@ window.Page_map = (() => {
window.addEventListener('resize', () => _map.invalidateSize());
_map.on('moveend zoomend', () => { _autoRetryCount = 0; _updateZoomDisplay(); _scheduleOsmLoad(); });
_map.on('dragstart', () => { _followGps = false; }); // manuelles Verschieben beendet Follow
setTimeout(() => { _updateZoomDisplay(); _scheduleOsmLoad(); }, 800);
// Fadenkreuz-Animation beim Kartenverschieben
@ -921,6 +927,7 @@ window.Page_map = (() => {
_map.on('movestart', () => {
document.getElementById('map-crosshair')?.classList.add('dragging');
});
_map.on('dragstart', () => { _followGps = false; }); // manuelles Verschieben beendet Follow
window.addEventListener('resize', _mapResize);
setTimeout(_mapResize, 100);
@ -1070,6 +1077,7 @@ window.Page_map = (() => {
_locationMarker = new maplibregl.Marker({ element: elx, anchor: 'center' })
.setLngLat([lon, lat]).addTo(_map);
}
if (_followGps && !_recActive) _map.easeTo({ center: [lon, lat], duration: 600 });
},
() => {},
{ enableHighAccuracy: true, maximumAge: 5000, timeout: 15000 }
@ -1102,6 +1110,7 @@ window.Page_map = (() => {
icon, zIndexOffset: 500, interactive: false,
}).addTo(_map);
}
if (_followGps && !_recActive) _map.panTo([lat, lon]);
},
() => {},
{ enableHighAccuracy: true, maximumAge: 5000, timeout: 15000 }
@ -2564,6 +2573,7 @@ window.Page_map = (() => {
document.addEventListener('visibilitychange', _onVisibilityChange);
_recTimerInt = setInterval(_updateRecStatus, 1000);
_followGps = true; // Aufzeichnung startet im Follow-Mode (Drag pausiert, Standort-Button reaktiviert)
_recWatchId = navigator.geolocation.watchPosition(
pos => {
@ -2690,7 +2700,7 @@ window.Page_map = (() => {
if (_engineGL) {
_recTrackGL();
_updateRecMarker(lat, lon);
_map.panTo([lon, lat]); // MapLibre: [lng,lat]
if (_followGps) _map.panTo([lon, lat]); // MapLibre: [lng,lat] — Drag pausiert Follow
return;
}
if (!window.L) return;
@ -2701,7 +2711,7 @@ window.Page_map = (() => {
_recPolyline.addLatLng(ll);
}
_updateRecMarker(lat, lon);
_map.panTo(ll);
if (_followGps) _map.panTo(ll);
}
function _updateRecStatus() {