Skip to content

Instantly share code, notes, and snippets.

@JBreit

JBreit/index.html

Last active April 6, 2017 03:01
Show Gist options
  • Save JBreit/4a61421e07ffa82045de8d45588ac279 to your computer and use it in GitHub Desktop.
Save JBreit/4a61421e07ffa82045de8d45588ac279 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<base href="/">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="Jason Breitigan">
<link rel="manifest" href="manifest.json">
<link rel="icon" href="assets/img/favicon.ico">
<title>Service Worker</title>
<link rel="stylesheet" type="text/css" href="assets/css/reset.css">
<link rel="stylesheet" type="text/css" href="assets/css/main.css">
</head>
<body>
<div id="application" class="application" role="application">
<header id="header" class="header" role="header">
<a id="brand" class="brand" href="/">Service Worker</a>
<nav id="navigation" class="navigation" role="navigation">
<ul>
<li><a class="nav-links" href="/">Home</a></li>
<li><a class="nav-links" href="/list.html">List</a></li>
<li><a class="nav-links" href="/contact.html">Contact</a></li>
</ul>
</nav>
</header>
<main id="main" class="main" role="main">
<h1 id="title"></h1>
<div id="content"></div>
</main>
<footer id="footer" class="footer">
</footer>
</div><!-- end application -->
<script src="index.js"></script>
</body>
</html>
Raw
index.js
/*global fetch Response Request URL*/
(function (self) {
'use strict';
var registerServiceWorker = function (options) {
self.addEventListener('load', function () {
navigator.serviceWorker.register(options.path, {scope: options.scope}).then(function (registration) {
console.info('> [ServiceWorker] registration successful with scope: ', registration.scope);
}).catch(function (err) {
console.error('> [ServiceWorker] registration failed: ', err);
});
});
};
if (self.fetch !== undefined) {
if (navigator.serviceWorker !== undefined) {
registerServiceWorker({
path: '/service-worker.js',
scope: '/'
});
} else {
console.log('ServiceWorker not supported');
}
} else {
console.log('fetch not supported. Use XMLHttpRequest request object');
}
}(this));
Raw
manifest.json
{
"name": "Inner Mind Consulting",
"version": "0.0.1",
"short_name": "InnerMind",
"default_locale": "en",
"author": "Jason Breitigan",
"developer": {
"name": "Jason Breitigan",
"email": "<[email protected]>",
"url": "http://www.innermindco.com/"
},
"scope": "/",
"icons": [{
"src": "/assets/img/favicon.ico",
"sizes": "64x64",
"type": "image/x-icon"
}],
"display": "standalone",
"start_url": "/index.html"
}
Raw
service-worker.js
/*global fetch Handlebars importScripts Response Request URL*/
(function (self) {
'use strict';
var caches = self.caches,
APPLICATION_NAME = 'innermindco.com',
CURRENT_VERSION = '0.0.1',
CURRENT_CACHE = APPLICATION_NAME + '-v' + CURRENT_VERSION,
CACHE_URLS = [
'/',
'/index.html',
'/pages/index.html',
'/pages/about.html',
'/pages/contact.html',
'/pages/list.html',
'/assets/css/reset.css',
'/assets/css/main.css',
'/assets/img/favicon.ico',
'/main.js',
'/assets/lib/vendor/handlebars.js',
'/assets/lib/vendor/modernizr.js',
'/assets/lib/vendor/jquery.js'
];
var preCache = function (cacheName) {
return caches.open(cacheName).then(function (cache) {
return cache.addAll(CACHE_URLS);
});
};
var cached = preCache(CURRENT_CACHE);
self.addEventListener('install', function (event) {
event.waitUntil(cached.then(function () {
self.skipWaiting();
}));
});
self.addEventListener('fetch', function (event) {
event.respondWith(caches.open(CURRENT_CACHE).then(function (cache) {
return fetch(event.request).then(function (response) {
cache.put(event.request, response.clone());
return response;
}).catch(function () {
return caches.match('/offline.html');
});
}));
});
// self.addEventListener('fetch', function (event) {
// var request = event.request;
// event.respondWith(caches.match(request).then(function (response) {
// console.log(response.type);
// console.log(response.url);
// console.log(response.useFinalURL);
// console.log(response.status);
// console.log(response.ok);
// console.log(response.statusText);
// console.log(response.headers);
// return response || fetch(request);
// }).catch(function () {
// return caches.match('/index.html');
// }));
// });
/*self.addEventListener('activate', function (event) {
var cacheWhiteList = [CURRENT_CACHE];
//console.log('White List: ', cacheWhiteList);
event.waitUntil(caches.keys(function (cacheNames) {
return Promise.all(cacheNames.filter(function (cacheName) {
return cacheWhiteList.indexOf(cacheName) === -1;
})).map(function (cacheName) {
return caches.delete(cacheName);
});
}));
});*/
self.addEventListener('activate', function (event) {
var cacheWhiteList = [CURRENT_CACHE];
console.log('White List: ', cacheWhiteList);
event.waitUntil(caches.keys(function (cacheNames) {
return Promise.all(cacheNames.map(function (cacheName) {
if (cacheWhiteList.indexOf(cacheName) === -1) {
console.log('Deleting out of date cache:', cacheName);
return caches.delete(cacheName);
}
}));
}));
});
}(this));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment