diff --git a/examples/lib/cache.js b/examples/lib/cache.js
index 969ea3c627..2f44da5702 100644
--- a/examples/lib/cache.js
+++ b/examples/lib/cache.js
@@ -1,5 +1,3 @@
-const { reject } = require("lodash");
-
var setupCache = function() {
let newWorker; // When sw.js is changed, this is the new service worker generated.
@@ -21,34 +19,38 @@ var setupCache = function() {
// Register the service worker.
navigator.serviceWorker.register('sw.js', { scope: '/examples/' })
.then(function(registration) {
- registration.addEventListener('updatefound', () => {
- // When sw.js has been changed, get a reference to the new service worker.
- newWorker = registration.installing;
- if(!newWorker){
- return reject(new Error('error in installing service worker'));
- }
+ return new Promise(function(resolve,reject){
+
+ registration.addEventListener('updatefound', () => {
+ // When sw.js has been changed, get a reference to the new service worker.
+ newWorker = registration.installing;
+
+ if(!newWorker){
+ return reject(new Error('error in installing service worker'));
+ }
- newWorker.addEventListener('statechange', () => {
- // Check if service worker state has changed.
- switch(newWorker.state) {
- case 'installed':
- if(navigator.serviceWorker.controller) {
- // New service worker available; prompt the user to update.
- showUpdateModal();
- $('#reload').on('click',(e) => {
- e.preventDefault();
- console.log('New Service Worker Installed Successfully');
- location.reload();
- return resolve();
- })
- }
- // No updates available; do nothing.
- break;
+ newWorker.addEventListener('statechange', () => {
+ // Check if service worker state has changed.
+ switch(newWorker.state) {
+ case 'installed':
+ if(navigator.serviceWorker.controller) {
+ // New service worker available; prompt the user to update.
+ showUpdateModal();
+ $('#reload').on('click',(e) => {
+ e.preventDefault();
+ console.log('New Service Worker Installed Successfully');
+ location.reload();
+ return resolve();
+ })
+ }
+ // No updates available; do nothing.
+ break;
- case 'redundant':
- return reject(new Error('installing new service worker now became redundant'));
- }
+ case 'redundant':
+ return reject(new Error('installing new service worker now became redundant'));
+ }
+ })
})
})
}).catch(err => {
diff --git a/examples/offline.html b/examples/offline.html
new file mode 100644
index 0000000000..0c9844d5a0
--- /dev/null
+++ b/examples/offline.html
@@ -0,0 +1,34 @@
+
+
+
+
+
+ Error 502 | Bad Gateway
+
+
+
+
+ Error 502: something went wrong.
+ It seems that you are not connected to internet.
Please try after some time.
+ Go To Home Page
+
+
+
\ No newline at end of file
diff --git a/examples/sw.js b/examples/sw.js
index bb5e28b7f6..ea87448757 100644
--- a/examples/sw.js
+++ b/examples/sw.js
@@ -1,6 +1,14 @@
const staticCacheName = 'image-sequencer-static-v3.6.0';
-self.addEventListener('install', event => {
- console.log('Attempting to install service worker');
+self.addEventListener('install', function(e) {
+ e.waitUntil(
+ caches.open(staticCacheName).then(function(cache) {
+ console.log('Attempting to install service worker');
+ return cache.addAll([
+ '/',
+ '/examples/offline.html'
+ ]);
+ })
+ );
});
self.addEventListener('activate', function(e) {
@@ -21,16 +29,28 @@ self.addEventListener('activate', function(e) {
self.addEventListener('fetch', function(event) {
event.respondWith(
- caches.open(staticCacheName).then(function(cache) {
- return cache.match(event.request).then(function (response) {
- return response || fetch(event.request).then(function(response) {
- if(event.request.method == 'GET')
- cache.put(event.request, response.clone());
- return response;
+ // Try to fetch the latest data first.
+ fetch(event.request)
+ .then(function(response) {
+ return caches.open(staticCacheName)
+ .then(function(cache) {
+ if(event.request.method == 'GET'){
+ cache.put(event.request.url, response.clone());
+ }
+ return response;
+ })
+ })
+ .catch(function(err) {
+ // Now the request has been failed so show cached data.
+ return caches.match(event.request).then(function(res){
+ if (res === undefined) {
+ // Display offline page
+ return caches.match('offline.html');
+ }
+ return res;
});
- });
})
- );
+ )
});
// When the update modal sends a 'skipWaiting' message, call the skipWaiting method.