Update Function

This commit is contained in:
JonatanRek 2020-09-06 12:38:26 +02:00
parent cc185b344e
commit 7167d86285
7 changed files with 83 additions and 23 deletions

View File

@ -8,7 +8,9 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.20.0",
"core-js": "^3.6.5",
"firebase": "^7.19.1",
"register-service-worker": "^1.7.1",
"vue": "^2.6.11"
},

View File

@ -10,8 +10,8 @@
</div>
</div>
<Notification />
<UpdateBar />
<GamesList />
</div>
</template>
<style>
@ -35,18 +35,20 @@ body {
<script>
import GamesList from "./components/GamesList.vue";
import Notification from "./components/Notification.vue";
import UpdateBar from "./components/UpdateBar.vue";
export default {
name: "App",
data() {
return {
title: "Gaben Paradise",
content: "get information about free games in one place"
content: "get information about free games in one place",
};
},
components: {
GamesList,
Notification
}
Notification,
UpdateBar
},
};
</script>

View File

@ -1,4 +1,5 @@
<template>
<!--Alert Bar-->
<div v-if="noAlert">
<div class="alert" :class="alert.color" role="alert">
{{ alert.text }}

View File

@ -0,0 +1,49 @@
<template>
<!--Notification Bar-->
<div v-if="once">
<div class="alert alert-danger" role="alert">
Update Awailible
<button type="button" class="btn btn-primary" v-on:click="refreshApp">Refresh</button>
</div>
</div>
</template>
<script>
export default {
data() {
return {
once: false,
refreshing: false,
registration: null,
updateExists: false
};
},
created() {
document.addEventListener("swUpdated", () => {
console.log(event);
console.log(event);
console.log(event);
this.updateAvailable(event);
this.once = true;
});
navigator.serviceWorker.addEventListener("controllerchange", () => {
if (this.refreshing) return;
this.refreshing = true;
window.location.reload();
});
},
methods: {
updateAvailable(event) {
this.registration = event.detail;
this.updateExists = true;
},
refreshApp() {
this.updateExists = false;
if (!this.registration || !this.registration.waiting) return;
this.registration.waiting.postMessage({ type: "SKIP_WAITING" });
}
}
};
</script>

View File

@ -47,10 +47,11 @@ if (process.env.NODE_ENV === "production") {
updatefound() {
console.log("New content is downloading.");
},
updated() {
updated(registration) {
console.log("New content is available; please refresh.");
window.location.reload();
console.log("Reloading After Update");
document.dispatchEvent(
new CustomEvent('swUpdated', { detail: registration })
)
},
offline() {
console.log(

View File

@ -2,9 +2,6 @@
// debug: true
// });
self.skipWaiting();
console.log("Skiping Waiting");
self.addEventListener("push", function (event) {
if (event.data) {
var data = event.data.json();
@ -26,6 +23,7 @@ self.addEventListener("push", function(event) {
self.addEventListener("notificationclick", function (event) {
if (event.notification) {
if (data.data) {
var data = JSON.parse(event.notification.data.data);
if (data[event.action]) {
console.log(data);
@ -33,8 +31,15 @@ self.addEventListener("notificationclick", function(event) {
clients.openWindow("" + data[event.action]);
}
}
}
clients.openWindow("/");
});
self.addEventListener('message', (event) => {
if (event.data && event.data.type === 'SKIP_WAITING') {
self.skipWaiting()
}
})
self.__precacheManifest = [].concat(self.__precacheManifest || []);
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});