From 508d6ec926ebc05ef233d0de6f15b87cebdab462 Mon Sep 17 00:00:00 2001
From: versx <versx@ver.sx>
Date: Sat, 19 Sep 2020 14:52:04 -0700
Subject: [PATCH 1/4] Add bootswatch theme api support

---
 src/views/header.mustache |  2 +-
 src/views/index.mustache  | 28 ++++++++++++++++++++++++++++
 src/views/navbar.mustache |  5 +++++
 3 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/src/views/header.mustache b/src/views/header.mustache
index 555932fd..092efec8 100644
--- a/src/views/header.mustache
+++ b/src/views/header.mustache
@@ -12,7 +12,7 @@
     <meta name="msapplication-TileColor" content="#00aba9">
     <meta name="theme-color" content="#344440">
 
-    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha256-eSi1q2PG6J7g7ib17yAaWMcrr5GrtohYChqibrV7PBE=" crossorigin="anonymous" />
+    <link rel="stylesheet" type="text/css" class="theme-css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" /><!-- integrity="sha256-eSi1q2PG6J7g7ib17yAaWMcrr5GrtohYChqibrV7PBE=" crossorigin="anonymous" />-->
     <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.4/leaflet.css" integrity="sha256-YR4HrDE479EpYZgeTkQfgVJq08+277UXxMLbi/YP69o=" crossorigin="anonymous" />
     <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.18/r-2.2.2/rg-1.1.0/sc-1.5.0/datatables.min.css" />
     <link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.css" />
diff --git a/src/views/index.mustache b/src/views/index.mustache
index 41cf0020..5b4db0ba 100644
--- a/src/views/index.mustache
+++ b/src/views/index.mustache
@@ -791,3 +791,31 @@
     </div>
 
 {{> footer}}
+
+<script type="text/javascript">
+    $.getJSON('https://bootswatch.com/api/4.json', function (data) {
+        var themes = data.themes;
+        var select = $('#theme-selector');
+        select.show();
+        themes.forEach(function(value, index){
+            select.append($('<option />'')
+                .val(index)
+                .text(value.name));
+        });
+        select.change(function(){
+            const value = $(this).val();
+            let css;
+            if (value.includes('http')) {
+                css = value;
+            } else {
+                const theme = themes[value];
+                css = theme.css;
+            }
+            //$("link").attr("href", theme.css);
+            $('.theme-css').attr('href', css);
+        }).change();
+
+    }, 'json').fail(function(){
+        console.error('Failed to get themes from api!');
+    });
+</script>
\ No newline at end of file
diff --git a/src/views/navbar.mustache b/src/views/navbar.mustache
index c3042aea..73b46c3d 100644
--- a/src/views/navbar.mustache
+++ b/src/views/navbar.mustache
@@ -38,6 +38,11 @@
                 <a class="nav-link" href="{{url}}" target="_blank"><i class="{{icon}}"></i>&nbsp;{{{name}}}</a>
             </li>
         {{/buttons_right}}
+            <li class="nav-item">
+                <select id="theme-selector" class="form-control">
+                    <option value="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css">Default</option>
+                </select>
+            </li>
         {{#username}}
             <li class="nav-item dropdown">
                 <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

From ac64f571220410ba20518ea7bdfaf937845b4f72 Mon Sep 17 00:00:00 2001
From: versx <versx@ver.sx>
Date: Sat, 19 Sep 2020 14:57:43 -0700
Subject: [PATCH 2/4] Fix typo

---
 src/views/index.mustache | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/index.mustache b/src/views/index.mustache
index 5b4db0ba..29015c6c 100644
--- a/src/views/index.mustache
+++ b/src/views/index.mustache
@@ -798,7 +798,7 @@
         var select = $('#theme-selector');
         select.show();
         themes.forEach(function(value, index){
-            select.append($('<option />'')
+            select.append($('<option />')
                 .val(index)
                 .text(value.name));
         });

From a9c9e2f648b8f4c3db4306c3fa1745cc80b9159b Mon Sep 17 00:00:00 2001
From: versx <versx@ver.sx>
Date: Sat, 19 Sep 2020 17:56:14 -0700
Subject: [PATCH 3/4] Save and load previously selected theme

---
 src/views/index.mustache | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/views/index.mustache b/src/views/index.mustache
index 29015c6c..0dcc2ab4 100644
--- a/src/views/index.mustache
+++ b/src/views/index.mustache
@@ -802,7 +802,11 @@
                 .val(index)
                 .text(value.name));
         });
-        select.change(function(){
+        const existingValue = localStorage.getItem('theme');
+        if (existingValue !== null) {
+            select.val(existingValue);
+        }
+        select.change(function() {
             const value = $(this).val();
             let css;
             if (value.includes('http')) {
@@ -811,6 +815,7 @@
                 const theme = themes[value];
                 css = theme.css;
             }
+            localStorage.setItem('theme', value);
             //$("link").attr("href", theme.css);
             $('.theme-css').attr('href', css);
         }).change();

From 2b72da912a08e7c473ba61153cfd18433e75be88 Mon Sep 17 00:00:00 2001
From: versx <versx@ver.sx>
Date: Sun, 20 Sep 2020 19:17:06 -0700
Subject: [PATCH 4/4] Use smaller theme selector

---
 src/views/index.mustache  | 9 +++++----
 src/views/navbar.mustache | 4 ++--
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/views/index.mustache b/src/views/index.mustache
index 0dcc2ab4..4ca0c0a4 100644
--- a/src/views/index.mustache
+++ b/src/views/index.mustache
@@ -793,9 +793,10 @@
 {{> footer}}
 
 <script type="text/javascript">
-    $.getJSON('https://bootswatch.com/api/4.json', function (data) {
-        var themes = data.themes;
-        var select = $('#theme-selector');
+    const apiEndpoint = 'https://bootswatch.com/api/4.json';
+    $.getJSON(apiEndpoint, function(data) {
+        const themes = data.themes;
+        const select = $('#theme-selector');
         select.show();
         themes.forEach(function(value, index){
             select.append($('<option />')
@@ -820,7 +821,7 @@
             $('.theme-css').attr('href', css);
         }).change();
 
-    }, 'json').fail(function(){
+    }, 'json').fail(function() {
         console.error('Failed to get themes from api!');
     });
 </script>
\ No newline at end of file
diff --git a/src/views/navbar.mustache b/src/views/navbar.mustache
index 73b46c3d..df64dae2 100644
--- a/src/views/navbar.mustache
+++ b/src/views/navbar.mustache
@@ -38,8 +38,8 @@
                 <a class="nav-link" href="{{url}}" target="_blank"><i class="{{icon}}"></i>&nbsp;{{{name}}}</a>
             </li>
         {{/buttons_right}}
-            <li class="nav-item">
-                <select id="theme-selector" class="form-control">
+            <li class="nav-item nav-link">
+                <select id="theme-selector" class="form-control form-control-sm">
                     <option value="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css">Default</option>
                 </select>
             </li>