diff --git a/src/components/ServiceWorker.svelte b/src/components/ServiceWorker.svelte
index 1ec55af8..be278037 100644
--- a/src/components/ServiceWorker.svelte
+++ b/src/components/ServiceWorker.svelte
@@ -16,14 +16,16 @@
}
});
- async function refreshUpdate() {
+ async function refreshUpdate(changelog) {
open(
UpdateModal,
{
close,
+ changelog,
},
{
closeButton: false,
+ closeOnOuterClick: false,
styleWindow: { background: '#25294A', width: '500px' },
},
);
@@ -33,7 +35,7 @@
if ('serviceWorker' in navigator && import.meta.env.PROD) {
broadcastChannel = new BroadcastChannel('paimonmoe-sw');
broadcastChannel.addEventListener('message', (event) => {
- if (event.data.type === 'update') refreshUpdate();
+ if (event.data.type === 'update') refreshUpdate(event.data.changelog);
});
navigator.serviceWorker.register('/service-worker.js').then(
diff --git a/src/components/UpdateModal.svelte b/src/components/UpdateModal.svelte
index 2ec0b8f3..622e077d 100644
--- a/src/components/UpdateModal.svelte
+++ b/src/components/UpdateModal.svelte
@@ -4,6 +4,7 @@
import Button from '../components/Button.svelte';
export let close;
+ export let changelog;
function reload() {
window.location.reload();
@@ -16,7 +17,9 @@
{$t('update.whatsNew')}
- - Bug Fixes
+ {#each changelog as c}
+ - {c}
+ {/each}
diff --git a/src/service-worker.js b/src/service-worker.js
index 31d8f316..43f1cd8c 100644
--- a/src/service-worker.js
+++ b/src/service-worker.js
@@ -1,10 +1,18 @@
import { version } from '$service-worker';
const CACHE = `cache${version}`;
+
+const IMAGE_CACHE_VER = '2';
+const IMAGE_CACHE = `cacheimg${IMAGE_CACHE_VER}`;
+
+const IMAGE_URL = `${self.location.origin}/images/`;
+
+const changelog = ['Update timeline', 'Update locales'];
+
const channel = new BroadcastChannel('paimonmoe-sw');
-self.addEventListener('install', (event) => {
- event.waitUntil(self.skipWaiting());
+self.addEventListener('install', () => {
+ self.skipWaiting();
});
async function fetchAddCache(url) {
@@ -27,7 +35,7 @@ self.addEventListener('activate', (event) => {
let needUpdate = false;
// delete old caches
for (const key of keys) {
- if (key !== CACHE) {
+ if (key !== CACHE && key !== IMAGE_CACHE) {
await caches.delete(key);
needUpdate = true;
}
@@ -38,7 +46,7 @@ self.addEventListener('activate', (event) => {
if (needUpdate) {
channel.postMessage({
type: 'update',
- version,
+ changelog,
});
}
@@ -53,11 +61,12 @@ self.addEventListener('activate', (event) => {
});
self.addEventListener('fetch', async (event) => {
- if (!event.request.url.startsWith(self.location.origin) || event.request.method !== 'GET') return;
+ if (event.request.url.indexOf(self.location.origin) !== 0 || event.request.method !== 'GET') return;
event.respondWith(
(async () => {
- const cache = await caches.open(CACHE);
+ const cachePath = event.request.url.indexOf(IMAGE_URL) === 0 ? IMAGE_CACHE : CACHE;
+ const cache = await caches.open(cachePath);
const cachedRes = await cache.match(event.request);
if (cachedRes) {