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

Offline-Karten Runde 4: Minimal-Speicher-Modell (Modell Rene)

Browse source 
Funkloch-Gedaechtnis = Quelle der Wahrheit, Kacheln = ableitbarer Cache:
- Ephemeres Vorausladen: Prefetch-Kacheln werden bei Aufzeichnungsende
  geloescht, wenn die Runde kein Funkloch hatte (nur neue Keys)
- Netz-Probe bei Aufzeichnung (~2min, 6s-Timeout): erkennt Funkloecher auch
  in bereits gespeicherten Gebieten (dort kein Remote-Miss als Signal)
- clear() behaelt Zonen (filled=false) -> naechster Online-Start laedt
  Funkloch-Gebiete automatisch neu, auch nach 'Alles loeschen'
- Start-Check mit Position: nur Zonen im 50-km-Umkreis, naechste zuerst,
  Coverage-Verify (faengt Eviction ab); Pfote Segment 5 = alle Zonen gefuellt
- Coverage-Layer zweifarbig: Funkloch orange, manuell blau + Modal-Legende
- Stub-Tests Runde 4 (Prune/Probe/clear/Naehe/Verify/Faerbung) bestanden
Bump v1230
This commit is contained in:
rene 2026-06-06 12:46:12 +02:00
parent 763108fa7c
commit 53bc27faa3
10 changed files with 221 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

2
VERSION
View file

@ -1 +1 @@
1229 1230

24
backend/static/index.html
View file

@ -86,14 +86,14 @@
<title>Ban Yaro</title> <title>Ban Yaro</title>
<!-- Theme + theme-color Statusleiste vor CSS setzen --> <!-- Theme + theme-color Statusleiste vor CSS setzen -->
<script src="/js/boot-early.js?v=1229"></script> <script src="/js/boot-early.js?v=1230"></script>
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung --> <!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
<link rel="stylesheet" href="/css/design-system.css?v=1229"> <link rel="stylesheet" href="/css/design-system.css?v=1230">
<link rel="stylesheet" href="/css/layout.css?v=1229"> <link rel="stylesheet" href="/css/layout.css?v=1230">
<link rel="stylesheet" href="/css/components.css?v=1229"> <link rel="stylesheet" href="/css/components.css?v=1230">
<link rel="stylesheet" href="/css/utilities.css?v=1229"> <link rel="stylesheet" href="/css/utilities.css?v=1230">
<link rel="stylesheet" href="/css/lists.css?v=1229"> <link rel="stylesheet" href="/css/lists.css?v=1230">
</head> </head>
<body> <body>
@ -612,11 +612,11 @@
<div id="modal-container"></div> <div id="modal-container"></div>
<!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features --> <!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features -->
<script src="/js/api.js?v=1229"></script> <script src="/js/api.js?v=1230"></script>
<script src="/js/ui.js?v=1229"></script> <script src="/js/ui.js?v=1230"></script>
<script src="/js/app.js?v=1229"></script> <script src="/js/app.js?v=1230"></script>
<script src="/js/worlds.js?v=1229"></script> <script src="/js/worlds.js?v=1230"></script>
<script src="/js/offline-indicator.js?v=1229"></script> <script src="/js/offline-indicator.js?v=1230"></script>
<!-- Feature-Seiten werden lazy geladen --> <!-- Feature-Seiten werden lazy geladen -->
@ -626,7 +626,7 @@
<!-- Boot: Offline-Banner + SW-Registration (extrahiert für CSP) --> <!-- Boot: Offline-Banner + SW-Registration (extrahiert für CSP) -->
<script src="/js/boot.js?v=1229"></script> <script src="/js/boot.js?v=1230"></script>
</body> </body>

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung. Router, State-Management, Navigation, Initialisierung.
============================================================ */ ============================================================ */
const APP_VER = '1229'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen const APP_VER = '1230'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt
window.APP_VER = APP_VER; // global verfügbar für andere Module (z.B. offline-indicator) window.APP_VER = APP_VER; // global verfügbar für andere Module (z.B. offline-indicator)
window.APP_VERSION = APP_VERSION; window.APP_VERSION = APP_VERSION;

136
backend/static/js/map-offline.js
View file

@ -37,6 +37,7 @@ window.MapOffline = (function () {
} }
var _get = function (k) { return _req(STORE, 'readonly', function (os) { return os.get(k); }); }; var _get = function (k) { return _req(STORE, 'readonly', function (os) { return os.get(k); }); };
var _put = function (k, v) { return _req(STORE, 'readwrite', function (os) { os.put(v, k); }); }; var _put = function (k, v) { return _req(STORE, 'readwrite', function (os) { os.put(v, k); }); };
var _del = function (k) { return _req(STORE, 'readwrite', function (os) { os.delete(k); }); };
var _count = function () { return _req(STORE, 'readonly', function (os) { return os.count(); }); }; var _count = function () { return _req(STORE, 'readonly', function (os) { return os.count(); }); };
var _metaGet = function (k) { return _req(META, 'readonly', function (os) { return os.get(k); }); }; var _metaGet = function (k) { return _req(META, 'readonly', function (os) { return os.get(k); }); };
var _metaPut = function (k, v) { return _req(META, 'readwrite', function (os) { os.put(v, k); }); }; var _metaPut = function (k, v) { return _req(META, 'readwrite', function (os) { os.put(v, k); }); };
@ -291,8 +292,8 @@ window.MapOffline = (function () {
.then(function (gb) { state.bytes += gb; return _cachePois(_bboxAround(lat, lon, radiusKm)); }) .then(function (gb) { state.bytes += gb; return _cachePois(_bboxAround(lat, lon, radiusKm)); })
.then(function (pc) { .then(function (pc) {
poiCount = pc; poiCount = pc;
return _addRegion({ lat: lat, lon: lon, radiusKm: radiusKm, tiles: state.stored, return _addRegion({ type: opts.type || 'gebiet', lat: lat, lon: lon, radiusKm: radiusKm,
bytes: state.bytes, pois: poiCount, savedAt: Date.now() }); tiles: state.stored, bytes: state.bytes, pois: poiCount, savedAt: Date.now() });
}) })
.then(function () { return _bumpTotal(state.bytes); }) .then(function () { return _bumpTotal(state.bytes); })
.then(function () { return { tiles: state.stored, bytes: state.bytes, pois: poiCount, radiusKm: radiusKm }; }); .then(function () { return { tiles: state.stored, bytes: state.bytes, pois: poiCount, radiusKm: radiusKm }; });
@ -311,7 +312,7 @@ window.MapOffline = (function () {
function _bumpTotal(bytes) { function _bumpTotal(bytes) {
if (!bytes) return Promise.resolve(); if (!bytes) return Promise.resolve();
return _metaGet('totalBytes') return _metaGet('totalBytes')
.then(function (t) { return _metaPut('totalBytes', (t || 0) + bytes); }) .then(function (t) { return _metaPut('totalBytes', Math.max(0, (t || 0) + bytes)); })
.catch(function () {}); .catch(function () {});
} }
function _overCap() { function _overCap() {
@ -330,14 +331,23 @@ window.MapOffline = (function () {
} catch (e) {} } catch (e) {}
} }
// {lat,lon} während aktiver Aufzeichnung, sonst null. Nebeneffekt (Runde 3): // {lat,lon} während aktiver Aufzeichnung, sonst null. Nebeneffekte (Runde 3):
// ROLLENDES VORAUSLADEN — solange Empfang da ist, alle ~400 m die fehlenden Kacheln // 1. ROLLENDES VORAUSLADEN — solange Empfang da ist, alle ~400 m die fehlenden Kacheln
// um die aktuelle Position still mitnehmen. Deckt den Weg + die Anfahrt ab, BEVOR // um die aktuelle Position still mitnehmen. EPHEMER: Hatte die Runde KEIN Funkloch,
// man ins Funkloch läuft (greift schon beim ersten Besuch, anders als das Gedächtnis). // wird das Vorausgeladene am Ende wieder gelöscht — gespeichert bleibt nur, was
// wegen fehlenden Netzes nötig ist + manuell Hinzugefügtes (Modell René 2026-06-08).
// 2. NETZ-PROBE — erkennt Funklöcher auch in BEREITS GESPEICHERTEN Gebieten (dort
// kommen Kacheln aus IndexedDB → kein Remote-Miss als Signal).
var _lastPre = null, _preActive = false; var _lastPre = null, _preActive = false;
var _preKeys = [], _preBytes = 0, _recHadDeadzone = false;
function setGps(pos) { function setGps(pos) {
if (!pos) { // Aufzeichnung beendet
_gps = null; _lastPre = null;
_prunePrefetch();
return;
}
_gps = pos; _gps = pos;
if (!pos) { _lastPre = null; return; } _probeNet(pos);
if (_preActive || !navigator.onLine) return; if (_preActive || !navigator.onLine) return;
if (_lastPre && _distKm(_lastPre.lat, _lastPre.lon, pos.lat, pos.lon) < 0.4) return; if (_lastPre && _distKm(_lastPre.lat, _lastPre.lon, pos.lat, pos.lon) < 0.4) return;
_preActive = true; _preActive = true;
@ -349,6 +359,36 @@ window.MapOffline = (function () {
.then(function () { _preActive = false; }); .then(function () { _preActive = false; });
} }
// Aktive Netz-Probe (alle ~2 Min bei Aufzeichnung): kleiner Request mit Timeout.
// Fehlschlag = Funkloch an dieser Position — unabhängig davon, ob die Kacheln
// hier längst lokal liegen. (navigator.onLine lügt bei Schwachempfang.)
var _lastProbe = 0;
function _probeNet(pos) {
var now = Date.now();
if (now - _lastProbe < 120000) return;
_lastProbe = now;
var p = { lat: pos.lat, lon: pos.lon };
var ctrl = (typeof AbortController !== 'undefined') ? new AbortController() : null;
var timer = ctrl && setTimeout(function () { try { ctrl.abort(); } catch (e) {} }, 6000);
fetch('/api/version', { cache: 'no-store', signal: ctrl ? ctrl.signal : undefined })
.then(function (r) { if (!r.ok) throw new Error('probe ' + r.status); })
.catch(function () {
_recHadDeadzone = true;
markDeadZone(p.lat, p.lon);
})
.then(function () { if (timer) clearTimeout(timer); });
}
// Vorausgeladenes wieder entfernen, wenn die Runde KEIN Funkloch hatte.
function _prunePrefetch() {
var keys = _preKeys, bytes = _preBytes, had = _recHadDeadzone;
_preKeys = []; _preBytes = 0; _recHadDeadzone = false;
if (had || !keys.length) return Promise.resolve();
var chain = Promise.resolve();
keys.forEach(function (k) { chain = chain.then(function () { return _del(k).catch(function () {}); }); });
return chain.then(function () { return _bumpTotal(-bytes); });
}
// z14-Kacheln ±n um lat/lon (+ Eltern z10–13) — NUR fehlende, still, ohne Region-Eintrag. // z14-Kacheln ±n um lat/lon (+ Eltern z10–13) — NUR fehlende, still, ohne Region-Eintrag.
function _prefetchRing(lat, lon, n) { function _prefetchRing(lat, lon, n) {
var cx = _x(lon, MAXZOOM), cy = _y(lat, MAXZOOM), seen = {}, list = []; var cx = _x(lon, MAXZOOM), cy = _y(lat, MAXZOOM), seen = {}, list = [];
@ -368,7 +408,12 @@ window.MapOffline = (function () {
var state = { done: 0, bytes: 0, stored: 0 }; var state = { done: 0, bytes: 0, stored: 0 };
return chain return chain
.then(function () { return missing.length ? _fetchTiles(missing, state, null) : null; }) .then(function () { return missing.length ? _fetchTiles(missing, state, null) : null; })
.then(function () { return _bumpTotal(state.bytes); }); .then(function () {
// Nur NEU gespeicherte Keys fürs Prune merken — Bestand bleibt unangetastet.
missing.forEach(function (t) { _preKeys.push(t[0] + '/' + t[1] + '/' + t[2]); });
_preBytes += state.bytes;
return _bumpTotal(state.bytes);
});
} }
function _distKm(aLat, aLon, bLat, bLon) { function _distKm(aLat, aLon, bLat, bLon) {
@ -378,6 +423,7 @@ window.MapOffline = (function () {
function _noteRemoteMiss() { function _noteRemoteMiss() {
if (!_gps) return; if (!_gps) return;
_recHadDeadzone = true; // Vorausgeladenes dieser Runde behalten
var now = Date.now(); var now = Date.now();
if (now - _lastZoneNote < 120000) return; // max. 1 Eintrag / 2 Min if (now - _lastZoneNote < 120000) return; // max. 1 Eintrag / 2 Min
_lastZoneNote = now; _lastZoneNote = now;
@ -395,32 +441,55 @@ window.MapOffline = (function () {
}).catch(function () {}); }).catch(function () {});
} }
// Offene Funkloch-Zonen budget-getrieben nachladen (nur online sinnvoll). // Funkloch-Zonen nachladen (nur online sinnvoll). Dort wo Netz verfügbar ist, braucht
// Dort wo Netz verfügbar ist, braucht man keine Offline-Karten — gespeichert // man keine Offline-Karten — gespeichert wird gezielt da, wo es ausfiel.
// wird gezielt da, wo es ausfiel. Liefert die Anzahl gefüllter Zonen. // opts {lat, lon, maxKm:50}: mit Position werden nur Zonen im Umkreis betrachtet
// (Speicher minimal halten) und nächstgelegene zuerst geladen. Gefüllte Zonen werden
// VERIFIZIERT (Zentrums-Kachel noch da?) — fängt „Alles löschen" und iOS-Eviction ab:
// die Gebiete kommen beim nächsten Start automatisch wieder (Modell René 2026-06-08).
// Liefert die Anzahl (neu) gefüllter Zonen.
var _autofillActive = false; var _autofillActive = false;
function autoFillDeadZones() { function autoFillDeadZones(opts) {
opts = opts || {};
var maxKm = opts.maxKm || 50;
if (_autofillActive || !navigator.onLine) return Promise.resolve(0); if (_autofillActive || !navigator.onLine) return Promise.resolve(0);
_autofillActive = true; _autofillActive = true;
var filled = 0; var filled = 0, all = null;
return _overCap().then(function (over) { return _overCap().then(function (over) {
if (over) return null; // Speicher-Cap erreicht → kein automatisches Nachladen mehr if (over) return null; // Speicher-Cap erreicht → kein automatisches Nachladen mehr
return _metaGet('deadzones'); return _metaGet('deadzones');
}).then(function (zones) { }).then(function (zones) {
if (zones === null) return 0; if (zones === null || zones === undefined) return 0;
zones = zones || []; all = zones;
var open = zones.filter(function (z) { return !z.filled; }); var cand = opts.lat == null ? zones.slice() : zones.filter(function (z) {
if (!open.length) return 0; return _distKm(z.lat, z.lon, opts.lat, opts.lon) <= maxKm;
});
if (!cand.length) return 0;
// Verify: als gefüllt markierte Zonen ohne lokale Zentrums-Kachel wieder öffnen.
var verify = Promise.resolve();
cand.forEach(function (z) {
verify = verify.then(function () {
if (!z.filled) return;
return _get(MAXZOOM + '/' + _x(z.lon, MAXZOOM) + '/' + _y(z.lat, MAXZOOM))
.then(function (hit) { if (!hit) z.filled = false; });
});
});
return verify.then(function () {
var open = cand.filter(function (z) { return !z.filled; });
if (opts.lat != null) open.sort(function (a, b) {
return _distKm(a.lat, a.lon, opts.lat, opts.lon) - _distKm(b.lat, b.lon, opts.lat, opts.lon);
});
var chain = Promise.resolve(); var chain = Promise.resolve();
open.forEach(function (z) { open.forEach(function (z) {
chain = chain.then(function () { chain = chain.then(function () {
return downloadAround(z.lat, z.lon, { budgetMB: 5 }).then(function (res) { return downloadAround(z.lat, z.lon, { budgetMB: 5, type: 'funkloch' }).then(function (res) {
if (res.bytes > 0) { z.filled = true; filled++; } if (res.bytes > 0) { z.filled = true; filled++; }
}).catch(function () {}); }).catch(function () {});
}); });
}); });
return chain.then(function () { return _metaPut('deadzones', zones); }) return chain.then(function () { return _metaPut('deadzones', all); })
.then(function () { return filled; }); .then(function () { return filled; });
});
}).then(function (n) { _autofillActive = false; return n; }, }).then(function (n) { _autofillActive = false; return n; },
function () { _autofillActive = false; return 0; }); function () { _autofillActive = false; return 0; });
} }
@ -521,13 +590,17 @@ window.MapOffline = (function () {
} }
// ---- Coverage-Layer ---------------------------------------------------------- // ---- Coverage-Layer ----------------------------------------------------------
// GeoJSON der gespeicherten z14-Kacheln — zeigt auf der Karte, welche Bereiche offline da sind. // GeoJSON der gespeicherten z14-Kacheln — zeigt auf der Karte, welche Bereiche offline
// da sind. properties.kind: 'funkloch' (Kachel liegt in einer Funkloch-Region, wird
// anders eingefärbt — Wunsch René 2026-06-08) oder 'manuell'.
function _tile2lat(y, z) { function _tile2lat(y, z) {
var m = Math.PI - 2 * Math.PI * y / Math.pow(2, z); var m = Math.PI - 2 * Math.PI * y / Math.pow(2, z);
return 180 / Math.PI * Math.atan(0.5 * (Math.exp(m) - Math.exp(-m))); return 180 / Math.PI * Math.atan(0.5 * (Math.exp(m) - Math.exp(-m)));
} }
function coverage() { function coverage() {
var re = new RegExp('^' + MAXZOOM + '/(\\d+)/(\\d+)$'); var re = new RegExp('^' + MAXZOOM + '/(\\d+)/(\\d+)$');
return _metaGet('regions').then(function (regions) {
var fz = (regions || []).filter(function (r) { return r.type === 'funkloch'; });
return _req(STORE, 'readonly', function (os) { return os.getAllKeys(); }).then(function (keys) { return _req(STORE, 'readonly', function (os) { return os.getAllKeys(); }).then(function (keys) {
var feats = []; var feats = [];
(keys || []).forEach(function (k) { (keys || []).forEach(function (k) {
@ -536,11 +609,17 @@ window.MapOffline = (function () {
var x = +m[1], y = +m[2], n2 = Math.pow(2, MAXZOOM); var x = +m[1], y = +m[2], n2 = Math.pow(2, MAXZOOM);
var west = x / n2 * 360 - 180, east = (x + 1) / n2 * 360 - 180; var west = x / n2 * 360 - 180, east = (x + 1) / n2 * 360 - 180;
var north = _tile2lat(y, MAXZOOM), south = _tile2lat(y + 1, MAXZOOM); var north = _tile2lat(y, MAXZOOM), south = _tile2lat(y + 1, MAXZOOM);
feats.push({ type: 'Feature', properties: {}, geometry: { type: 'Polygon', var cLat = (north + south) / 2, cLon = (west + east) / 2;
var isFz = fz.some(function (r) {
return _distKm(r.lat, r.lon, cLat, cLon) <= (r.radiusKm || 5) + 0.8;
});
feats.push({ type: 'Feature', properties: { kind: isFz ? 'funkloch' : 'manuell' },
geometry: { type: 'Polygon',
coordinates: [[[west, south], [east, south], [east, north], [west, north], [west, south]]] } }); coordinates: [[[west, south], [east, south], [east, north], [west, north], [west, south]]] } });
}); });
return { type: 'FeatureCollection', features: feats }; return { type: 'FeatureCollection', features: feats };
}); });
});
} }
function stats() { function stats() {
@ -555,9 +634,20 @@ window.MapOffline = (function () {
}); });
} }
function hasRegion() { return stats().then(function (s) { return s.count > 0; }).catch(function () { return false; }); } function hasRegion() { return stats().then(function (s) { return s.count > 0; }).catch(function () { return false; }); }
// „Alles löschen" entfernt Kacheln/Marker/Regionen — das FUNKLOCH-GEDÄCHTNIS bleibt
// (Quelle der Wahrheit, Modell René 2026-06-08): Zonen werden auf filled:false gesetzt
// und beim nächsten Online-Start in Positionsnähe automatisch neu geladen.
function clear() { function clear() {
return _req(STORE, 'readwrite', function (os) { os.clear(); }) return _req(STORE, 'readwrite', function (os) { os.clear(); })
.then(function () { return _req(META, 'readwrite', function (os) { os.clear(); }); }); .then(function () { return _metaGet('deadzones'); })
.then(function (zones) {
return _req(META, 'readwrite', function (os) { os.clear(); }).then(function () {
if (zones && zones.length) {
zones.forEach(function (z) { z.filled = false; });
return _metaPut('deadzones', zones);
}
});
});
} }
return { return {

57
backend/static/js/offline-indicator.js
View file

@ -25,9 +25,11 @@ window.OfflineIndicator = (() => {
function _offlineTilesMode() { function _offlineTilesMode() {
try { return !!(window.BY && BY.offlineTiles()); } catch (e) { return false; } try { return !!(window.BY && BY.offlineTiles()); } catch (e) { return false; }
} }
// Ist eine Offline-Region (Vektorkacheln) in IndexedDB gespeichert? (ohne MapOffline zu laden) // Offline-Ready (Pfote Segment 5) — ohne MapOffline/GL-Stack zu laden.
// WICHTIG: dasselbe Schema/Version wie map-offline.js anlegen — sonst legt ein versionsloses open() // Semantik (Modell René 2026-06-08): Gibt es bekannte FUNKLOCH-Zonen, zählt deren
// die DB leer an und MapOffline kann seine Stores nicht mehr erstellen. // Füllstand (alle gefüllt = grün); ohne bekannte Zonen wie bisher: irgendein Gebiet da.
// WICHTIG: dasselbe Schema/Version wie map-offline.js anlegen — sonst legt ein versionsloses
// open() die DB leer an und MapOffline kann seine Stores nicht mehr erstellen.
function _offlineRegionStored() { function _offlineRegionStored() {
return new Promise(res => { return new Promise(res => {
try { try {
@ -39,11 +41,19 @@ window.OfflineIndicator = (() => {
}; };
r.onsuccess = () => { r.onsuccess = () => {
const db = r.result; const db = r.result;
if (!db.objectStoreNames.contains('tiles')) { db.close(); return res(false); } if (!db.objectStoreNames.contains('tiles') || !db.objectStoreNames.contains('meta')) {
db.close(); return res(false);
}
const mz = db.transaction('meta', 'readonly').objectStore('meta').get('deadzones');
mz.onsuccess = () => {
const zones = mz.result || [];
if (zones.length) { res(zones.every(z => z.filled)); db.close(); return; }
const cnt = db.transaction('tiles', 'readonly').objectStore('tiles').count(); const cnt = db.transaction('tiles', 'readonly').objectStore('tiles').count();
cnt.onsuccess = () => { res(cnt.result > 0); db.close(); }; cnt.onsuccess = () => { res(cnt.result > 0); db.close(); };
cnt.onerror = () => { res(false); db.close(); }; cnt.onerror = () => { res(false); db.close(); };
}; };
mz.onerror = () => { res(false); db.close(); };
};
r.onerror = () => res(false); r.onerror = () => res(false);
} catch (e) { res(false); } } catch (e) { res(false); }
}); });
@ -224,9 +234,10 @@ window.OfflineIndicator = (() => {
} catch (e) { console.warn('Offline-Region-Download fehlgeschlagen:', e); } } catch (e) { console.warn('Offline-Region-Download fehlgeschlagen:', e); }
} }
// Gibt es offene (ungefüllte) Funkloch-Zonen? — direkt aus IndexedDB, OHNE den // Gibt es überhaupt Funkloch-Zonen? — direkt aus IndexedDB, OHNE den GL-Stack zu
// GL-Stack zu laden (gleiches Schema/Version wie map-offline.js, s. Warnung oben). // laden. Auch GEFÜLLTE zählen: der Start-Check verifiziert deren Kacheln (nach
function _openDeadZonesStored() { // „Alles löschen"/Eviction werden sie automatisch neu geladen, Modell René 2026-06-08).
function _anyDeadZonesStored() {
return new Promise(res => { return new Promise(res => {
try { try {
const r = indexedDB.open('by-offline-tiles', 1); const r = indexedDB.open('by-offline-tiles', 1);
@ -239,7 +250,7 @@ window.OfflineIndicator = (() => {
const db = r.result; const db = r.result;
if (!db.objectStoreNames.contains('meta')) { db.close(); return res(false); } if (!db.objectStoreNames.contains('meta')) { db.close(); return res(false); }
const rq = db.transaction('meta', 'readonly').objectStore('meta').get('deadzones'); const rq = db.transaction('meta', 'readonly').objectStore('meta').get('deadzones');
rq.onsuccess = () => { res((rq.result || []).some(z => !z.filled)); db.close(); }; rq.onsuccess = () => { res((rq.result || []).length > 0); db.close(); };
rq.onerror = () => { res(false); db.close(); }; rq.onerror = () => { res(false); db.close(); };
}; };
r.onerror = () => res(false); r.onerror = () => res(false);
@ -247,8 +258,29 @@ window.OfflineIndicator = (() => {
}); });
} }
// Funkloch-Zonen automatisch füllen, sobald Netz da ist — das Gerät lernt selbst, // Letzte bekannte Position: GPS nur wenn Permission schon erteilt (kein Popup),
// wo Offline-Karten nötig sind (dort wo Netz ist, braucht es keine). // sonst localStorage-Stand (gesetzt von wetter.js u.a.).
async function _lastKnownPos() {
try {
if (navigator.permissions && navigator.geolocation) {
const perm = await navigator.permissions.query({ name: 'geolocation' });
if (perm.state === 'granted') {
const pos = await new Promise(res =>
navigator.geolocation.getCurrentPosition(p => res(p), () => res(null), { timeout: 5000 }));
if (pos) return { lat: pos.coords.latitude, lon: pos.coords.longitude };
}
}
} catch {}
try {
const raw = localStorage.getItem(LS_LAST_POS);
if (raw) { const p = JSON.parse(raw); if (p?.lat != null) return { lat: p.lat, lon: p.lon }; }
} catch {}
return null;
}
// Funkloch-Zonen automatisch füllen/verifizieren, sobald Netz da ist — das Gerät lernt
// selbst, wo Offline-Karten nötig sind. Mit Position werden nur Zonen im Umkreis
// (50 km) geladen → Speicher bleibt minimal, ferne Zonen kommen, wenn man dort ist.
let _autoFillTimer = null; let _autoFillTimer = null;
function _scheduleAutoFill(delayMs) { function _scheduleAutoFill(delayMs) {
if (!_offlineTilesMode()) return; if (!_offlineTilesMode()) return;
@ -256,9 +288,10 @@ window.OfflineIndicator = (() => {
_autoFillTimer = setTimeout(async () => { _autoFillTimer = setTimeout(async () => {
if (!navigator.onLine) return; if (!navigator.onLine) return;
try { try {
if (!(await _openDeadZonesStored())) return; // nichts zu tun → GL-Stack nicht laden if (!(await _anyDeadZonesStored())) return; // nichts zu tun → GL-Stack nicht laden
const pos = await _lastKnownPos();
await UI.loadMapLibreUI(); await UI.loadMapLibreUI();
const n = await window.MapOffline?.autoFillDeadZones?.(); const n = await window.MapOffline?.autoFillDeadZones?.(pos ? { lat: pos.lat, lon: pos.lon } : {});
if (n) { if (n) {
UI.toast?.info(`${n} Funkloch-${n === 1 ? 'Gebiet' : 'Gebiete'} automatisch offline gespeichert.`); UI.toast?.info(`${n} Funkloch-${n === 1 ? 'Gebiet' : 'Gebiete'} automatisch offline gespeichert.`);
refresh(); refresh();

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

@ -2235,14 +2235,16 @@ window.Page_map = (() => {
} }
const gj = await MapOffline.coverage().catch(() => null); const gj = await MapOffline.coverage().catch(() => null);
if (!gj || !gj.features.length) { UI.toast.info('Noch keine Offline-Bereiche gespeichert.'); return false; } if (!gj || !gj.features.length) { UI.toast.info('Noch keine Offline-Bereiche gespeichert.'); return false; }
// Funkloch-Gebiete orange, manuell gespeicherte blau (Wunsch René 2026-06-08).
const covColor = ['match', ['get', 'kind'], 'funkloch', '#f59e0b', '#3b82f6'];
if (_map.getSource('by-off-cov')) { if (_map.getSource('by-off-cov')) {
_map.getSource('by-off-cov').setData(gj); _map.getSource('by-off-cov').setData(gj);
} else { } else {
_map.addSource('by-off-cov', { type: 'geojson', data: gj }); _map.addSource('by-off-cov', { type: 'geojson', data: gj });
_map.addLayer({ id: 'by-off-cov', type: 'fill', source: 'by-off-cov', _map.addLayer({ id: 'by-off-cov', type: 'fill', source: 'by-off-cov',
paint: { 'fill-color': '#3b82f6', 'fill-opacity': 0.15 } }); paint: { 'fill-color': covColor, 'fill-opacity': 0.15 } });
_map.addLayer({ id: 'by-off-cov-line', type: 'line', source: 'by-off-cov', _map.addLayer({ id: 'by-off-cov-line', type: 'line', source: 'by-off-cov',
paint: { 'line-color': '#3b82f6', 'line-opacity': 0.35, 'line-width': 0.5 } }); paint: { 'line-color': covColor, 'line-opacity': 0.35, 'line-width': 0.5 } });
} }
_covOn = true; _covOn = true;
return true; return true;
@ -2268,6 +2270,10 @@ window.Page_map = (() => {
<button class="btn btn-primary" id="off-dl">${UI.icon('download-simple')} Dieses Gebiet speichern (~5 MB)</button> <button class="btn btn-primary" id="off-dl">${UI.icon('download-simple')} Dieses Gebiet speichern (~5 MB)</button>
<button class="btn btn-secondary" id="off-bbox">${UI.icon('squares-four')} Sichtbaren Ausschnitt speichern</button> <button class="btn btn-secondary" id="off-bbox">${UI.icon('squares-four')} Sichtbaren Ausschnitt speichern</button>
<button class="btn btn-secondary" id="off-cov">${UI.icon('stack')} Gespeicherte Bereiche ${_covOn ? 'ausblenden' : 'anzeigen'}</button> <button class="btn btn-secondary" id="off-cov">${UI.icon('stack')} Gespeicherte Bereiche ${_covOn ? 'ausblenden' : 'anzeigen'}</button>
<p style="font-size:var(--text-xs);color:var(--c-text-muted);margin:0;text-align:center">
<span style="color:#3b82f6">■</span> manuell gespeichert &nbsp;·&nbsp;
<span style="color:#f59e0b">■</span> Funkloch (automatisch)
</p>
${regions.length ? `<button class="btn btn-secondary" id="off-clear" style="color:var(--c-danger)">${UI.icon('trash')} Alles löschen</button>` : ''} ${regions.length ? `<button class="btn btn-secondary" id="off-clear" style="color:var(--c-danger)">${UI.icon('trash')} Alles löschen</button>` : ''}
</div> </div>
`, `,
@ -2286,7 +2292,7 @@ window.Page_map = (() => {
await MapOffline.clear().catch(() => {}); await MapOffline.clear().catch(() => {});
_setCoverage(false); _setCoverage(false);
UI.modal.close(); UI.modal.close();
UI.toast.success('Offline-Karten gelöscht.'); UI.toast.success('Offline-Karten gelöscht. Bekannte Funkloch-Gebiete werden beim nächsten Start automatisch neu geladen.');
window.OfflineIndicator?.refresh(); window.OfflineIndicator?.refresh();
}); });
} }

3
backend/static/js/pages/routes.js
View file

@ -2488,7 +2488,8 @@ window.Page_routes = (() => {
else { else {
gl.addSource('rd-off-cov', { type: 'geojson', data: gj }); gl.addSource('rd-off-cov', { type: 'geojson', data: gj });
gl.addLayer({ id: 'rd-off-cov', type: 'fill', source: 'rd-off-cov', gl.addLayer({ id: 'rd-off-cov', type: 'fill', source: 'rd-off-cov',
paint: { 'fill-color': '#3b82f6', 'fill-opacity': 0.15 } }); paint: { 'fill-color': ['match', ['get', 'kind'], 'funkloch', '#f59e0b', '#3b82f6'],
'fill-opacity': 0.15 } });
} }
} }
} catch (e) {} } catch (e) {}

2
backend/static/landing.html
View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="color-scheme" content="light dark"> <meta name="color-scheme" content="light dark">
<script src="/js/landing-init.js?v=1229"></script> <script src="/js/landing-init.js?v=1230"></script>
<title>Ban Yaro — Die Hunde-App für Deutschland, Österreich & Schweiz</title> <title>Ban Yaro — Die Hunde-App für Deutschland, Österreich & Schweiz</title>
<meta name="description" content="Ban Yaro: Die kostenlose All-in-One Hunde-App für DACH. Tagebuch, Giftköder-Alarm, Training mit KI, Forum, Wurfbörse, Stammbaum, Inzucht-Check — DSGVO-konform, offline-fähig, ohne App Store."> <meta name="description" content="Ban Yaro: Die kostenlose All-in-One Hunde-App für DACH. Tagebuch, Giftköder-Alarm, Training mit KI, Forum, Wurfbörse, Stammbaum, Inzucht-Check — DSGVO-konform, offline-fähig, ohne App Store.">
<meta name="keywords" content="Hunde App, Hunde Community, Wurfbörse, Züchter, Welpen kaufen, Stammbaum Hund, Inzuchtkoeffizient, Hundezucht, Impfpass Hund, Giftköder Alarm, Gassi Community, Hundetraining App, Hunde Forum, Hunde KI, Hundefilm Datenbank, Welpen Marktplatz"> <meta name="keywords" content="Hunde App, Hunde Community, Wurfbörse, Züchter, Welpen kaufen, Stammbaum Hund, Inzuchtkoeffizient, Hundezucht, Impfpass Hund, Giftköder Alarm, Gassi Community, Hundetraining App, Hunde Forum, Hunde KI, Hundefilm Datenbank, Welpen Marktplatz">

2
backend/static/sw.js
View file

@ -4,7 +4,7 @@
============================================================ */ ============================================================ */
// ← EINZIGE Stelle für die Version — STATIC_ASSETS und CACHE_VERSION leiten sich ab // ← EINZIGE Stelle für die Version — STATIC_ASSETS und CACHE_VERSION leiten sich ab
const VER = '1229'; const VER = '1230';
const CACHE_VERSION = `by-v${VER}`; const CACHE_VERSION = `by-v${VER}`;
const CACHE_STATIC = `${CACHE_VERSION}-static`; const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten

17
docs/OFFLINE_MAPS_PLAN.md
View file

@ -86,6 +86,23 @@ nach bestandenen Gerätetests Runde 1+2). localhost = Leaflet/AUS.
Achtung Node 21+: eingebautes `navigator`-Global schluckt `global.navigator=`-Stubs — Achtung Node 21+: eingebautes `navigator`-Global schluckt `global.navigator=`-Stubs —
`Object.defineProperty(globalThis, 'navigator', …)` verwenden. `Object.defineProperty(globalThis, 'navigator', …)` verwenden.
**✅ Runde 4 — Minimal-Speicher-Modell (2026-06-08, Modell René):**
Prinzip: Gespeichert bleibt NUR, was wegen Funklöchern nötig ist + manuell Hinzugefügtes
(jeweils mit allen Markern + Warnungen). Das Funkloch-Gedächtnis ist die QUELLE DER WAHRHEIT,
die Kacheln sind jederzeit neu ableitbarer Cache.
- **Ephemeres Vorausladen:** Rolling-Prefetch-Kacheln werden bei Aufzeichnungsende GELÖSCHT,
wenn die Runde kein Funkloch hatte (nur neu gespeicherte Keys; Bestand unangetastet).
- **Netz-Probe bei Aufzeichnung** (alle ~2 Min, /api/version, 6-s-Timeout): erkennt Funklöcher
auch in BEREITS GESPEICHERTEN Gebieten — dort kommen Kacheln aus IndexedDB, es gibt keinen
Remote-Miss als Signal (Lücke von René gefunden).
- **clear() behält das Funkloch-Gedächtnis** (Zonen → filled:false): Beim nächsten Online-Start
werden Funkloch-Gebiete automatisch neu geladen, auch wenn man alles gelöscht hat.
- **Start-Check mit Position:** autoFillDeadZones({lat,lon,maxKm:50}) — nur Zonen im Umkreis
(Speicher minimal), nächstgelegene zuerst; VERIFIZIERT gefüllte Zonen (Zentrums-Kachel da?)
→ fängt Löschen + iOS-Eviction ab. Pfote-Segment 5 = „alle bekannten Funkloch-Zonen gefüllt".
- **Coverage-Layer zweifarbig:** Funkloch-Gebiete ORANGE (#f59e0b), manuelle BLAU (#3b82f6);
Legende im Offline-Modal; Regionen tragen type 'funkloch'/'gebiet'/'korridor'/'ausschnitt'.
**🔲 Offen (Backlog):** **🔲 Offen (Backlog):**
- Echte LRU-Eviction (Refcounting/Region-Zuordnung der Kacheln), wenn Nutzer real ans Cap kommen. - Echte LRU-Eviction (Refcounting/Region-Zuordnung der Kacheln), wenn Nutzer real ans Cap kommen.
- Rechteck-Zeichnen als präzisere Bereichsauswahl (Viewport-Variante deckt den Hauptfall ab). - Rechteck-Zeichnen als präzisere Bereichsauswahl (Viewport-Variante deckt den Hauptfall ab).