diff --git a/package-lock.json b/package-lock.json
index cc3d88c..45425d5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
-  "name": "audio-test",
-  "version": "0.1.0",
+  "name": "noiser",
+  "version": "1.0.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1643,6 +1643,45 @@
         "yorkie": "^2.0.0"
       }
     },
+    "@vue/cli-plugin-pwa": {
+      "version": "4.5.8",
+      "resolved": "https://registry.npmjs.org/@vue/cli-plugin-pwa/-/cli-plugin-pwa-4.5.8.tgz",
+      "integrity": "sha512-B5rFJhwhGLHcPUrAUx185X6jlTUJHgN6FTnU+qKspEoONCtGy09/zIL9ejELRw9jxv5C6x2WKUAkyHhh89RkWw==",
+      "dev": true,
+      "requires": {
+        "@vue/cli-shared-utils": "^4.5.8",
+        "webpack": "^4.0.0",
+        "workbox-webpack-plugin": "^4.3.1"
+      },
+      "dependencies": {
+        "@vue/cli-shared-utils": {
+          "version": "4.5.8",
+          "resolved": "https://registry.npmjs.org/@vue/cli-shared-utils/-/cli-shared-utils-4.5.8.tgz",
+          "integrity": "sha512-pa6oenhBO/5HeDLRSokiwVN01gROACEDy3ESXWuPmragOREGNmmFKtkPHlqeYavGEX6LFp7f0VK3uMX6UYS5mQ==",
+          "dev": true,
+          "requires": {
+            "@hapi/joi": "^15.0.1",
+            "chalk": "^2.4.2",
+            "execa": "^1.0.0",
+            "launch-editor": "^2.2.1",
+            "lru-cache": "^5.1.1",
+            "node-ipc": "^9.1.1",
+            "open": "^6.3.0",
+            "ora": "^3.4.0",
+            "read-pkg": "^5.1.1",
+            "request": "^2.88.2",
+            "semver": "^6.1.0",
+            "strip-ansi": "^6.0.0"
+          }
+        },
+        "semver": {
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+          "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+          "dev": true
+        }
+      }
+    },
     "@vue/cli-plugin-router": {
       "version": "4.5.7",
       "resolved": "https://registry.npmjs.org/@vue/cli-plugin-router/-/cli-plugin-router-4.5.7.tgz",
@@ -2481,6 +2520,15 @@
         "resolve": "^1.12.0"
       }
     },
+    "babel-extract-comments": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/babel-extract-comments/-/babel-extract-comments-1.0.0.tgz",
+      "integrity": "sha512-qWWzi4TlddohA91bFwgt6zO/J0X+io7Qp184Fw0m2JYRSTZnJbFR8+07KmzudHCZgOiKRCrjhylwv9Xd8gfhVQ==",
+      "dev": true,
+      "requires": {
+        "babylon": "^6.18.0"
+      }
+    },
     "babel-loader": {
       "version": "8.1.0",
       "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-8.1.0.tgz",
@@ -2503,6 +2551,52 @@
         "object.assign": "^4.1.0"
       }
     },
+    "babel-plugin-syntax-object-rest-spread": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+      "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=",
+      "dev": true
+    },
+    "babel-plugin-transform-object-rest-spread": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.26.0.tgz",
+      "integrity": "sha1-DzZpLVD+9rfi1LOsFHgTepY7ewY=",
+      "dev": true,
+      "requires": {
+        "babel-plugin-syntax-object-rest-spread": "^6.8.0",
+        "babel-runtime": "^6.26.0"
+      }
+    },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+      "dev": true,
+      "requires": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "2.6.11",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
+          "integrity": "sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg==",
+          "dev": true
+        },
+        "regenerator-runtime": {
+          "version": "0.11.1",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
+          "dev": true
+        }
+      }
+    },
+    "babylon": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
+      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==",
+      "dev": true
+    },
     "balanced-match": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
@@ -3464,6 +3558,12 @@
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true
     },
+    "common-tags": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.8.0.tgz",
+      "integrity": "sha512-6P6g0uetGpW/sdyUy/iQQCbFF0kWVMSIVSyYz7Zgjcgh8mgw8PQzDNZeyZ5DQ2gM7LBoZPHmnjz8rUthkBG5tw==",
+      "dev": true
+    },
     "commondir": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
@@ -5571,6 +5671,12 @@
       "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
       "dev": true
     },
+    "get-own-enumerable-property-symbols": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz",
+      "integrity": "sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g==",
+      "dev": true
+    },
     "get-stream": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
@@ -6585,6 +6691,12 @@
         "has-symbols": "^1.0.1"
       }
     },
+    "is-regexp": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz",
+      "integrity": "sha1-/S2INUXEa6xaYz57mgnof6LLUGk=",
+      "dev": true
+    },
     "is-resolvable": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
@@ -6757,6 +6869,15 @@
       "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
       "dev": true
     },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "dev": true,
+      "requires": {
+        "jsonify": "~0.0.0"
+      }
+    },
     "json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
@@ -6793,6 +6914,12 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
+      "dev": true
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -6962,6 +7089,12 @@
       "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==",
       "dev": true
     },
+    "lodash._reinterpolate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
+      "dev": true
+    },
     "lodash.defaultsdeep": {
       "version": "4.6.1",
       "resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz",
@@ -6986,6 +7119,25 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
+    "lodash.template": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-4.5.0.tgz",
+      "integrity": "sha512-84vYFxIkmidUiFxidA/KjjH9pAycqW+h980j7Fuz5qxRtO9pgB7MDFTdys1N7A5mcucRiDyEq4fusljItR1T/A==",
+      "dev": true,
+      "requires": {
+        "lodash._reinterpolate": "^3.0.0",
+        "lodash.templatesettings": "^4.0.0"
+      }
+    },
+    "lodash.templatesettings": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-4.2.0.tgz",
+      "integrity": "sha512-stgLz+i3Aa9mZgnjr/O+v9ruKZsPsndy7qPZOchbqk2cnTU1ZaldKK+v7m54WoKIyxiuMZTKT2H81F8BeAc3ZQ==",
+      "dev": true,
+      "requires": {
+        "lodash._reinterpolate": "^3.0.0"
+      }
+    },
     "lodash.transform": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.transform/-/lodash.transform-4.6.0.tgz",
@@ -8779,6 +8931,12 @@
       "dev": true,
       "optional": true
     },
+    "pretty-bytes": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.4.1.tgz",
+      "integrity": "sha512-s1Iam6Gwz3JI5Hweaz4GoCD1WUNUIyzePFy5+Js2hjwGVt2Z79wNN+ZKOZ2vB6C+Xs6njyB84Z1IthQg8d9LxA==",
+      "dev": true
+    },
     "pretty-error": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.1.tgz",
@@ -9107,6 +9265,11 @@
         "unicode-match-property-value-ecmascript": "^1.2.0"
       }
     },
+    "register-service-worker": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/register-service-worker/-/register-service-worker-1.7.1.tgz",
+      "integrity": "sha512-IdTfUZ4u8iJL8o1w8es8l6UMGPmkwHolUdT+UmM1UypC80IB4KbpuIlvwWVj8UDS7eJwkEYRcKRgfRX+oTmJsw=="
+    },
     "regjsgen": {
       "version": "0.5.2",
       "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.5.2.tgz",
@@ -10177,6 +10340,25 @@
         "safe-buffer": "~5.1.0"
       }
     },
+    "stringify-object": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.3.0.tgz",
+      "integrity": "sha512-rHqiFh1elqCQ9WPLIC8I0Q/g/wj5J1eMkyoiD6eoQApWHP0FtlK7rqnhmabL5VUY9JQCcqwwvlOaSuutekgyrw==",
+      "dev": true,
+      "requires": {
+        "get-own-enumerable-property-symbols": "^3.0.0",
+        "is-obj": "^1.0.1",
+        "is-regexp": "^1.0.0"
+      },
+      "dependencies": {
+        "is-obj": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+          "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8=",
+          "dev": true
+        }
+      }
+    },
     "strip-ansi": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
@@ -10194,6 +10376,16 @@
         }
       }
     },
+    "strip-comments": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/strip-comments/-/strip-comments-1.0.2.tgz",
+      "integrity": "sha512-kL97alc47hoyIQSV165tTt9rG5dn4w1dNnBhOQ3bOU1Nc1hel09jnXANaHJ7vzHLd4Ju8kseDGzlev96pghLFw==",
+      "dev": true,
+      "requires": {
+        "babel-extract-comments": "^1.0.0",
+        "babel-plugin-transform-object-rest-spread": "^6.26.0"
+      }
+    },
     "strip-eof": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
@@ -11765,6 +11957,199 @@
       "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==",
       "dev": true
     },
+    "workbox-background-sync": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-background-sync/-/workbox-background-sync-4.3.1.tgz",
+      "integrity": "sha512-1uFkvU8JXi7L7fCHVBEEnc3asPpiAL33kO495UMcD5+arew9IbKW2rV5lpzhoWcm/qhGB89YfO4PmB/0hQwPRg==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-broadcast-update": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-broadcast-update/-/workbox-broadcast-update-4.3.1.tgz",
+      "integrity": "sha512-MTSfgzIljpKLTBPROo4IpKjESD86pPFlZwlvVG32Kb70hW+aob4Jxpblud8EhNb1/L5m43DUM4q7C+W6eQMMbA==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-build": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-build/-/workbox-build-4.3.1.tgz",
+      "integrity": "sha512-UHdwrN3FrDvicM3AqJS/J07X0KXj67R8Cg0waq1MKEOqzo89ap6zh6LmaLnRAjpB+bDIz+7OlPye9iii9KBnxw==",
+      "dev": true,
+      "requires": {
+        "@babel/runtime": "^7.3.4",
+        "@hapi/joi": "^15.0.0",
+        "common-tags": "^1.8.0",
+        "fs-extra": "^4.0.2",
+        "glob": "^7.1.3",
+        "lodash.template": "^4.4.0",
+        "pretty-bytes": "^5.1.0",
+        "stringify-object": "^3.3.0",
+        "strip-comments": "^1.0.2",
+        "workbox-background-sync": "^4.3.1",
+        "workbox-broadcast-update": "^4.3.1",
+        "workbox-cacheable-response": "^4.3.1",
+        "workbox-core": "^4.3.1",
+        "workbox-expiration": "^4.3.1",
+        "workbox-google-analytics": "^4.3.1",
+        "workbox-navigation-preload": "^4.3.1",
+        "workbox-precaching": "^4.3.1",
+        "workbox-range-requests": "^4.3.1",
+        "workbox-routing": "^4.3.1",
+        "workbox-strategies": "^4.3.1",
+        "workbox-streams": "^4.3.1",
+        "workbox-sw": "^4.3.1",
+        "workbox-window": "^4.3.1"
+      },
+      "dependencies": {
+        "fs-extra": {
+          "version": "4.0.3",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.3.tgz",
+          "integrity": "sha512-q6rbdDd1o2mAnQreO7YADIxf/Whx4AHBiRf6d+/cVT8h44ss+lHgxf1FemcqDnQt9X3ct4McHr+JMGlYSsK7Cg==",
+          "dev": true,
+          "requires": {
+            "graceful-fs": "^4.1.2",
+            "jsonfile": "^4.0.0",
+            "universalify": "^0.1.0"
+          }
+        },
+        "workbox-window": {
+          "version": "4.3.1",
+          "resolved": "https://registry.npmjs.org/workbox-window/-/workbox-window-4.3.1.tgz",
+          "integrity": "sha512-C5gWKh6I58w3GeSc0wp2Ne+rqVw8qwcmZnQGpjiek8A2wpbxSJb1FdCoQVO+jDJs35bFgo/WETgl1fqgsxN0Hg==",
+          "dev": true,
+          "requires": {
+            "workbox-core": "^4.3.1"
+          }
+        }
+      }
+    },
+    "workbox-cacheable-response": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-cacheable-response/-/workbox-cacheable-response-4.3.1.tgz",
+      "integrity": "sha512-Rp5qlzm6z8IOvnQNkCdO9qrDgDpoPNguovs0H8C+wswLuPgSzSp9p2afb5maUt9R1uTIwOXrVQMmPfPypv+npw==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-core": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-core/-/workbox-core-4.3.1.tgz",
+      "integrity": "sha512-I3C9jlLmMKPxAC1t0ExCq+QoAMd0vAAHULEgRZ7kieCdUd919n53WC0AfvokHNwqRhGn+tIIj7vcb5duCjs2Kg==",
+      "dev": true
+    },
+    "workbox-expiration": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-expiration/-/workbox-expiration-4.3.1.tgz",
+      "integrity": "sha512-vsJLhgQsQouv9m0rpbXubT5jw0jMQdjpkum0uT+d9tTwhXcEZks7qLfQ9dGSaufTD2eimxbUOJfWLbNQpIDMPw==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-google-analytics": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-google-analytics/-/workbox-google-analytics-4.3.1.tgz",
+      "integrity": "sha512-xzCjAoKuOb55CBSwQrbyWBKqp35yg1vw9ohIlU2wTy06ZrYfJ8rKochb1MSGlnoBfXGWss3UPzxR5QL5guIFdg==",
+      "dev": true,
+      "requires": {
+        "workbox-background-sync": "^4.3.1",
+        "workbox-core": "^4.3.1",
+        "workbox-routing": "^4.3.1",
+        "workbox-strategies": "^4.3.1"
+      }
+    },
+    "workbox-navigation-preload": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-navigation-preload/-/workbox-navigation-preload-4.3.1.tgz",
+      "integrity": "sha512-K076n3oFHYp16/C+F8CwrRqD25GitA6Rkd6+qAmLmMv1QHPI2jfDwYqrytOfKfYq42bYtW8Pr21ejZX7GvALOw==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-precaching": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-precaching/-/workbox-precaching-4.3.1.tgz",
+      "integrity": "sha512-piSg/2csPoIi/vPpp48t1q5JLYjMkmg5gsXBQkh/QYapCdVwwmKlU9mHdmy52KsDGIjVaqEUMFvEzn2LRaigqQ==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-range-requests": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-range-requests/-/workbox-range-requests-4.3.1.tgz",
+      "integrity": "sha512-S+HhL9+iTFypJZ/yQSl/x2Bf5pWnbXdd3j57xnb0V60FW1LVn9LRZkPtneODklzYuFZv7qK6riZ5BNyc0R0jZA==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-routing": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-routing/-/workbox-routing-4.3.1.tgz",
+      "integrity": "sha512-FkbtrODA4Imsi0p7TW9u9MXuQ5P4pVs1sWHK4dJMMChVROsbEltuE79fBoIk/BCztvOJ7yUpErMKa4z3uQLX+g==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-strategies": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-strategies/-/workbox-strategies-4.3.1.tgz",
+      "integrity": "sha512-F/+E57BmVG8dX6dCCopBlkDvvhg/zj6VDs0PigYwSN23L8hseSRwljrceU2WzTvk/+BSYICsWmRq5qHS2UYzhw==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-streams": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-streams/-/workbox-streams-4.3.1.tgz",
+      "integrity": "sha512-4Kisis1f/y0ihf4l3u/+ndMkJkIT4/6UOacU3A4BwZSAC9pQ9vSvJpIi/WFGQRH/uPXvuVjF5c2RfIPQFSS2uA==",
+      "dev": true,
+      "requires": {
+        "workbox-core": "^4.3.1"
+      }
+    },
+    "workbox-sw": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-sw/-/workbox-sw-4.3.1.tgz",
+      "integrity": "sha512-0jXdusCL2uC5gM3yYFT6QMBzKfBr2XTk0g5TPAV4y8IZDyVNDyj1a8uSXy3/XrvkVTmQvLN4O5k3JawGReXr9w==",
+      "dev": true
+    },
+    "workbox-webpack-plugin": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/workbox-webpack-plugin/-/workbox-webpack-plugin-4.3.1.tgz",
+      "integrity": "sha512-gJ9jd8Mb8wHLbRz9ZvGN57IAmknOipD3W4XNE/Lk/4lqs5Htw4WOQgakQy/o/4CoXQlMCYldaqUg+EJ35l9MEQ==",
+      "dev": true,
+      "requires": {
+        "@babel/runtime": "^7.0.0",
+        "json-stable-stringify": "^1.0.1",
+        "workbox-build": "^4.3.1"
+      }
+    },
+    "workbox-window": {
+      "version": "5.1.4",
+      "resolved": "https://registry.npmjs.org/workbox-window/-/workbox-window-5.1.4.tgz",
+      "integrity": "sha512-vXQtgTeMCUq/4pBWMfQX8Ee7N2wVC4Q7XYFqLnfbXJ2hqew/cU1uMTD2KqGEgEpE4/30luxIxgE+LkIa8glBYw==",
+      "requires": {
+        "workbox-core": "^5.1.4"
+      },
+      "dependencies": {
+        "workbox-core": {
+          "version": "5.1.4",
+          "resolved": "https://registry.npmjs.org/workbox-core/-/workbox-core-5.1.4.tgz",
+          "integrity": "sha512-+4iRQan/1D8I81nR2L5vcbaaFskZC2CL17TLbvWVzQ4qiF/ytOGF6XeV54pVxAvKUtkLANhk8TyIUMtiMw2oDg=="
+        }
+      }
+    },
     "worker-farm": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.7.0.tgz",
diff --git a/package.json b/package.json
index 0cb51c1..4ccf3e6 100644
--- a/package.json
+++ b/package.json
@@ -9,11 +9,14 @@
   },
   "dependencies": {
     "core-js": "^3.6.5",
-    "vue": "^2.6.11"
+    "register-service-worker": "^1.7.1",
+    "vue": "^2.6.11",
+    "workbox-window": "^5.1.4"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
+    "@vue/cli-plugin-pwa": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "babel-eslint": "^10.1.0",
     "eslint": "^6.7.2",
diff --git a/public/192.png b/public/img/icons/android-chrome-192x192.png
similarity index 100%
rename from public/192.png
rename to public/img/icons/android-chrome-192x192.png
diff --git a/public/512.png b/public/img/icons/android-chrome-512x512.png
similarity index 100%
rename from public/512.png
rename to public/img/icons/android-chrome-512x512.png
diff --git a/public/manifest.json b/public/manifest.json
deleted file mode 100644
index dd56c05..0000000
--- a/public/manifest.json
+++ /dev/null
@@ -1,21 +0,0 @@
-{
-  "short_name": "Noiser",
-  "name": "Noiser",
-  "icons": [
-    {
-      "src": "/192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "/512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": "/",
-  "background_color": "#DE6262",
-  "display": "standalone",
-  "scope": "/",
-  "theme_color": "#DE6262"
-}
diff --git a/public/robots.txt b/public/robots.txt
index 12c4d54..eb05362 100644
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -1 +1,2 @@
-User-agent: * Disallow:
+User-agent: *
+Disallow:
diff --git a/src/App.vue b/src/App.vue
index b6c31db..0b03f99 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,18 @@
 <template>
   <div id="app-container">
     <the-header app-name="Noiser"/>
-    <section class="mainContentLayout magictime slideDownReturn">
 
+    <div class="update-dialog" v-if="showUpdateUI">
+      <div class="update-dialog__content">
+        A new version is available. Refresh now to activate?
+      </div>
+      <div class="update-dialog__actions">
+        <button class="button" @click="update">Update</button>
+        <button class="button" @click="showUpdateUI = false">Cancel</button>
+      </div>
+    </div>
+
+    <section class="mainContentLayout magictime slideDownReturn">
       <div>
         <h2 class="packName">{{audioSources.summerPack.name}}</h2>
         <div v-if="audioSources.summerPack.audioSources.length > 0" class="flexLayout">
@@ -63,7 +73,12 @@
         <h4 v-else class="packNoSounds">Sounds coming</h4>
       </div>
       <hr>
-      <h4 class="packNoSounds"><a style="color: white;" href="http://www.nitramite.com/noiser.html">Click here</a> for asset attribution notes</h4>
+      <h2 class="packName">Links</h2>
+      <h4 class="packNoSounds">Download <a style="color: white;"
+                                           href="https://play.google.com/store/apps/details?id=com.nitramite.noiser">Android
+        App</a> here</h4>
+      <h4 class="packNoSounds"><a style="color: white;" href="http://www.nitramite.com/noiser.html">Click here</a> for
+        asset attribution notes</h4>
       <hr>
 
     </section>
@@ -75,10 +90,8 @@
   import TheHeader from "./components/TheHeader.vue";
   import AudioElement from "./components/AudioElement.vue";
   import TheFooter from "./components/TheFooter.vue";
-
   import AudioPack from './assets/AudioPack';
 
-
   export default {
     name: 'App',
     components: {
@@ -88,12 +101,25 @@
     },
     data() {
       return {
-        audioSources: AudioPack.audioPacks
+        audioSources: AudioPack.audioPacks,
+        showUpdateUI: false,
       }
     },
     mounted() {
     },
-    methods: {},
+    methods: {
+      async update() {
+        this.showUpdateUI = false;
+        await this.$workbox.messageSW({type: "SKIP_WAITING"});
+      },
+    },
+    created() {
+      if (this.$workbox) {
+        this.$workbox.addEventListener("waiting", () => {
+          this.showUpdateUI = true;
+        });
+      }
+    },
   }
 </script>
 
@@ -153,4 +179,31 @@
     border-radius: 5px;
   }
 
+  .update-dialog {
+    text-align: center;
+    border-radius: 20px;
+    margin: 10px 20px 10px 20px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    color: white;
+    background-color: rgba(255, 255, 255, 0.15);
+    box-shadow: 0 4px 25px 0 rgba(255, 255, 255, 0.1);
+  }
+
+  .button {
+    min-width: 100px;
+    height: 40px;
+    background: #2d3436;
+    border-radius: 40px;
+    overflow: hidden;
+    cursor: pointer;
+    transition: .1s linear;
+    margin: 5px 5px 0 5px;
+    color: white;
+  }
+
+  .button:hover {
+    transform: scale(1.1);
+  }
+
 </style>
diff --git a/src/main.js b/src/main.js
index 0daf51a..c368ebb 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,5 +1,8 @@
 import Vue from 'vue'
 import App from './App.vue'
+import wb from "./registerServiceWorker";
+
+Vue.prototype.$workbox = wb;
 
 Vue.config.productionTip = false;
 
diff --git a/src/registerServiceWorker.js b/src/registerServiceWorker.js
new file mode 100644
index 0000000..db17be2
--- /dev/null
+++ b/src/registerServiceWorker.js
@@ -0,0 +1,13 @@
+import {Workbox} from "workbox-window";
+
+let wb;
+if ("serviceWorker" in navigator) {
+  wb = new Workbox(`${process.env.BASE_URL}service-worker.js`);
+  wb.addEventListener("controlling", () => {
+    window.location.reload();
+  });
+  wb.register();
+} else {
+  wb = null;
+}
+export default wb;
diff --git a/vue.config.js b/vue.config.js
index d079ca1..ef9bee3 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -7,5 +7,13 @@ module.exports = {
           args[0].title = 'Noiser - Free white noise generator';
           return args
         })
+  },
+  pwa: {
+    themeColor: "#DE6262",
+    msTileColor: "#DE6262",
+    appleMobileWebAppCache: "yes",
+    manifestOptions: {
+      background_color: "#DE6262"
+    }
   }
 };