差分
このページの2つのバージョン間の差分を表示します。
| 両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
| ハイハイスクールアドベンチャー_web版 [2025/10/20 01:57] – [クラスとかラムダ式とか] araki | ハイハイスクールアドベンチャー_web版 [2025/10/20 02:00] (現在) – [PWA] araki | ||
|---|---|---|---|
| 行 79: | 行 79: | ||
| ウェブページ上に 512x304((要するに倍のサイズ))で canvasを用意して、プログラム中ではネイティブサイズのダミーの canvas に書き込みを行い、倍サイズの表示領域に拡大転送することでこれを実現している。 | ウェブページ上に 512x304((要するに倍のサイズ))で canvasを用意して、プログラム中ではネイティブサイズのダミーの canvas に書き込みを行い、倍サイズの表示領域に拡大転送することでこれを実現している。 | ||
| - | < | + | < |
| this.zctx = document.getElementById(" | this.zctx = document.getElementById(" | ||
| this.zctx.imageSmoothingEnabled = true; | this.zctx.imageSmoothingEnabled = true; | ||
| 行 249: | 行 249: | ||
| if (' | if (' | ||
| { | { | ||
| + | navigator.serviceWorker.addEventListener(' | ||
| + | if (event.data && event.data.type == ' | ||
| + | const shouldReload = confirm(' | ||
| + | if (shouldReload) | ||
| + | { | ||
| + | window.location.reload(); | ||
| + | } | ||
| + | } | ||
| + | }); | ||
| navigator.serviceWorker.register(' | navigator.serviceWorker.register(' | ||
| } | } | ||
| 行 298: | 行 307: | ||
| }) | }) | ||
| ); | ); | ||
| + | }); | ||
| + | |||
| + | // update | ||
| + | self.addEventListener(' | ||
| + | const cacheWhitelist = []; // 現在有効なキャッシュ名 | ||
| + | |||
| + | event.waitUntil( | ||
| + | caches.keys().then((cacheNames) => { | ||
| + | return Promise.all( | ||
| + | cacheNames.map((cacheName) => { | ||
| + | // 現在のバージョンに含まれていない（古い）キャッシュを削除 | ||
| + | if (cacheWhitelist.indexOf(cacheName) === -1) { | ||
| + | console.log(' | ||
| + | return caches.delete(cacheName); | ||
| + | } | ||
| + | }) | ||
| + | ); | ||
| + | }) | ||
| + | // すべてのキャッシュ削除が完了したら、クライアントへの制御を引き継ぐ | ||
| + | .then(() => self.clients.claim()) | ||
| + | ); | ||
| + | | ||
| + | event.waitUntil( | ||
| + | // すべてのクライアントに更新完了を通知 | ||
| + | self.clients.claim().then(() => { | ||
| + | self.clients.matchAll().then((clients) => { | ||
| + | clients.forEach(client => { | ||
| + | client.postMessage({ type: ' | ||
| + | }); | ||
| + | }); | ||
| + | }) | ||
| + | ); | ||
| }); | }); | ||
| </ | </ | ||