mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 11:35:04 +01:00
WIP of messaging to sw
This commit is contained in:
parent
2fa39c51f2
commit
3aa1992a3f
29
index.html
29
index.html
@ -29,14 +29,32 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<script id="service-worker" type="disabled">
|
<script id="service-worker" type="module">
|
||||||
|
|
||||||
|
function workerMessage(worker, type) {
|
||||||
|
const body = {type, id: Math.floor(Math.random() * Number.MAX_SAFE_INTEGER)};
|
||||||
|
let resolve;
|
||||||
|
const promise = new Promise(r => resolve = r);
|
||||||
|
const onMessage = function(event) {
|
||||||
|
if (event.data.replyTo === body.id) {
|
||||||
|
worker.removeEventListener("message", onMessage);
|
||||||
|
resolve(event.data.content);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
worker.addEventListener("message", onMessage);
|
||||||
|
worker.postMessage(body);
|
||||||
|
return promise;
|
||||||
|
}
|
||||||
|
|
||||||
if('serviceWorker' in navigator) {
|
if('serviceWorker' in navigator) {
|
||||||
navigator.serviceWorker.register('sw.js').then(function(registration) {
|
navigator.serviceWorker.register('sw.js').then(function(registration) {
|
||||||
console.log("Service Worker registered");
|
console.log("Service Worker registered");
|
||||||
function tryActivateUpdate() {
|
async function tryActivateUpdate() {
|
||||||
if (registration.waiting && registration.active) {
|
if (registration.waiting && registration.active) {
|
||||||
registration.unregister();
|
const version = await workerMessage(registration.waiting, "version");
|
||||||
console.log("Service Worker unregistered");
|
if (confirm(`Version ${version.version} (${version.buildHash}) is ready to install. Apply now?`)) {
|
||||||
|
registration.waiting.postMessage({type: "skipWaiting"}); // will trigger controllerchange event
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
tryActivateUpdate();
|
tryActivateUpdate();
|
||||||
@ -47,6 +65,9 @@
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
navigator.serviceWorker.addEventListener("controllerchange", function() {
|
||||||
|
document.location.reload();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
@ -87,7 +87,7 @@ async function build({modernOnly}) {
|
|||||||
|
|
||||||
const globalHash = assets.hashForAll();
|
const globalHash = assets.hashForAll();
|
||||||
|
|
||||||
await buildServiceWorker(swSource, globalHash, assets);
|
await buildServiceWorker(swSource, version, globalHash, assets);
|
||||||
await buildHtml(doc, version, globalHash, modernOnly, assets);
|
await buildHtml(doc, version, globalHash, modernOnly, assets);
|
||||||
console.log(`built hydrogen ${version} (${globalHash}) successfully with ${assets.size} files`);
|
console.log(`built hydrogen ${version} (${globalHash}) successfully with ${assets.size} files`);
|
||||||
}
|
}
|
||||||
@ -246,7 +246,7 @@ async function buildManifest(assets) {
|
|||||||
await assets.write("manifest.json", JSON.stringify(webManifest));
|
await assets.write("manifest.json", JSON.stringify(webManifest));
|
||||||
}
|
}
|
||||||
|
|
||||||
async function buildServiceWorker(swSource, globalHash, assets) {
|
async function buildServiceWorker(swSource, version, globalHash, assets) {
|
||||||
const unhashedPreCachedAssets = ["index.html"];
|
const unhashedPreCachedAssets = ["index.html"];
|
||||||
const hashedPreCachedAssets = [];
|
const hashedPreCachedAssets = [];
|
||||||
const hashedCachedOnRequestAssets = [];
|
const hashedCachedOnRequestAssets = [];
|
||||||
@ -261,6 +261,7 @@ async function buildServiceWorker(swSource, globalHash, assets) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
// write service worker
|
// write service worker
|
||||||
|
swSource = swSource.replace(`"%%VERSION%%"`, `"${version}"`);
|
||||||
swSource = swSource.replace(`"%%GLOBAL_HASH%%"`, `"${globalHash}"`);
|
swSource = swSource.replace(`"%%GLOBAL_HASH%%"`, `"${globalHash}"`);
|
||||||
swSource = swSource.replace(`"%%UNHASHED_PRECACHED_ASSETS%%"`, JSON.stringify(unhashedPreCachedAssets));
|
swSource = swSource.replace(`"%%UNHASHED_PRECACHED_ASSETS%%"`, JSON.stringify(unhashedPreCachedAssets));
|
||||||
swSource = swSource.replace(`"%%HASHED_PRECACHED_ASSETS%%"`, JSON.stringify(hashedPreCachedAssets));
|
swSource = swSource.replace(`"%%HASHED_PRECACHED_ASSETS%%"`, JSON.stringify(hashedPreCachedAssets));
|
||||||
|
@ -148,6 +148,6 @@ export async function main(container, paths, legacyExtras) {
|
|||||||
const view = new RootView(vm);
|
const view = new RootView(vm);
|
||||||
container.appendChild(view.mount());
|
container.appendChild(view.mount());
|
||||||
} catch(err) {
|
} catch(err) {
|
||||||
console.error(`${err.message}:\n${err.stack}`);
|
console.error(`${err.message}:\n${err.stack}sdfdf`);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
|
|||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
const VERSION = "%%VERSION%%";
|
||||||
const GLOBAL_HASH = "%%GLOBAL_HASH%%";
|
const GLOBAL_HASH = "%%GLOBAL_HASH%%";
|
||||||
const UNHASHED_PRECACHED_ASSETS = "%%UNHASHED_PRECACHED_ASSETS%%";
|
const UNHASHED_PRECACHED_ASSETS = "%%UNHASHED_PRECACHED_ASSETS%%";
|
||||||
const HASHED_PRECACHED_ASSETS = "%%HASHED_PRECACHED_ASSETS%%";
|
const HASHED_PRECACHED_ASSETS = "%%HASHED_PRECACHED_ASSETS%%";
|
||||||
@ -67,6 +68,18 @@ self.addEventListener('fetch', (event) => {
|
|||||||
event.respondWith(handleRequest(event.request));
|
event.respondWith(handleRequest(event.request));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
self.addEventListener('message', (event) => {
|
||||||
|
const reply = content => event.source.postMessage({replyTo: event.data?.id, content});
|
||||||
|
switch (event.data?.type) {
|
||||||
|
case "version":
|
||||||
|
reply({version: VERSION, buildHash: GLOBAL_HASH});
|
||||||
|
break;
|
||||||
|
case "skipWaiting":
|
||||||
|
self.skipWaiting();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
async function handleRequest(request) {
|
async function handleRequest(request) {
|
||||||
const baseURL = self.registration.scope;
|
const baseURL = self.registration.scope;
|
||||||
if (request.url === baseURL) {
|
if (request.url === baseURL) {
|
||||||
|
Loading…
Reference in New Issue
Block a user