Freifunk-Leipzig
/
meshviewer
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[TASK] Add simple offline service worker

This commit is contained in:
Xaver Maierhofer 2018-03-11 13:53:03 +01:00
parent 8e8cdd63af
commit 87eb98f542
No known key found for this signature in database
GPG Key ID: 7FDCE23FD2EC9FE8
6 changed files with 59 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.editorconfig
View File

@ -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

5
assets/favicon/manifest.json
View File

@ -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"
}
}

2
gulp/tasks/copy.js
View File

@ -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'));

23
html/offline.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Freifunk Regensburg e.V. - Meshviewer</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="main.css" inline>
</head>
<body>
<div class="loader">
<p>
Your are Offline!<br />
<img inline src="logo.svg" class="spinner" alt="Loading ..."/>
<br />
No connection available.
<br /><br /><button onclick="location.reload(true)" class="btn text" aria-label="Try to reload">Try to reload</button><br />
</p>
<noscript>
<strong>JavaScript required</strong>
</noscript>
</div>
</body>
</html>

4
polyfill.js
View File

@ -48,3 +48,7 @@ if (typeof Object.assign !== 'function') {
window.CustomEvent = CustomEvent;
})();
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js');
}

23
service-worker.js Normal file
View File

@ -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');
});
})
);
}
});