OwlBoard/web-pwa
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add extra message to +error.svelte to handle, and clarify 'OFFLINE' error.

Browse Source
This commit is contained in:
Fred Boniface
2026-05-14 19:43:22 +01:00
parent 25b64edabd
commit 1105a9f7c5
6 changed files with 111 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/components/ui/station-board/StaffServicesTable.svelte
View File

@@ -248,10 +248,10 @@
font-size: 1.18rem;
}
}
@media (min-width: 620px) {
@media (min-width: 620px) {
.cancel-row td,
.delay-row td {
font-size: 1.20rem;
font-size: 1.2rem;
}
}
@@ -261,12 +261,12 @@
padding: 0;
color: rgb(187, 187, 255);
}
@media(min-width: 400px) {
@media (min-width: 400px) {
.toc-coach-row td {
font-size: 0.8rem;
}
}
@media(min-width: 550px) {
@media (min-width: 550px) {
.toc-coach-row td {
font-size: 0.85rem;
}

46
src/lib/preferences.svelte.ts
View File

@@ -1,43 +1,43 @@
import { browser } from '$app/environment';
export interface Preferences {
locationEnabled: boolean;
locationEnabled: boolean;
}
const STORAGE_KEY = 'ob_pref';
const DEFAULT_PREFS: Preferences = {
locationEnabled: false,
locationEnabled: false
};
function loadPrefs(): Preferences {
if (!browser) return DEFAULT_PREFS;
const stored = localStorage.getItem(STORAGE_KEY);
if (!stored) return DEFAULT_PREFS;
if (!browser) return DEFAULT_PREFS;
const stored = localStorage.getItem(STORAGE_KEY);
if (!stored) return DEFAULT_PREFS;
try {
return { ...DEFAULT_PREFS, ...JSON.parse(stored) };
} catch {
return DEFAULT_PREFS;
}
try {
return { ...DEFAULT_PREFS, ...JSON.parse(stored) };
} catch {
return DEFAULT_PREFS;
}
}
class PreferencesStore {
current = $state<Preferences>(loadPrefs());
current = $state<Preferences>(loadPrefs());
constructor() {
$effect.root(() => {
$effect(() => {
if (browser) {
localStorage.setItem(STORAGE_KEY, JSON.stringify(this.current));
}
});
});
}
constructor() {
$effect.root(() => {
$effect(() => {
if (browser) {
localStorage.setItem(STORAGE_KEY, JSON.stringify(this.current));
}
});
});
}
toggleLocation(enabled: boolean) {
this.current.locationEnabled = enabled;
}
toggleLocation(enabled: boolean) {
this.current.locationEnabled = enabled;
}
}
export const prefs = new PreferencesStore();

38
src/lib/quick-links.svelte.ts
View File

@@ -11,18 +11,18 @@ const MAX_ENTRIES: number = RETURNED_LENGTH * 4;
class QuickLinksService {
#links = $state<QuickLink[]>([]);
constructor() {
if (typeof window !== 'undefined') {
const saved = localStorage.getItem('ql');
if (saved) {
try {
this.#links = JSON.parse(saved);
} catch {
this.#links = [];
}
}
}
}
constructor() {
if (typeof window !== 'undefined') {
const saved = localStorage.getItem('ql');
if (saved) {
try {
this.#links = JSON.parse(saved);
} catch {
this.#links = [];
}
}
}
}
get list(): QuickLink[] {
return this.#links.slice(0, RETURNED_LENGTH);
@@ -58,16 +58,16 @@ constructor() {
this.#links = sorted.slice(0, MAX_ENTRIES);
if (typeof window !== 'undefined') {
localStorage.setItem('ql', JSON.stringify(this.#links));
}
localStorage.setItem('ql', JSON.stringify(this.#links));
}
}
reset() {
this.#links = [];
if (typeof window !== 'undefined') {
localStorage.removeItem('ql');
}
}
this.#links = [];
if (typeof window !== 'undefined') {
localStorage.removeItem('ql');
}
}
}
export const quickLinks = new QuickLinksService();

1
src/routes/+error.svelte
View File

@@ -12,6 +12,7 @@
<img class="err-img" src={noResult} alt="" role="presentation" width="200" height="200" />
{:else if page.status == 499}
<!-- Change to a GSM-R X Sign?? -->
<span>OFFLINE!</span>
<img class="err-img" src={stopErr} alt="" role="presentation" width="150" height="210" />
{:else}
<!-- STOP Error image -->

4
src/routes/+layout.svelte
View File

@@ -22,11 +22,11 @@
if (browser && 'serviceWorker' in navigator) {
try {
const registration = await navigator.serviceWorker.register('/service-worker.js', {
type: 'module',
type: 'module'
});
console.info('OwlBoard Service Worker registered', registration.scope);
} catch (error) {
console.error('Service Worker installation failed: ', error)
console.error('Service Worker installation failed: ', error);
}
}
});

128
src/service-worker.ts
View File

@@ -7,87 +7,77 @@ import { build, files, version } from '$service-worker';
const sw = self as unknown as ServiceWorkerGlobalScope;
const CACHE_NAME = `owlboard-cache-${version}`;
const ASSETS = [
...build,
...files.filter(file =>
!file.endsWith('manifest.json') &&
!file.startsWith('/icons/')
),
'/',
...build,
...files.filter((file) => !file.endsWith('manifest.json') && !file.startsWith('/icons/')),
'/'
];
sw.addEventListener('install', (event) => {
sw.skipWaiting();
event.waitUntil(
caches.open(CACHE_NAME).then((cache) => cache.addAll(ASSETS))
);
sw.skipWaiting();
event.waitUntil(caches.open(CACHE_NAME).then((cache) => cache.addAll(ASSETS)));
});
sw.addEventListener('activate', (event) => {
event.waitUntil(
Promise.all([
caches.keys().then((keys) => {
return Promise.all(
keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key))
);
}),
sw.clients.claim()
])
);
event.waitUntil(
Promise.all([
caches.keys().then((keys) => {
return Promise.all(
keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key))
);
}),
sw.clients.claim()
])
);
});
sw.addEventListener('fetch', (event) => {
const { request } = event;
if (request.method !== 'GET') return;
const { request } = event;
if (request.method !== 'GET') return;
const url = new URL(request.url);
const url = new URL(request.url);
// Uncached static assets
if (url.pathname.endsWith('manifest.json') || url.pathname.includes('/icons/')) {
event.respondWith(fetch(request));
return;
}
// Uncached static assets
if (url.pathname.endsWith('manifest.json') || url.pathname.includes('/icons/')) {
event.respondWith(fetch(request));
return;
}
// 1. Static Assets (Cache-First)
if (ASSETS.includes(url.pathname) || url.pathname.startsWith('/_app/')) {
event.respondWith(
caches.match(request).then((res) => res || fetch(request))
);
return;
}
// 1. Static Assets (Cache-First)
if (ASSETS.includes(url.pathname) || url.pathname.startsWith('/_app/')) {
event.respondWith(caches.match(request).then((res) => res || fetch(request)));
return;
}
// 2. Offline API Fallback (Network-First)
if (url.pathname.startsWith('/api') || url.hostname.includes('api')) {
event.respondWith(
fetch(request).catch(() => {
const errorObject: ApiEnvelope.Envelope = {
e: {
code: "NETWORK_DISCONNECTED",
msg: "Cannot connect to the OwlBoard server"
},
t: Math.floor(Date.now() / 1000)
};
return new Response(
JSON.stringify(errorObject),
{
status: 503,
headers: { 'Content-Type': 'application/json' }
}
);
})
);
return;
}
// 2. Offline API Fallback (Network-First)
if (url.pathname.startsWith('/api') || url.hostname.includes('api')) {
event.respondWith(
fetch(request).catch(() => {
const errorObject: ApiEnvelope.Envelope = {
e: {
code: 'NETWORK_DISCONNECTED',
msg: 'Cannot connect to the OwlBoard server'
},
t: Math.floor(Date.now() / 1000)
};
return new Response(JSON.stringify(errorObject), {
status: 503,
headers: { 'Content-Type': 'application/json' }
});
})
);
return;
}
// 3. Navigation Fallback (The Offline 404 Catch-All)
// This catches top-level page navigations and hard refreshes
if (request.mode === 'navigate' || request.headers.get('accept')?.includes('text/html')) {
event.respondWith(
fetch(request).catch(() => {
// The network request failed entirely (offline).
// Serve the cached root shell so SvelteKit can boot.
return caches.match('/') as Promise<Response>;
})
);
return;
}
// 3. Navigation Fallback (The Offline 404 Catch-All)
// This catches top-level page navigations and hard refreshes
if (request.mode === 'navigate' || request.headers.get('accept')?.includes('text/html')) {
event.respondWith(
fetch(request).catch(() => {
// The network request failed entirely (offline).
// Serve the cached root shell so SvelteKit can boot.
return caches.match('/') as Promise<Response>;
})
);
return;
}
});