Merge branch 'pwa' into pwa-ws

package.json

@@ -10,13 +10,16 @@
     "server:dev": "nodemon --watch lib lib/server.js",
     "test": "mocha",
     "test:dev": "mocha --watch",
-    "dev": "npm-run-all -p build:dev server:dev test:dev"
+    "pwa:build": "nodemon --verbose --ignore dist --exec webpack",
+    "pwa:dev": "npm-run-all -p server build:dev",
+    "dev": "npm-run-all -p server:dev build:dev test:dev"
   },
   "author": "",
   "license": "ISC",
   "devDependencies": {
     "chai": "^4.2.0",
     "css-loader": "^2.1.0",
+    "file-loader": "^3.0.1",
     "html-loader": "^0.5.5",
     "html-webpack-plugin": "^3.2.0",
     "http-server": "^0.11.1",
@@ -28,7 +31,9 @@
     "webpack": "^4.28.2",
     "webpack-cli": "^3.1.2",
     "webpack-dev-server": "^3.1.14",
-    "webpack-livereload-plugin": "^2.2.0"
+    "webpack-livereload-plugin": "^2.2.0",
+    "webpack-pwa-manifest": "^4.0.0",
+    "workbox-webpack-plugin": "^3.6.3"
   },
   "dependencies": {
     "body-parser": "^1.18.3",

src/index.js

@@ -1,4 +1,18 @@
 const client = require('./client')
+const serviceWorkerFile = require('file-loader!./service-worker.js')
+
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.getRegistrations()
+    .then(regs => Promise.all(regs.map(reg => reg.unregister())))
+    .then(() => navigator.serviceWorker.register(serviceWorkerFile))
+  
+  .then(function(registration) {
+    console.log('Registration successful, scope is:', registration.scope);
+  })
+  .catch(function(error) {
+    console.log('Service worker registration failed, error:', error);
+  });
+}
 
 document.addEventListener('DOMContentLoaded', () => {
   client.connect()
@@ -8,4 +22,4 @@ document.addEventListener('DOMContentLoaded', () => {
   client.addEventListener('message', evt => {
     console.log(evt.data)
   })
-})
+})

src/service-worker.js

@@ -0,0 +1,3 @@
+self.addEventListener('install', event => {})
+self.addEventListener('activate', event => {})
+self.addEventListener('fetch', event => {})

webpack.config.js

@@ -1,11 +1,32 @@
+const Path = require('path')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const LiveReloadPlugin = require('webpack-livereload-plugin')
+const WebpackPwaManifest = require('webpack-pwa-manifest')
 
 module.exports = {
   entry: './src/index.js',
   mode: process.env.NODE_ENV || 'development',
+  devServer: {
+    contentBase: Path.join(__dirname, 'dist')
+  },
   plugins: [
-    new HtmlWebpackPlugin(),
+    new HtmlWebpackPlugin({
+      meta: {viewport: 'width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no'}
+    }),
+    new WebpackPwaManifest({
+      name: 'CHANGEME',
+      short_name: 'changeme',
+      description: 'This is an installable app.',
+      background_color: '#ffffff',
+      icons: [
+        {
+          src: Path.resolve('src/assets/placeholder_icon.png'),
+          sizes: [96, 128, 192, 256, 384, 512]
+        }
+      ],
+      inject: true,
+      orientation: 'omit'
+    }),
     new LiveReloadPlugin({
       appendScriptTag: true
     })