Feature: Persistentes Update-Banner mit iOS-Anleitung, Version-Poll alle 30min (SW by-v730)
This commit is contained in:
parent
e4da75f246
commit
8b87f29f5b
5 changed files with 269 additions and 189 deletions
|
|
@ -3,7 +3,7 @@
|
|||
Router, State-Management, Navigation, Initialisierung.
|
||||
============================================================ */
|
||||
|
||||
const APP_VER = '729'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
const APP_VER = '730'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
const APP_VERSION = '1.4.0'; // ← semantische Version, wird bei make release gesetzt
|
||||
const IS_STAGING = location.hostname === 'staging.banyaro.app';
|
||||
|
||||
|
|
@ -819,6 +819,7 @@ const App = (() => {
|
|||
|
||||
try { localStorage.removeItem('by_wissen_open'); } catch (_) {}
|
||||
|
||||
_initVersionCheck();
|
||||
await _checkAuth();
|
||||
|
||||
// Einladungslink /teilen/{token} → direkt annehmen
|
||||
|
|
@ -916,6 +917,126 @@ const App = (() => {
|
|||
});
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------
|
||||
// ----------------------------------------------------------
|
||||
// VERSION-CHECK — persistentes Banner wenn neue Version verfügbar
|
||||
// ----------------------------------------------------------
|
||||
let _updateBannerShown = false;
|
||||
|
||||
async function _checkVersion() {
|
||||
try {
|
||||
const r = await fetch('/api/version', { cache: 'no-store' });
|
||||
if (!r.ok) return;
|
||||
const { version } = await r.json();
|
||||
if (version && version !== APP_VER && !_updateBannerShown) {
|
||||
_updateBannerShown = true;
|
||||
_showUpdateBanner(version);
|
||||
}
|
||||
} catch { /* offline — ignorieren */ }
|
||||
}
|
||||
|
||||
function _showUpdateBanner(newVersion) {
|
||||
const isIos = /iphone|ipad|ipod/i.test(navigator.userAgent);
|
||||
const existing = document.getElementById('app-update-banner');
|
||||
if (existing) return;
|
||||
|
||||
const banner = document.createElement('div');
|
||||
banner.id = 'app-update-banner';
|
||||
banner.style.cssText = [
|
||||
'position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 72px);left:12px;right:12px',
|
||||
'z-index:9000;background:var(--c-primary);color:#fff;border-radius:16px',
|
||||
'padding:14px 16px;box-shadow:0 4px 20px rgba(0,0,0,0.3)',
|
||||
'display:flex;flex-direction:column;gap:10px',
|
||||
].join(';');
|
||||
|
||||
banner.innerHTML = `
|
||||
<div style="display:flex;align-items:center;justify-content:space-between;gap:10px">
|
||||
<div>
|
||||
<div style="font-weight:700;font-size:var(--text-sm)">
|
||||
Neue Version verfügbar (v${newVersion})
|
||||
</div>
|
||||
<div style="font-size:var(--text-xs);opacity:0.85;margin-top:2px">
|
||||
Tippe auf Aktualisieren um die neueste Version zu laden.
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:8px;flex-shrink:0">
|
||||
<button id="upd-btn-reload"
|
||||
style="background:rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.4);
|
||||
color:#fff;border-radius:10px;padding:8px 14px;cursor:pointer;
|
||||
font-size:var(--text-sm);font-weight:700;white-space:nowrap">
|
||||
Aktualisieren
|
||||
</button>
|
||||
<button id="upd-btn-close"
|
||||
style="background:none;border:none;color:rgba(255,255,255,0.7);
|
||||
cursor:pointer;font-size:1.1rem;padding:4px 6px;line-height:1">✕</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="upd-ios-hint" style="display:none;font-size:var(--text-xs);
|
||||
background:rgba(0,0,0,0.2);border-radius:10px;padding:10px 12px;line-height:1.6">
|
||||
${isIos
|
||||
? `Falls die App nach dem Aktualisieren noch die alte Version zeigt:<br>
|
||||
<strong>1.</strong> Drücke lange auf das App-Icon am Homescreen<br>
|
||||
<strong>2.</strong> Wähle „App entfernen" (nur das Symbol, keine Daten)<br>
|
||||
<strong>3.</strong> Öffne banyaro.app in Safari und füge die App erneut hinzu`
|
||||
: `Falls die App nicht aktualisiert:<br>
|
||||
Öffne banyaro.app im Browser und füge sie erneut zum Startbildschirm hinzu.`}
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.body.appendChild(banner);
|
||||
|
||||
banner.querySelector('#upd-btn-close').addEventListener('click', () => banner.remove());
|
||||
|
||||
banner.querySelector('#upd-btn-reload').addEventListener('click', async () => {
|
||||
const btn = banner.querySelector('#upd-btn-reload');
|
||||
btn.textContent = 'Lädt…';
|
||||
btn.disabled = true;
|
||||
// SW-Update anstoßen
|
||||
try {
|
||||
const reg = await navigator.serviceWorker?.getRegistration();
|
||||
if (reg?.waiting) reg.waiting.postMessage({ type: 'SKIP_WAITING' });
|
||||
await reg?.update();
|
||||
} catch { /* ignorieren */ }
|
||||
// Kurz warten, dann hard reload
|
||||
setTimeout(() => {
|
||||
location.reload();
|
||||
}, 800);
|
||||
// Nach Reload: wenn Version immer noch alt, iOS-Hinweis anzeigen
|
||||
sessionStorage.setItem('by_update_reload', APP_VER);
|
||||
});
|
||||
}
|
||||
|
||||
function _initVersionCheck() {
|
||||
// Beim Start nach 10 Sekunden prüfen (nicht sofort — Prio für Auth)
|
||||
setTimeout(_checkVersion, 10_000);
|
||||
// Dann alle 30 Minuten
|
||||
setInterval(_checkVersion, 30 * 60_000);
|
||||
// Beim Wiedereinstieg in die App
|
||||
document.addEventListener('visibilitychange', () => {
|
||||
if (document.visibilityState === 'visible') _checkVersion();
|
||||
});
|
||||
// Nach Reload: war das ein Update-Reload? Falls Version immer noch alt → iOS-Hinweis
|
||||
const reloadVer = sessionStorage.getItem('by_update_reload');
|
||||
if (reloadVer && reloadVer === APP_VER) {
|
||||
// Version hat sich nicht geändert nach Reload → iOS-Cache-Problem
|
||||
sessionStorage.removeItem('by_update_reload');
|
||||
setTimeout(() => {
|
||||
fetch('/api/version', { cache: 'no-store' })
|
||||
.then(r => r.json())
|
||||
.then(({ version }) => {
|
||||
if (version && version !== APP_VER) {
|
||||
_updateBannerShown = true;
|
||||
_showUpdateBanner(version);
|
||||
// iOS-Hinweis sofort aufklappen
|
||||
setTimeout(() => {
|
||||
document.getElementById('upd-ios-hint')?.style.setProperty('display', 'block');
|
||||
}, 300);
|
||||
}
|
||||
}).catch(() => {});
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------
|
||||
// ÖFFENTLICHE API
|
||||
// (andere Module können App.state, App.navigate etc. nutzen)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue