5d2d8a12bc
Some checks failed
CI / validate (pull_request) Has been cancelled
Adds full Progressive Web App support to The Nexus: - sw.js: Service worker with cache-first strategy for local assets and stale-while-revalidate for CDN resources (Three.js, fonts) - offline.html: Styled offline fallback page with auto-reconnect - icons/nexus-icon.svg: Nexus crystal sigil icon (SVG) - icons/nexus-maskable.svg: Maskable icon for adaptive shapes - manifest.json: Complete PWA manifest with theme color #4af0c0, standalone display mode, shortcuts, and icon definitions - index.html: Service worker registration, Apple PWA meta tags, theme colors, and MS application config The Nexus now works offline after first visit and can be installed to home screen on mobile and desktop devices. Fixes #14
102 lines
3.9 KiB
HTML
102 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Timmy's Nexus</title>
|
|
<meta name="description" content="A sovereign 3D world">
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:title" content="Timmy's Nexus">
|
|
<meta property="og:description" content="A sovereign 3D world">
|
|
<meta property="og:image" content="https://example.com/og-image.png">
|
|
<meta property="og:type" content="website">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:title" content="Timmy's Nexus">
|
|
<meta name="twitter:description" content="A sovereign 3D world">
|
|
<meta name="twitter:image" content="https://example.com/og-image.png">
|
|
|
|
<!-- PWA: Web App Manifest -->
|
|
<link rel="manifest" href="/manifest.json">
|
|
|
|
<!-- PWA: Theme Color -->
|
|
<meta name="theme-color" content="#4af0c0">
|
|
<meta name="background-color" content="#0a1628">
|
|
|
|
<!-- PWA: Apple iOS Support -->
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
|
<meta name="apple-mobile-web-app-title" content="The Nexus">
|
|
<link rel="apple-touch-icon" href="/icons/nexus-icon.svg">
|
|
|
|
<!-- PWA: Microsoft Windows -->
|
|
<meta name="msapplication-TileColor" content="#0a1628">
|
|
<meta name="msapplication-config" content="none">
|
|
|
|
<!-- Styles -->
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<!-- ... existing content ... -->
|
|
|
|
<!-- Top Right: Audio Toggle -->
|
|
<div id="audio-control" class="hud-controls" style="position: absolute; top: 8px; right: 8px;">
|
|
<button id="audio-toggle" class="chat-toggle-btn" aria-label="Toggle ambient sound" style="background-color: var(--color-primary); color: var(--color-bg); padding: 4px 8px; border-radius: 4px; font-size: 12px; cursor: pointer;">
|
|
🔊
|
|
</button>
|
|
<audio id="ambient-sound" src="ambient.mp3" loop></audio>
|
|
</div>
|
|
|
|
<!-- ... existing content ... -->
|
|
|
|
<!-- Application Script -->
|
|
<script src="app.js"></script>
|
|
|
|
<!-- PWA: Service Worker Registration -->
|
|
<script>
|
|
(function() {
|
|
'use strict';
|
|
|
|
// Only register service worker in production (not in development with file://)
|
|
if ('serviceWorker' in navigator && window.location.protocol === 'https:' || window.location.hostname === 'localhost') {
|
|
window.addEventListener('load', function() {
|
|
navigator.serviceWorker.register('/sw.js')
|
|
.then(function(registration) {
|
|
console.log('[Nexus] Service Worker registered:', registration.scope);
|
|
|
|
// Handle updates
|
|
registration.addEventListener('updatefound', function() {
|
|
const newWorker = registration.installing;
|
|
newWorker.addEventListener('statechange', function() {
|
|
if (newWorker.state === 'installed' && navigator.serviceWorker.controller) {
|
|
// New version available
|
|
console.log('[Nexus] New version available, refreshing...');
|
|
// Optionally show update notification to user
|
|
if (confirm('A new version of The Nexus is available. Refresh to update?')) {
|
|
window.location.reload();
|
|
}
|
|
}
|
|
});
|
|
});
|
|
})
|
|
.catch(function(error) {
|
|
console.log('[Nexus] Service Worker registration failed:', error);
|
|
});
|
|
});
|
|
|
|
// Listen for messages from service worker
|
|
navigator.serviceWorker.addEventListener('message', function(event) {
|
|
if (event.data && event.data.type === 'OFFLINE_READY') {
|
|
console.log('[Nexus] App is ready for offline use');
|
|
}
|
|
});
|
|
} else {
|
|
console.log('[Nexus] Service Worker not supported or not in secure context');
|
|
}
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|