From cba59e66c7ea0180446d3459305798c53a4c26d5 Mon Sep 17 00:00:00 2001
From: Pablo Ferreiro <pferreiromero@gmail.com>
Date: Fri, 4 Nov 2022 17:10:51 +0100
Subject: [PATCH] WIP PWA support

---
 app.json                               |  4 ++++
 app/Controllers/SettingsController.php |  9 +++++++++
 app/Models/RSSTemplate.php             |  3 ---
 app/Models/SettingsTemplate.php        |  6 ++++--
 components/head.latte                  |  7 ++++++-
 components/settings/misc.latte         | 18 ++++++++++++++++++
 components/sw.latte                    |  3 +++
 routes.php                             |  1 +
 scripts/setup_sw.js                    |  9 +++++++++
 sw.js                                  | 17 +++++++++++++++++
 views/settings.latte                   | 17 +++++++++++++----
 11 files changed, 84 insertions(+), 10 deletions(-)
 create mode 100644 components/settings/misc.latte
 create mode 100644 components/sw.latte
 create mode 100644 scripts/setup_sw.js
 create mode 100644 sw.js

diff --git a/app.json b/app.json
index 5e9b46f..a18c15e 100644
--- a/app.json
+++ b/app.json
@@ -20,6 +20,10 @@
             "description": "Latte cache path",
             "value": "/tmp/latte"
         },
+        "API_SIGNER": {
+            "description": "Signer method",
+            "value": "remote"
+        },
         "API_SIGNER_URL": {
             "description": "Remote signer url",
             "value": "https://signtok.vercel.app/api"
diff --git a/app/Controllers/SettingsController.php b/app/Controllers/SettingsController.php
index 58262f0..68707d9 100644
--- a/app/Controllers/SettingsController.php
+++ b/app/Controllers/SettingsController.php
@@ -19,6 +19,7 @@ class SettingsController {
         }
         self::redirect();
     }
+
     static public function api() {
         // TODO, ADD COUNT
         if (isset($_POST['api-test_endpoints'])) {
@@ -33,6 +34,14 @@ class SettingsController {
         self::redirect();
     }
 
+    static public function misc() {
+        if (isset($_POST['misc-sw'])) {
+            $sw = $_POST['misc-sw'];
+            Cookies::set("misc-sw", $sw);
+        }
+        self::redirect();
+    }
+
     static private function redirect() {
         $url = Misc::url('/settings');
         header("Location: {$url}");
diff --git a/app/Models/RSSTemplate.php b/app/Models/RSSTemplate.php
index 0ac6138..ef1b72e 100644
--- a/app/Models/RSSTemplate.php
+++ b/app/Models/RSSTemplate.php
@@ -1,9 +1,6 @@
 <?php
 namespace App\Models;
 
-/**
-* Base for templates with a feed
-*/
 class RSSTemplate {
     public string $title;
     public string $desc;
diff --git a/app/Models/SettingsTemplate.php b/app/Models/SettingsTemplate.php
index e83f665..ad6802d 100644
--- a/app/Models/SettingsTemplate.php
+++ b/app/Models/SettingsTemplate.php
@@ -6,14 +6,15 @@ use App\Helpers\Cookies;
 use TikScraper\Constants\DownloadMethods;
 
 /**
-* Base for templates with a feed
-*/
+ * Settings model with all possible config items
+ */
 class SettingsTemplate extends BaseTemplate {
     public array $downloaders = [];
     public array $themes = [];
     public bool $isTestEndpoints = false;
     public string $currentDownloader;
     public string $currentTheme;
+    public bool $isServiceWorker = false;
 
     function __construct() {
         parent::__construct("Settings");
@@ -27,5 +28,6 @@ class SettingsTemplate extends BaseTemplate {
         $this->isTestEndpoints = Cookies::check('api-test_endpoints', 'yes');
         $this->currentDownloader = Cookies::downloader();
         $this->currentTheme = Cookies::theme();
+        $this->isServiceWorker = Cookies::check('misc-sw', 'yes');
     }
 }
diff --git a/components/head.latte b/components/head.latte
index c435dde..cce56a1 100644
--- a/components/head.latte
+++ b/components/head.latte
@@ -6,7 +6,8 @@
 	<link rel="icon" type="image/png" sizes="32x32" href="{path('/favicon-32x32.png')}">
 	<link rel="icon" type="image/png" sizes="16x16" href="{path('/favicon-16x16.png')}">
 	<link rel="manifest" href="{path('/site.webmanifest')}">
-	<meta property="og:title" content="ProxiTok" />
+	<meta property="og:site_name" content="ProxiTok" />
+	<meta property="og:title" content="{$title}" />
 	<meta property="og:description" content="Alternative frontend for TikTok" />
 	<meta property="og:type" content="website" />
 	{if isset($has_rss)}
@@ -15,4 +16,8 @@
 	<link rel="stylesheet" href="{path('/styles/vendor/cssgg.min.css')}">
 	<link rel="stylesheet" href="{path('/styles/vendor/bulma.min.css')}">
 	<title>{$title} - ProxiTok</title>
+	{*/ Handles optional Service Worker /*}
+	{if \App\Helpers\Cookies::check('misc-sw', 'yes')}
+	<script src="{path('/scripts/setup_sw.js')}"></script>
+	{/if}
 </head>
diff --git a/components/settings/misc.latte b/components/settings/misc.latte
new file mode 100644
index 0000000..4ba494e
--- /dev/null
+++ b/components/settings/misc.latte
@@ -0,0 +1,18 @@
+{embed '../form.latte', path: '/settings/misc', method: 'POST', submit: true}
+{block fields}
+	<div class="field">
+		<label class="label">Enable service worker</label>
+		<div class="control">
+			<label class="radio">
+    		<input type="radio" name="misc-sw" value="yes" n:attr="checked => $isServiceWorker" />
+				<span>Yes</span>
+			</label>
+			<label class="radio">
+    		<input type="radio" name="misc-sw" value="no" n:attr="checked => !$isServiceWorker" />
+				<span>No</span>
+			</label>
+		</div>
+		<p class="help">This can be used to install the PWA version of ProxiTok</p>
+  </div>
+{/block}
+{/embed}
diff --git a/components/sw.latte b/components/sw.latte
new file mode 100644
index 0000000..43eaa3a
--- /dev/null
+++ b/components/sw.latte
@@ -0,0 +1,3 @@
+{if \App\Helpers\Cookies::check('misc-sw', 'yes')}
+<script src="{path('/scripts/setup_sw.js')}"></script>
+{/if}
diff --git a/routes.php b/routes.php
index 509739b..9605eaa 100644
--- a/routes.php
+++ b/routes.php
@@ -57,6 +57,7 @@ $router->mount('/settings', function () use ($router) {
     $router->get('/', 'SettingsController@index');
     $router->post('/general', 'SettingsController@general');
     $router->post('/api', 'SettingsController@api');
+    $router->post('/misc', 'SettingsController@misc');
 });
 
 $router->get('/discover', 'DiscoverController@get');
diff --git a/scripts/setup_sw.js b/scripts/setup_sw.js
new file mode 100644
index 0000000..1185d62
--- /dev/null
+++ b/scripts/setup_sw.js
@@ -0,0 +1,9 @@
+window.addEventListener("load", () => {
+  if (navigator.serviceWorker) {
+    navigator.serviceWorker.register('/sw.js').then(function (reg) {
+      console.log('Service worker registration was successful, scope: ', reg.scope);
+    }).catch(function (error) {
+      console.log('Service worker failed:', error);
+    });
+  }
+})
diff --git a/sw.js b/sw.js
new file mode 100644
index 0000000..89bc334
--- /dev/null
+++ b/sw.js
@@ -0,0 +1,17 @@
+const PWA_PRELOAD = {
+  pages: ['/', '/about', '/settings'],
+  scripts: ['/scripts/navbar.js', '/scripts/themes/card.js'],
+  styles: ['/styles/bulma.min.css', '/styles/cssgg.min.css', '/styles/themes/card.css']
+}
+
+self.addEventListener("install", function(e) {
+	e.waitUntil(
+		caches.open("pwa").then(function(cache) {
+			return cache.addAll([
+        ...PWA_PRELOAD.pages,
+        ...PWA_PRELOAD.scripts,
+        ...PWA_PRELOAD.styles
+			]);
+		})
+	);
+});
diff --git a/views/settings.latte b/views/settings.latte
index c920e8b..b6e1c01 100644
--- a/views/settings.latte
+++ b/views/settings.latte
@@ -5,9 +5,18 @@
 {/block}
 
 {block content}
-	<p class="title">General</p>
-	{include '../components/settings/general.latte'}
+	<div class="content">
+		<p class="title">General</p>
+		{include '../components/settings/general.latte'}
+	</div>
 	<hr />
-	<p class="title">Api</p>
-	{include '../components/settings/api.latte'}
+	<div class="content">
+		<p class="title">Api</p>
+		{include '../components/settings/api.latte'}
+	</div>
+	<hr />
+	<div class="content">
+		<p class="title">Misc</p>
+		{include '../components/settings/misc.latte'}
+	</div>
 {/block}