diff --git a/.editorconfig b/.editorconfig index 604c949..f3a5790 100644 --- a/.editorconfig +++ b/.editorconfig @@ -14,3 +14,7 @@ insert_final_newline = true [*.{js,html,scss,json,yml,md}] indent_size = 2 indent_style = space + + +[assets/favicon/manifest.json] +indent_size = 4 diff --git a/assets/favicon/manifest.json b/assets/favicon/manifest.json index 48e6336..13e40e5 100644 --- a/assets/favicon/manifest.json +++ b/assets/favicon/manifest.json @@ -1,5 +1,6 @@ { "name": "Meshviewer", + "short_name": "Meshviewer", "icons": [ { "src": "./android-chrome-192x192.png", @@ -14,6 +15,8 @@ ], "theme_color": "#dc0067", "background_color": "#dc0067", + "start_url": ".", "display": "standalone", "orientation": "portrait" -} \ No newline at end of file +} + diff --git a/gulp/tasks/copy.js b/gulp/tasks/copy.js index a9ed880..d7a0e1c 100644 --- a/gulp/tasks/copy.js +++ b/gulp/tasks/copy.js @@ -2,7 +2,7 @@ module.exports = function (gulp, plugins, config) { return function copy() { gulp.src(['html/*.html', 'assets/favicon/*']) .pipe(gulp.dest(config.build)); - gulp.src(['assets/logo.svg']) + gulp.src(['assets/logo.svg', 'service-worker.js']) .pipe(gulp.dest(config.build)); gulp.src(['node_modules/promise-polyfill/dist/promise.js', 'polyfill.js']) .pipe(gulp.dest(config.build + '/vendor')); diff --git a/html/offline.html b/html/offline.html new file mode 100644 index 0000000..3226a2a --- /dev/null +++ b/html/offline.html @@ -0,0 +1,23 @@ + + + + + Freifunk Regensburg e.V. - Meshviewer + + + + +
+

+ Your are Offline!
+ +
+ No connection available. +


+

+ +
+ + diff --git a/polyfill.js b/polyfill.js index c646e44..85bbc62 100644 --- a/polyfill.js +++ b/polyfill.js @@ -48,3 +48,7 @@ if (typeof Object.assign !== 'function') { window.CustomEvent = CustomEvent; })(); + +if ('serviceWorker' in navigator) { + navigator.serviceWorker.register('service-worker.js'); +} diff --git a/service-worker.js b/service-worker.js new file mode 100644 index 0000000..c34c979 --- /dev/null +++ b/service-worker.js @@ -0,0 +1,23 @@ +self.addEventListener('install', function (event) { + var offlineRequest = new Request('offline.html'); + event.waitUntil( + fetch(offlineRequest).then(function (response) { + return caches.open('offline').then(function (cache) { + return cache.put(offlineRequest, response); + }); + }) + ); +}); + +self.addEventListener('fetch', function (event) { + var request = event.request; + if (request.method === 'GET') { + event.respondWith( + fetch(request).catch(function () { + return caches.open('offline').then(function (cache) { + return cache.match('offline.html'); + }); + }) + ); + } +});