Adds a service worker using Workbox.

app/html/_base.html

@@ -5,8 +5,8 @@
   <meta http-equiv="X-UA-Compatible" content="chrome=1">
   <title>Android Asset Studio{% if title %} - {{ title }}{% endif %}</title>
 
-  <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,500|Roboto+Mono:400,500">
-  <link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,500|Roboto+Mono:400,500">
+  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
   <link rel="stylesheet" href="lib/spectrum/spectrum.css">
   <link rel="stylesheet" href="styles/app.css">
   <link href="favicon.ico" rel="icon">

app/scripts/app.js

@@ -19,3 +19,9 @@ import {studio} from './studio';
 import {imagelib} from './imagelib';
 
 window.pages = pages;
+
+window.addEventListener('load', function() {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.register('sw.js');
+  }
+});

app/sw.js

@@ -0,0 +1,21 @@
+importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.3.1/workbox-sw.js");
+
+workbox.precaching.precacheAndRoute([]);
+
+workbox.routing.registerRoute(
+  new RegExp('https://(?:fonts|www).(?:googleapis|gstatic).com/(.*)'),
+  workbox.strategies.cacheFirst({
+    cacheName: 'google-fonts',
+    plugins: [
+      new workbox.expiration.Plugin({
+        maxEntries: 20,
+        purgeOnQuotaError: true,
+      }),
+      new workbox.cacheableResponse.Plugin({
+        statuses: [0, 200]
+      }),
+    ],
+  }),
+);
+
+workbox.googleAnalytics.initialize();

gulpfile.js

@@ -35,7 +35,8 @@ const through = require('through2');
 const url = require('url');
 const yaml = require('js-yaml');
 const path = require('path');
-
+const workboxBuild = require('workbox-build');
+const prettyBytes = require('pretty-bytes');
 
 var AUTOPREFIXER_BROWSERS = [
   'ie >= 10',
@@ -242,11 +243,36 @@ gulp.task('serve:dist', ['default'], function () {
   });
 });
 
+gulp.task('service-worker', function() {
+  return workboxBuild.injectManifest({
+    swSrc: path.join('app', 'sw.js'),
+    swDest: path.join('dist', 'sw.js'),
+    globDirectory: 'dist',
+    globPatterns: [
+      '*.html',
+      '**/jquery.min.js',
+      '**/spectrum.{css,js}',
+      'res/**/*.svg',
+      'scripts/**/*.js',
+      'styles/**/*.css',
+    ],
+  }).then(function(obj) {
+    obj.warnings.forEach(function(warning) {
+      console.warn(warning);
+    });
+    console.log('A service worker was generated to precache', obj.count,
+                'files, totalling', prettyBytes(obj.size));
+  });
+});
+
 // Build Production Files, the Default Task
 gulp.task('default', ['clean'], function (cb) {
-  runSequence('styles',
-      ['scripts', 'bower', 'html', 'res', 'copy'],
-      cb);
+  runSequence(
+    'styles',
+    ['scripts', 'bower', 'html', 'res', 'copy'],
+    'service-worker',
+    cb
+  );
 });
 
 // Deploy to GitHub pages