diff --git a/backend/main.py b/backend/main.py index dc31b11..9218a81 100644 --- a/backend/main.py +++ b/backend/main.py @@ -327,7 +327,7 @@ MEDIA_DIR = os.getenv("MEDIA_DIR", "/data/media") os.makedirs(MEDIA_DIR, exist_ok=True) app.mount("/media", StaticFiles(directory=MEDIA_DIR), name="media") -APP_VER = "783" # muss mit APP_VER in app.js übereinstimmen +APP_VER = "784" # muss mit APP_VER in app.js übereinstimmen @app.get("/.well-known/assetlinks.json") async def assetlinks(): diff --git a/backend/static/index.html b/backend/static/index.html index dd4b114..7213d86 100644 --- a/backend/static/index.html +++ b/backend/static/index.html @@ -575,10 +575,10 @@
- - - - + + + + diff --git a/backend/static/js/app.js b/backend/static/js/app.js index 8d6c130..163f8de 100644 --- a/backend/static/js/app.js +++ b/backend/static/js/app.js @@ -3,7 +3,7 @@ Router, State-Management, Navigation, Initialisierung. ============================================================ */ -const APP_VER = '783'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen +const APP_VER = '784'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen const APP_VERSION = '1.5.0'; // ← semantische Version, wird bei make release gesetzt const IS_STAGING = location.hostname === 'staging.banyaro.app'; // Cache-Bust-Parameter nach Update-Reload sofort entfernen diff --git a/backend/static/js/worlds.js b/backend/static/js/worlds.js index ef13b02..33fb509 100644 --- a/backend/static/js/worlds.js +++ b/backend/static/js/worlds.js @@ -917,23 +917,51 @@ window.Worlds = (() => { } catch { return dog.foto_url || null; } } + let _bgUrl = null; // aktuell gesetztes Hintergrundbild + + function _applyBgOrientation() { + const ov = document.getElementById('worlds-overlay'); + const track = document.getElementById('worlds-track'); + if (!ov || !track || !_bgUrl) return; + const portrait = window.matchMedia('(orientation: portrait)').matches; + if (portrait) { + // Panorama: Bild über alle drei Welten, scrollt mit dem Swipe + ov.style.backgroundImage = ''; + track.style.backgroundImage = `url('${_bgUrl}')`; + track.style.backgroundSize = 'cover'; + track.style.backgroundPosition = 'center 40%'; + track.style.backgroundRepeat = 'no-repeat'; + } else { + // Vollbild pro Welt (Landscape / Desktop) + track.style.backgroundImage = ''; + ov.style.backgroundImage = `url('${_bgUrl}')`; + ov.style.backgroundSize = 'cover'; + ov.style.backgroundPosition = 'center 40%'; + ov.style.backgroundRepeat = 'no-repeat'; + } + } + + // Orientierungswechsel → Bild neu setzen + window.matchMedia('(orientation: portrait)').addEventListener('change', _applyBgOrientation); + function _applyBgImage(url) { - const ov = document.getElementById('worlds-overlay'); - if (!ov) return; + const ov = document.getElementById('worlds-overlay'); + const track = document.getElementById('worlds-track'); + if (!ov || !track) return; if (url) { const toLoad = new Image(); toLoad.onload = () => { _hasBgPhoto = true; - ov.style.backgroundImage = `url('${url}')`; - ov.style.backgroundSize = 'cover'; - ov.style.backgroundPosition = 'center 40%'; - ov.style.backgroundRepeat = 'no-repeat'; + _bgUrl = url; + _applyBgOrientation(); document.getElementById('wh-photo-hint')?.remove(); }; toLoad.onerror = () => _applyBgImage(null); toLoad.src = url; } else { _hasBgPhoto = false; + _bgUrl = null; + track.style.backgroundImage = ''; ov.style.backgroundImage = 'linear-gradient(160deg,#1a1f35 0%,#16213e 33%,#1a2535 67%,#0f1921 100%)'; ov.style.backgroundSize = '100% 100%'; } @@ -979,8 +1007,7 @@ window.Worlds = (() => { const staleMin = Math.max(weatherObj.ageMin || 0, dogsObj.ageMin || 0); // Panorama-Bild setzen (nur wenn noch kein Bild vorhanden) - const ov = document.getElementById('worlds-overlay'); - if (dog && !ov?.style.backgroundImage?.startsWith('url')) { + if (dog && !_bgUrl) { _loadDailyImage(dog).then(_applyBgImage); } else if (!dog) { _applyBgImage(null); } diff --git a/backend/static/sw.js b/backend/static/sw.js index f38d799..fbdb8fe 100644 --- a/backend/static/sw.js +++ b/backend/static/sw.js @@ -3,7 +3,7 @@ Offline-Cache + Push Notifications + Tile-Cache ============================================================ */ -const CACHE_VERSION = 'by-v783'; +const CACHE_VERSION = 'by-v784'; const CACHE_STATIC = `${CACHE_VERSION}-static`; const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache