static: support offline page service worker

static/js/pwabuilder-sw.js

@@ -0,0 +1,55 @@
+//This is the service worker with the combined offline experience (Offline page + Offline copy of pages)
+
+//Install stage sets up the offline page in the cache and opens a new cache
+self.addEventListener('install', function(event) {
+  event.waitUntil(preLoad());
+});
+
+var preLoad = function(){
+  console.log('[PWA Builder] Install Event processing');
+  return caches.open('pwabuilder-offline').then(function(cache) {
+    console.log('[PWA Builder] Cached index and offline page during Install');
+    return cache.addAll(['/offline.html', '/index.html']);
+  });
+}
+
+self.addEventListener('fetch', function(event) {
+  console.log('[PWA Builder] The service worker is serving the asset.');
+  event.respondWith(checkResponse(event.request).catch(function() {
+    return returnFromCache(event.request)}
+  ));
+  event.waitUntil(addToCache(event.request));
+});
+
+var checkResponse = function(request){
+  return new Promise(function(fulfill, reject) {
+    fetch(request).then(function(response){
+      if(response.status !== 404) {
+        fulfill(response)
+      } else {
+        reject()
+      }
+    }, reject)
+  });
+};
+
+var addToCache = function(request){
+  return caches.open('pwabuilder-offline').then(function (cache) {
+    return fetch(request).then(function (response) {
+      console.log('[PWA Builder] add page to offline'+response.url)
+      return cache.put(request, response);
+    });
+  });
+};
+
+var returnFromCache = function(request){
+  return caches.open('pwabuilder-offline').then(function (cache) {
+    return cache.match(request).then(function (matching) {
+     if(!matching || matching.status == 404) {
+       return cache.match('offline.html')
+     } else {
+       return matching
+     }
+    });
+  });
+};

static/manifest.json

@@ -1,9 +1,17 @@
 {
-  "name": "Christine Dodrill",
+    "name": "Christine Dodrill",
-  "short_name": "Christine",
+    "short_name": "Christine",
-  "theme_color": "#ffcbe4",
+    "theme_color": "#ffcbe4",
-  "background_color": "#fa99ca",
+    "background_color": "#fa99ca",
-  "display": "standalone",
+    "display": "standalone",
-  "scope": "/",
+    "scope": "/",
-  "start_url": "/"
+    "start_url": "https://christine.website/",
-}
+    "description": "Blog and Resume for Christine Dodrill",
+    "orientation": "any",
+    "icons": [
+        {
+            "src": "https://christine.website/static/img/avatar.png",
+            "sizes": "1024x1024"
+        }
+    ]
+}

templates/base.html

@@ -62,6 +62,17 @@
             <footer>
                 <blockquote>Copyright 2018 Christine Dodrill. Any and all opinions listed here are my own and not representative of my employer.</blockquote>
             </footer>
+            <script>
+             if (navigator.serviceWorker.controller) {
+                 console.log("Active service worker found, no need to register");
+             } else {
+                 navigator.serviceWorker.register("/static/js/pwabuilder-sw.js", {
+                     scope: "https://christine.website/"
+                 }).then(function(reg) {
+                     console.log("Service worker has been registered for scope:" + reg.scope);
+                 });
+             }
+            </script>
         </div>
     </body>
 </html>