diff options
Diffstat (limited to 'misc')
-rw-r--r-- | misc/dist/html/editor.html | 36 | ||||
-rw-r--r-- | misc/dist/html/service-worker.js | 112 |
2 files changed, 105 insertions, 43 deletions
diff --git a/misc/dist/html/editor.html b/misc/dist/html/editor.html index a681a2a1c3..9e03f50c37 100644 --- a/misc/dist/html/editor.html +++ b/misc/dist/html/editor.html @@ -265,6 +265,7 @@ <button id="btn-close-editor" class="btn close-btn" disabled="disabled" onclick="closeEditor()">×</button> <button id="btn-tab-game" class="btn tab-btn" disabled="disabled" onclick="showTab('game')">Game</button> <button id="btn-close-game" class="btn close-btn" disabled="disabled" onclick="closeGame()">×</button> + <button id="btn-tab-update" class="btn tab-btn" style="display: none;">Update</button> </div> <div id="tabs"> <div id="tab-loader"> @@ -324,10 +325,39 @@ <div id="status-notice" class="godot" style="display: none;"></div> </div> </div> - <script> + <script>//<![CDATA[ window.addEventListener("load", () => { + function notifyUpdate(sw) { + const btn = document.getElementById("btn-tab-update"); + btn.onclick = function () { + if (!window.confirm("Are you sure you want to update?\nClicking \"OK\" will reload all active instances!")) { + return; + } + sw.postMessage("update"); + btn.innerHTML = "Updating..."; + btn.disabled = true; + }; + btn.style.display = ""; + } if ("serviceWorker" in navigator) { - navigator.serviceWorker.register("service.worker.js"); + navigator.serviceWorker.register("service.worker.js").then(function (reg) { + if (reg.waiting) { + notifyUpdate(reg.waiting); + } + reg.addEventListener("updatefound", function () { + const update = reg.installing; + update.addEventListener("statechange", function () { + if (update.state === "installed") { + // It's a new install, claim and perform aggressive caching. + if (!reg.active) { + update.postMessage("claim"); + } else { + notifyUpdate(update); + } + } + }); + }); + }); } if (localStorage.getItem("welcomeModalDismissed") !== 'true') { @@ -342,7 +372,7 @@ localStorage.setItem("welcomeModalDismissed", 'true'); } } - </script> + //]]></script> <script src="godot.tools.js"></script> <script>//<![CDATA[ diff --git a/misc/dist/html/service-worker.js b/misc/dist/html/service-worker.js index 063e40a6cb..310574f21d 100644 --- a/misc/dist/html/service-worker.js +++ b/misc/dist/html/service-worker.js @@ -4,7 +4,8 @@ // Incrementing CACHE_VERSION will kick off the install event and force // previously cached resources to be updated from the network. const CACHE_VERSION = "@GODOT_VERSION@"; -const CACHE_NAME = "@GODOT_NAME@-cache"; +const CACHE_PREFIX = "@GODOT_NAME@-sw-cache-"; +const CACHE_NAME = CACHE_PREFIX + CACHE_VERSION; const OFFLINE_URL = "@GODOT_OFFLINE_PAGE@"; // Files that will be cached on load. const CACHED_FILES = @GODOT_CACHE@; @@ -13,26 +14,35 @@ const CACHABLE_FILES = @GODOT_OPT_CACHE@; const FULL_CACHE = CACHED_FILES.concat(CACHABLE_FILES); self.addEventListener("install", (event) => { - event.waitUntil(async function () { - const cache = await caches.open(CACHE_NAME); - // Clear old cache (including optionals). - await Promise.all(FULL_CACHE.map(path => cache.delete(path))); - // Insert new one. - const done = await cache.addAll(CACHED_FILES); - return done; - }()); + event.waitUntil(caches.open(CACHE_NAME).then(cache => cache.addAll(CACHED_FILES))); }); self.addEventListener("activate", (event) => { - event.waitUntil(async function () { - if ("navigationPreload" in self.registration) { - await self.registration.navigationPreload.enable(); - } - }()); - // Tell the active service worker to take control of the page immediately. - self.clients.claim(); + event.waitUntil(caches.keys().then( + function (keys) { + // Remove old caches. + return Promise.all(keys.filter(key => key.startsWith(CACHE_PREFIX) && key != CACHE_NAME).map(key => caches.delete(key))); + }).then(function() { + // Enable navigation preload if available. + return ("navigationPreload" in self.registration) ? self.registration.navigationPreload.enable() : Promise.resolve(); + }) + ); }); +async function fetchAndCache(event, cache, isCachable) { + // Use the preloaded response, if it's there + let response = await event.preloadResponse; + if (!response) { + // Or, go over network. + response = await self.fetch(event.request); + } + if (isCachable) { + // And update the cache + cache.put(event.request, response.clone()); + } + return response; +} + self.addEventListener("fetch", (event) => { const isNavigate = event.request.mode === "navigate"; const url = event.request.url || ""; @@ -42,32 +52,54 @@ self.addEventListener("fetch", (event) => { const isCachable = FULL_CACHE.some(v => v === local) || (base === referrer && base.endsWith(CACHED_FILES[0])); if (isNavigate || isCachable) { event.respondWith(async function () { - try { - // Use the preloaded response, if it's there - let request = event.request.clone(); - let response = await event.preloadResponse; - if (!response) { - // Or, go over network. - response = await fetch(event.request); - } - if (isCachable) { - // Update the cache - const cache = await caches.open(CACHE_NAME); - cache.put(request, response.clone()); - } - return response; - } catch (error) { - const cache = await caches.open(CACHE_NAME); - if (event.request.mode === "navigate") { - // Check if we have full cache. - const cached = await Promise.all(FULL_CACHE.map(name => cache.match(name))); - const missing = cached.some(v => v === undefined); - const cachedResponse = missing ? await caches.match(OFFLINE_URL) : await caches.match(CACHED_FILES[0]); - return cachedResponse; + // Try to use cache first + const cache = await caches.open(CACHE_NAME); + if (event.request.mode === "navigate") { + // Check if we have full cache during HTML page request. + const fullCache = await Promise.all(FULL_CACHE.map(name => cache.match(name))); + const missing = fullCache.some(v => v === undefined); + if (missing) { + try { + // Try network if some cached file is missing (so we can display offline page in case). + return await fetchAndCache(event, cache, isCachable); + } catch (e) { + // And return the hopefully always cached offline page in case of network failure. + console.error("Network error: ", e); + return await caches.match(OFFLINE_URL); + } } - const cachedResponse = await caches.match(event.request); - return cachedResponse; + } + const cached = await cache.match(event.request); + if (cached) { + return cached; + } else { + // Try network if don't have it in cache. + return await fetchAndCache(event, cache, isCachable); } }()); } }); + +self.addEventListener("message", (event) => { + // No cross origin + if (event.origin != self.origin) { + return; + } + const id = event.source.id || ""; + const msg = event.data || ""; + // Ensure it's one of our clients. + self.clients.get(id).then(function (client) { + if (!client) { + return; // Not a valid client. + } + if (msg === "claim") { + self.skipWaiting().then(() => self.clients.claim()); + } else if (msg === "clear") { + caches.delete(CACHE_NAME); + } else if (msg === "update") { + self.skipWaiting().then(() => self.clients.claim()).then(() => self.clients.matchAll()).then(all => all.forEach(c => c.navigate(c.url))); + } else { + onClientMessage(event); + } + }); +}); |