diff --git a/public/service-worker.js b/public/service-worker.js index af26067..2b17217 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -6,24 +6,60 @@ var STATIC_CACHE_URLS = ["/"]; console.log("Nåværende versjon:", version); self.addEventListener("activate", event => { - event.waitUntil( - new Promise(resolve => { - const applicationServerKey = urlB64ToUint8Array(__PUBLICKEY__); - const options = { applicationServerKey, userVisibleOnly: true }; - self.registration.pushManager.subscribe(options).then(subscription => - saveSubscription(subscription) - .then(() => { - resolve(); - }) - .catch(() => { - resolve(); - }) - ); - }) - ); + console.log("Aktiverer"); + event.waitUntil(removeCache(CACHE_NAME)); event.waitUntil(removeCache(CACHE_NAME_API)); event.waitUntil(addCache(CACHE_NAME, STATIC_CACHE_URLS)); + event.waitUntil( + new Promise((resolve, reject) => { + const applicationServerKey = urlB64ToUint8Array(__PUBLICKEY__); + const options = { applicationServerKey, userVisibleOnly: true }; + self.registration.pushManager + .subscribe(options) + .then(subscription => + saveSubscription(subscription) + .then(() => { + resolve(); + }) + .catch(() => { + resolve(); + }) + ) + .catch(() => { + console.log("Kunne ikke legge til pushnotifications"); + resolve(); + }); + }) + ); +}); + +self.addEventListener("message", event => { + if (event.data === "updatePush") { + event.waitUntil( + new Promise((resolve, reject) => { + const applicationServerKey = urlB64ToUint8Array(__PUBLICKEY__); + const options = { applicationServerKey, userVisibleOnly: true }; + self.registration.pushManager + .subscribe(options) + .then(subscription => + saveSubscription(subscription) + .then(() => { + const channel = new BroadcastChannel("updatePush"); + channel.postMessage({ success: true }); + resolve(); + }) + .catch(() => { + resolve(); + }) + ) + .catch(() => { + console.log("Kunne ikke legge til pushnotifications"); + reject(); + }); + }) + ); + } }); self.addEventListener("push", function(event) { diff --git a/src/Vinlottis.vue b/src/Vinlottis.vue index a629c0d..cfb3bcb 100644 --- a/src/Vinlottis.vue +++ b/src/Vinlottis.vue @@ -17,6 +17,13 @@ export default { mounted() { console.log("SNEAKY PETE!"); if ("serviceWorker" in navigator) { + const channel = new BroadcastChannel("updatePush"); + channel.addEventListener("message", event => { + if (event.data.success) { + localStorage.setItem("push", true); + } + }); + navigator.serviceWorker .register("/service-worker.js") .then(serviceWorker => { @@ -24,6 +31,8 @@ export default { "Arbeids arbeideren din er installert. Du kan nå gå offline frem til neste trekning." ); + // From your client pages: + serviceWorker.onupdatefound = () => { const installingWorker = serviceWorker.installing; installingWorker.onstatechange = () => { @@ -44,6 +53,9 @@ export default { if (permission !== "granted") { throw new Error("Permission not granted for Notification"); } + if (localStorage.getItem("push") == null) { + this.sendMessage("updatePush"); + } }); }) .catch(error => { @@ -53,7 +65,39 @@ export default { }, computed: {}, - methods: {} + methods: { + sendMessage: function(message) { + // This wraps the message posting/response in a promise, which will + // resolve if the response doesn't contain an error, and reject with + // the error if it does. If you'd prefer, it's possible to call + // controller.postMessage() and set up the onmessage handler + // independently of a promise, but this is a convenient wrapper. + return new Promise(function(resolve, reject) { + var messageChannel = new MessageChannel(); + messageChannel.port1.onmessage = function(event) { + if (event.data.error) { + reject(event.data.error); + } else { + resolve(event.data); + } + }; + + // This sends the message data as well as transferring + // messageChannel.port2 to the service worker. + // The service worker can then use the transferred port to reply + // via postMessage(), which will in turn trigger the onmessage + // handler on messageChannel.port1. + // See + // https://html.spec.whatwg.org/multipage/workers.html#dom-worker-postmessage + if (navigator.serviceWorker.controller == null) { + resolve(); + } + navigator.serviceWorker.controller.postMessage(message, [ + messageChannel.port2 + ]); + }); + } + } };