Add PWA support

2024-06-22 16:52:17 -04:00 · 2024-06-22 16:52:17 -04:00 · 528e2b3dc0
parent 3128919705
commit 528e2b3dc0
3 changed files with 138 additions and 0 deletions
--- a/src/public/manifest.json
+++ b/src/public/manifest.json
@ -0,0 +1,37 @@
+{
+    "name": "Poke",
+    "short_name": "Poke",
+    "description": "The Ultimate Privacy App!",
+    "start_url": "/",
+    "display": "standalone",
+    "display_override": [
+      "window-controls-overlay"
+    ],
+    "background_color": "#080808",
+    "theme_color": "#612153",
+    "categories": [
+      "entertainment",
+      "music"
+    ],
+    "icons": [
+      {
+        "src": "/css/pt.png",
+        "sizes": "512x512",
+        "type": "image/png"
+      }
+    ],
+    "screenshots": [
+      {
+        "src": "/css/pwa-desktop.png",
+        "type": "image/png",
+        "sizes": "1695x1445",
+        "form_factor": "wide"
+      },
+      {
+        "src": "/css/pwa-mobile.jpg",
+        "type": "image/jpg",
+        "sizes": "1080x2412",
+        "form_factor": "narrow"
+      }
+    ]
+}
--- a/src/public/offline.html
+++ b/src/public/offline.html
@ -0,0 +1,63 @@
+<!--
+  This Source Code Form is subject to the terms of the GNU General Public License:
+
+  Copyright (C) 2021-2023 POKETUBE (https://codeberg.org/Ashley/poketube)
+
+  This program is free software: you can redistribute it and/or modify
+  it under the terms of the GNU General Public License as published by
+  the Free Software Foundation, either version 3 of the License, or
+  (at your option) any later version.
+
+  This program is distributed in the hope that it will be useful,
+  but WITHOUT ANY WARRANTY; without even the implied warranty of
+  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  GNU General Public License for more details.
+
+  You should have received a copy of the GNU General Public License
+  along with this program. If not, see https://www.gnu.org/licenses/.
+-->
+<!DOCTYPE html>
+<html><head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+    <title>Poke - No interenet!1!1!1!111!</title>
+    </head>
+    <body>
+        <div id="error-page">
+            <div id="error-page-content" align="center">
+                <h1 style="color:#fff;font-family:'PokeTube Flex',sans-serif;font-weight:900;white-space:yes;font-style: italic;font-size: 45px;" align="center">Oh nyo &gt;~&lt;</h1>
+                  <h3 style="font-family: sans-serif;">Connectivity to the server has been lost qwq <br> Seems like you're offline - u check your internet connection and try again</h3><br>
+                  <p>or u can just view poke!'s <a href="https://status.poketube.fun">status page</a> yk~ </p>
+
+            </div>
+
+        </div>
+
+<style>
+    .downnav {
+  position: fixed;
+  padding:10px;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  margin: auto;
+  overflow: hidden;
+  z-index: 1;
+  color:#fff;
+  background-color: #0f0f0f;
+}
+
+    body{
+        background:#111;
+        margin: auto;
+        transform: translateY(13em)
+    }
+    p,a,h3{
+        text-align:center;
+        font-family: sans-serif;
+        color:#fff;
+    }
+    nav,error-page,div{
+        justify-content: center;
+        background: #111
+    }
+</style></body></html>
--- a/src/public/service-worker.js
+++ b/src/public/service-worker.js
@ -0,0 +1,38 @@
+// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-3.0-or-later  
+
+'use strict';
+
+var cacheVersion = 1;
+var currentCache = {
+  offline: 'offline-cache' + cacheVersion
+};
+const offlineUrl = 'offline';
+
+this.addEventListener('install', event => {
+  event.waitUntil(
+    caches.open(currentCache.offline).then(function (cache) {
+      return cache.addAll([
+        offlineUrl
+      ]);
+    })
+  );
+});
+
+this.addEventListener('fetch', event => {
+  if (event.request.mode === 'navigate' || (event.request.method === 'GET' && event.request.headers.get('accept').includes('text/html'))) {
+    event.respondWith(
+      fetch(event.request.url).catch(error => {
+        return caches.match(offlineUrl);
+      })
+    );
+  }
+  else {
+    event.respondWith(caches.match(event.request)
+      .then(function (response) {
+        return response || fetch(event.request);
+      })
+    );
+  }
+});
+
+// @license-end