sha/sLogos
1
0
Fork 0
mirror of https://github.com/shadoll/sLogos.git synced 2026-02-04 02:53:22 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: Add PWA support with service worker and caching

Browse Source 
- Implemented service worker registration in main.js
- Added icons for PWA in manifest.json
- Created a basic service worker (sw.js) for caching static assets
- Generated a list of files to cache using a Node.js script (generate-pwa-cache-list.js)
- Added icon images (icon-192.png and icon-512.png) for PWA
- Defined PWA manifest with app details and icon references
This commit is contained in:
sHa
2025-06-11 22:36:48 +03:00
parent 1c0d303adc
commit 0650c40199
13 changed files with 175 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/icon-192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
public/icon-512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.8 KiB

14
public/index.html
View File

@@ -12,6 +12,20 @@
<link rel="icon" href="favicon.png" sizes="32x32">
<link rel="icon" href="favicon.ico" sizes="any">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Manifest and theme color for PWA -->
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#ffffff">
<!-- To test PWA in Safari: Open Web Inspector > Storage tab. You should see 'Service Workers' and 'Manifest'. -->
<script>
document.addEventListener('DOMContentLoaded', function() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').then(function(reg) {
console.log('Service worker registered.', reg);
});
}
});
</script>
</head>
<body>
<div id="app"></div>

20
public/manifest.json Normal file
View File

@@ -0,0 +1,20 @@
{
"name": "Logo Gallery",
"description": "A collection of company and brand logos accessible via GitHub Pages",
"start_url": ".",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#ffffff",
"icons": [
{
"src": "/icon-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}

54
public/sw.js Normal file
View File

@@ -0,0 +1,54 @@
// Basic service worker for caching static assets
// List of all files in the public folder to cache
const CACHE_NAME = 'pwa-cache-v5';
self.addEventListener('install', event => {
event.waitUntil(
fetch('/pwa-files-to-cache.json')
.then(response => response.json())
.then(files => {
return caches.open(CACHE_NAME).then(cache => {
return cache.addAll(files);
});
})
.catch(err => {
console.error('Failed to fetch pwa-files-to-cache.json', err);
})
);
self.skipWaiting();
});
self.addEventListener('activate', event => {
event.waitUntil(
caches.keys().then(cacheNames => {
return Promise.all(
cacheNames.filter(name => name !== CACHE_NAME).map(name => caches.delete(name))
);
})
);
self.clients.claim();
});
self.addEventListener('fetch', event => {
if (event.request.method !== 'GET') return;
const url = new URL(event.request.url);
// Remove query params for cache matching for static files
let cacheKey = url.pathname;
// Only do this for files we know are static (e.g., /data/, /logos/, /logos_gen/, /public/)
if (cacheKey.startsWith('/data/') || cacheKey.startsWith('/logos/') || cacheKey.startsWith('/logos_gen/')) {
// ignore query params
} else {
cacheKey = event.request.url;
}
event.respondWith(
caches.match(cacheKey).then(response => {
if (response) return response;
return fetch(event.request).catch(() => {
if (event.request.mode === 'navigate') {
return caches.match('/index.html');
}
return Response.error();
});
})
);
});