Vektor-Basemap: zentrale Karte (pages/map.js) integrieren — sie umging UI.map.create
- map.js _addBasemap: Vektor-Layer (Flag) mit Raster-Fallback, eigener Basemap-Code - Theme-Wechsel baut Vektor-Layer mit passendem Flavor neu (kein CSS-Filter bei Vektor) - ui.js: UI.map.vectorEnabled()/vectorLayer() exponiert für Karten mit eigenem Layer-Mgmt - APP_VER bump
This commit is contained in:
parent
b2262a8e86
commit
647aa684db
7 changed files with 77 additions and 26 deletions
2
VERSION
2
VERSION
|
|
@ -1 +1 @@
|
|||
1175
|
||||
1176
|
||||
|
|
@ -86,14 +86,14 @@
|
|||
<title>Ban Yaro</title>
|
||||
|
||||
<!-- Theme + theme-color Statusleiste vor CSS setzen -->
|
||||
<script src="/js/boot-early.js?v=1175"></script>
|
||||
<script src="/js/boot-early.js?v=1176"></script>
|
||||
|
||||
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
|
||||
<link rel="stylesheet" href="/css/design-system.css?v=1175">
|
||||
<link rel="stylesheet" href="/css/layout.css?v=1175">
|
||||
<link rel="stylesheet" href="/css/components.css?v=1175">
|
||||
<link rel="stylesheet" href="/css/utilities.css?v=1175">
|
||||
<link rel="stylesheet" href="/css/lists.css?v=1175">
|
||||
<link rel="stylesheet" href="/css/design-system.css?v=1176">
|
||||
<link rel="stylesheet" href="/css/layout.css?v=1176">
|
||||
<link rel="stylesheet" href="/css/components.css?v=1176">
|
||||
<link rel="stylesheet" href="/css/utilities.css?v=1176">
|
||||
<link rel="stylesheet" href="/css/lists.css?v=1176">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -617,11 +617,11 @@
|
|||
<div id="modal-container"></div>
|
||||
|
||||
<!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features -->
|
||||
<script src="/js/api.js?v=1175"></script>
|
||||
<script src="/js/ui.js?v=1175"></script>
|
||||
<script src="/js/app.js?v=1175"></script>
|
||||
<script src="/js/worlds.js?v=1175"></script>
|
||||
<script src="/js/offline-indicator.js?v=1175"></script>
|
||||
<script src="/js/api.js?v=1176"></script>
|
||||
<script src="/js/ui.js?v=1176"></script>
|
||||
<script src="/js/app.js?v=1176"></script>
|
||||
<script src="/js/worlds.js?v=1176"></script>
|
||||
<script src="/js/offline-indicator.js?v=1176"></script>
|
||||
|
||||
<!-- Feature-Seiten werden lazy geladen -->
|
||||
|
||||
|
|
@ -631,7 +631,7 @@
|
|||
|
||||
|
||||
<!-- Boot: Offline-Banner + SW-Registration (extrahiert für CSP) -->
|
||||
<script src="/js/boot.js?v=1175"></script>
|
||||
<script src="/js/boot.js?v=1176"></script>
|
||||
|
||||
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
Router, State-Management, Navigation, Initialisierung.
|
||||
============================================================ */
|
||||
|
||||
const APP_VER = '1175'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
const APP_VER = '1176'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
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_VERSION = APP_VERSION;
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ window.Page_map = (() => {
|
|||
let _placingMarker = false;
|
||||
let _tempMarker = null;
|
||||
let _tileLayer = null;
|
||||
let _usingVector = false; // true wenn Vektor-Basemap (PMTiles) statt OSM-Raster
|
||||
let _themeObserver = null;
|
||||
|
||||
// Standort-Tracking
|
||||
|
|
@ -633,16 +634,11 @@ window.Page_map = (() => {
|
|||
if (!_userPos) {
|
||||
_frankfurtTimer = setTimeout(() => _map.flyTo(center, 14, { duration: 2.5 }), 1200);
|
||||
}
|
||||
_tileLayer = _buildTileLayer();
|
||||
_tileLayer.addTo(_map);
|
||||
|
||||
// Sofort Dark-Filter anwenden wenn nötig (nach Tile-Load)
|
||||
_tileLayer.on('load', _applyTileTheme);
|
||||
_applyTileTheme();
|
||||
// Theme-Wechsel → Filter aktualisieren
|
||||
_themeObserver = new MutationObserver(() => _applyTileTheme());
|
||||
_addBasemap();
|
||||
// Theme-Wechsel → Basemap aktualisieren (Vektor: Layer neu bauen / Raster: CSS-Filter)
|
||||
_themeObserver = new MutationObserver(() => _onThemeChange());
|
||||
_themeObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] });
|
||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', _applyTileTheme);
|
||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', _onThemeChange);
|
||||
|
||||
setTimeout(() => _map.invalidateSize(), 100);
|
||||
setTimeout(() => _map.invalidateSize(), 600);
|
||||
|
|
@ -742,8 +738,52 @@ window.Page_map = (() => {
|
|||
return L.tileLayer(_OSM_URL, { maxZoom: 19 });
|
||||
}
|
||||
|
||||
// Basemap hinzufügen: Vektor-PMTiles (Feature-Flag) mit sauberem Raster-Fallback.
|
||||
// Marker/Cluster/Overlays/Scan bleiben in beiden Fällen identisch.
|
||||
function _addBasemap() {
|
||||
const _addRaster = () => {
|
||||
_usingVector = false;
|
||||
_tileLayer = _buildTileLayer();
|
||||
_tileLayer.addTo(_map);
|
||||
_tileLayer.on('load', _applyTileTheme);
|
||||
_applyTileTheme();
|
||||
};
|
||||
if (window.UI && UI.map.vectorEnabled && UI.map.vectorEnabled()) {
|
||||
UI.map.vectorLayer({ dark: _isDarkMode() }).then(layer => {
|
||||
if (!_map) return;
|
||||
_usingVector = true;
|
||||
_tileLayer = layer;
|
||||
layer.addTo(_map);
|
||||
_applyTileTheme(); // no-op bei Vektor (Theme steckt in den Tile-Farben)
|
||||
if (!_map._byVectorAttr) {
|
||||
_map._byVectorAttr = L.control.attribution({ prefix: false }).addTo(_map)
|
||||
.addAttribution('© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors');
|
||||
}
|
||||
}).catch(err => {
|
||||
console.warn('Vektor-Basemap nicht verfügbar — Fallback auf Raster:', err);
|
||||
if (_map) _addRaster();
|
||||
});
|
||||
} else {
|
||||
_addRaster();
|
||||
}
|
||||
}
|
||||
|
||||
// Theme-Wechsel: Vektor → Layer mit passendem Flavor neu bauen; Raster → CSS-Filter.
|
||||
function _onThemeChange() {
|
||||
if (_usingVector && _map && _tileLayer) {
|
||||
UI.map.vectorLayer({ dark: _isDarkMode() }).then(layer => {
|
||||
if (!_map) return;
|
||||
if (_tileLayer) _map.removeLayer(_tileLayer);
|
||||
_tileLayer = layer;
|
||||
layer.addTo(_map);
|
||||
}).catch(() => {});
|
||||
} else {
|
||||
_applyTileTheme();
|
||||
}
|
||||
}
|
||||
|
||||
function _applyTileTheme() {
|
||||
if (!_map) return;
|
||||
if (!_map || _usingVector) return; // bei Vektor kein CSS-Filter (würde doppelt abdunkeln)
|
||||
const tilePaneEl = _map.getPane('tilePane');
|
||||
if (tilePaneEl) tilePaneEl.style.filter = _isDarkMode() ? _DARK_FILTER : '';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -491,6 +491,17 @@ const UI = (() => {
|
|||
});
|
||||
return L.marker([lat, lon], { icon });
|
||||
},
|
||||
|
||||
// Feature-Flag-Status der Vektor-Basemap (für Karten, die ihren Basemap-Layer
|
||||
// selbst verwalten, z.B. pages/map.js).
|
||||
vectorEnabled() { return _vectorMapEnabled(); },
|
||||
|
||||
// Lädt protomaps-leaflet + Regeln und liefert den fertigen Vektor-Basemap-Layer
|
||||
// (Promise). dark=true → dunkles Theme.
|
||||
async vectorLayer(opts = {}) {
|
||||
await loadProtomaps();
|
||||
return MapVector.basemapLayer(opts);
|
||||
},
|
||||
};
|
||||
|
||||
// ----------------------------------------------------------
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<script src="/js/landing-init.js?v=1175"></script>
|
||||
<script src="/js/landing-init.js?v=1176"></script>
|
||||
<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="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">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
============================================================ */
|
||||
|
||||
// ← EINZIGE Stelle für die Version — STATIC_ASSETS und CACHE_VERSION leiten sich ab
|
||||
const VER = '1175';
|
||||
const VER = '1176';
|
||||
const CACHE_VERSION = `by-v${VER}`;
|
||||
const CACHE_STATIC = `${CACHE_VERSION}-static`;
|
||||
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue