diff --git a/public/manifest.webmanifest b/public/manifest.webmanifest index 405cfde..c3bae07 100644 --- a/public/manifest.webmanifest +++ b/public/manifest.webmanifest @@ -6,6 +6,7 @@ "scope": "/", "id": "/", "display": "standalone", + "display_override": ["fullscreen", "standalone"], "orientation": "portrait", "background_color": "#000000", "theme_color": "#000000", diff --git a/public/sw.js b/public/sw.js index a2bc3a5..2a964c1 100644 --- a/public/sw.js +++ b/public/sw.js @@ -1,4 +1,4 @@ -const CACHE_NAME = 'l484-pwa-v6' +const CACHE_NAME = 'l484-pwa-v7' const APP_SHELL = [ '/', '/manifest.webmanifest', diff --git a/src/App.vue b/src/App.vue index 848e1ec..d1df5bb 100644 --- a/src/App.vue +++ b/src/App.vue @@ -399,6 +399,7 @@ const heroBackgroundEntries = computed(() => .map((background, index) => ({ background, index })) .filter(({ index }) => loadedHeroBackgroundIndexes.value.has(index)), ) +const currentHeroBackground = computed(() => heroBackgrounds[activeBackground.value] || heroBackgrounds[0] || '') const sanitizeText = (value, maxLength) => String(value ?? '') @@ -2139,6 +2140,10 @@ onMounted(async () => { } }) +watch(currentHeroBackground, (background) => { + document.documentElement.style.setProperty('--safe-area-bg-image', background ? `url(${background})` : '#000') +}, { immediate: true }) + onBeforeUnmount(() => { window.clearInterval(backgroundTimer) window.clearTimeout(adminToastTimer) @@ -2336,7 +2341,7 @@ watch(mobileMenuOpen, (open) => {
{ return data } -const subscribeWithRetry = async (registration, applicationServerKey) => { +const subscribeWithKey = async (registration, applicationServerKey) => { try { return await registration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey }) + } catch (error) { + if (applicationServerKey instanceof Uint8Array) { + return registration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: applicationServerKey.buffer }) + } + throw error + } +} + +const subscribeWithRetry = async (registration, applicationServerKey) => { + try { + return await subscribeWithKey(registration, applicationServerKey) } catch (error) { await registration.update().catch(() => {}) await new Promise((resolve) => window.setTimeout(resolve, 750)) const activeRegistration = await navigator.serviceWorker.ready try { - return await activeRegistration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey }) + return await subscribeWithKey(activeRegistration, applicationServerKey) } catch (retryError) { try { const repairedRegistration = await repairServiceWorkerRegistration() - return await repairedRegistration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey }) + return await subscribeWithKey(repairedRegistration, applicationServerKey) } catch (repairError) { throw new Error(await explainSubscribeError(repairError || retryError || error)) } diff --git a/src/style.css b/src/style.css index 92d121d..5556c5a 100644 --- a/src/style.css +++ b/src/style.css @@ -54,6 +54,10 @@ body::before { pointer-events: none; } +.intro-header > div { + padding-top: calc(1.25rem + env(safe-area-inset-top)); +} + body.menu-open { overflow: hidden; } @@ -257,6 +261,10 @@ body.menu-open { } @media (max-width: 900px) { + .intro-header > div { + padding-top: calc(1.25rem + env(safe-area-inset-top)); + } + .hero-fold::before { display: block; }