spanish-quizzer

commit 8e85c5f918dabf04d64d3b8d3bcf81ba168b14e1
parent f991968a72b791466761be4f650b655e59d14831
Author: AsherMorgan <59518073+AsherMorgan@users.noreply.github.com>
Date:   Thu,  4 Mar 2021 10:42:45 -0800

Add manifest and service worker

Diffstat:
M
index.html
 | 
9
+++++++++
A
manifest.json
 | 
41
+++++++++++++++++++++++++++++++++++++++++
A
service-worker.js
 | 
91
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

3 files changed, 141 insertions(+), 0 deletions(-)
diff --git a/index.html b/index.html
@@ -5,6 +5,8 @@
         <title>Spanish-Quizzer</title>
         <meta name="description" content="Quiz yourself on Spanish vocabulary and conjugations through a free and highly customizable web interface.">
         <meta name="viewport" content="width=device-width">
+        <meta name="theme-color" content="#009bc2">
+        <link rel="manifest" href="manifest.json">
         <link rel="icon" type="image/png" href="images/favicon-32.png">
         <link rel="apple-touch-icon" sizes="180x180" href="images/favicon-180.png">
         <link rel="stylesheet" href="css/global.css">
@@ -37,5 +39,12 @@
                 <router-view @back="Back"></router-view>
             </keep-alive>
         </div>
+
+        <script>
+            // Register service worker
+            if ("serviceWorker" in navigator) {
+                navigator.serviceWorker.register("./service-worker.js");
+            }
+        </script>
     </body>
 </html>
diff --git a/manifest.json b/manifest.json
@@ -0,0 +1,41 @@
+{
+    "background_color": "#009bc2",
+    "categories": ["education"],
+    "description": "Quizzes you on Spanish vocabulary and verb conjugations",
+    "display": "fullscreen",
+    "icons": [
+        {
+        "src": "images/favicon-32.png",
+        "sizes": "32x32"
+        },
+        {
+        "src": "images/favicon-180.png",
+        "sizes": "180x180"
+        },
+        {
+        "src": "images/favicon-192.png",
+        "sizes": "192x192"
+        },
+        {
+        "src": "images/favicon-192-maskable.png",
+        "sizes": "192x192",
+        "purpose": "maskable"
+        },
+        {
+        "src": "images/favicon-512.png",
+        "sizes": "512x512"
+        },
+        {
+        "src": "images/favicon-512-maskable.png",
+        "sizes": "512x512",
+        "purpose": "maskable"
+        }
+    ],
+    "lang": "en-US",
+    "name": "Spanish-Quizzer",
+    "orientation": "portrait",
+    "scope": "./",
+    "short_name": "Spanish-Quizzer",
+    "start_url": "./index.html",
+    "theme_color": "#009bc2"
+}
diff --git a/service-worker.js b/service-worker.js
@@ -0,0 +1,91 @@
+// Initialize constants
+const version = "spanish-quizzer-1";
+const resources = [
+    "https://cdn.jsdelivr.net/npm/vue@2.6.12",
+    "https://cdn.jsdelivr.net/npm/vue-router@3.5.1",
+    "https://unpkg.com/papaparse@5.1.1/papaparse.min.js",
+    "./css/app.css",
+    "./css/filtersPage.css",
+    "./css/global.css",
+    "./css/quizzer.css",
+    "./css/reference.css",
+    "./data/verbs.csv",
+    "./data/vocab.csv",
+    "./images/arrow-left.svg",
+    "./images/favicon-32.png",
+    "./images/favicon-180.png",
+    "./images/favicon-192-maskable.png",
+    "./images/favicon-192.png",
+    "./images/favicon-512-maskable.png",
+    "./images/favicon-512.png",
+    "./images/plus.svg",
+    "./images/trash.svg",
+    "./images/x.svg",
+    "./js/app.js",
+    "./js/filters.js",
+    "./js/filtersPage.js",
+    "./js/global.js",
+    "./js/quizzer.js",
+    "./js/reference.js",
+    "./index.html",
+    "./",
+];
+
+
+
+self.addEventListener("install", function(event) {
+    event.waitUntil(async function() {
+        // Cache resources
+        const cache = await caches.open(version);
+        await cache.addAll(resources);
+    }());
+});
+
+
+
+self.addEventListener("fetch", function(event) {
+    // Ignore non-GET requests
+    if (event.request.method !== "GET") return;
+
+    event.respondWith(async function() {
+        // Look for cached response
+        const cache = await caches.open(version);
+        const cachedResponse = await cache.match(event.request);
+
+        if (cachedResponse) {
+            // Update cache in the background
+            event.waitUntil(cache.add(event.request));
+
+            // Returned cached response
+            return cachedResponse;
+        }
+        else {
+            // Fall back to network
+            const response = await fetch(event.request);
+
+            // Add response to cache
+            cache.put(event.request, response.clone());
+
+            // Return response
+            return response;
+        }
+    }());
+});
+
+
+
+self.addEventListener("activate", function(event) {
+    event.waitUntil(
+        // Remove outdated caches
+        caches.keys().then(function (keys) {
+            return Promise.all(
+                keys.filter(function (key) {
+                    return key != version;
+                })
+                .map(function (key) {
+                    return caches.delete(key);
+                })
+            );
+        })
+    );
+});