From 7864e16ef382a50ce4658f30d0c892dc844fe3d8 Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon@deblan.fr>
Date: Sat, 9 May 2020 14:30:24 +0200
Subject: [PATCH] add option to force light icons

---
 lib/Controller/JsController.php   |  1 +
 lib/Settings/Admin.php            |  1 +
 src/SideMenu.vue                  | 20 +++++++++++++-------
 src/admin.js                      |  1 +
 templates/js/script.php           |  4 ++++
 templates/settings/admin-form.php | 16 ++++++++++++++++
 6 files changed, 36 insertions(+), 7 deletions(-)

diff --git a/lib/Controller/JsController.php b/lib/Controller/JsController.php
index 0c98d33..0f3dc92 100644
--- a/lib/Controller/JsController.php
+++ b/lib/Controller/JsController.php
@@ -54,6 +54,7 @@ class JsController extends Controller
         $parameters = [
             'opener-position' => $this->config->getAppValue('side_menu', 'opener-position', 'before'),
             'opener-hover' => (bool) $this->config->getAppValue('side_menu', 'opener-hover', '0'),
+            'force-light-icon' => (bool) $this->config->getAppValue('side_menu', 'force-light-icon', '0'),
             'hide-when-no-apps' => (bool) $this->config->getAppValue('side_menu', 'hide-when-no-apps', '0'),
         ];
 
diff --git a/lib/Settings/Admin.php b/lib/Settings/Admin.php
index 083d58b..79222b5 100644
--- a/lib/Settings/Admin.php
+++ b/lib/Settings/Admin.php
@@ -55,6 +55,7 @@ class Admin implements ISettings
             'background-color-to' => $backgroundColorTo,
             'current-app-background-color' => $this->config->getAppValue('side_menu', 'current-app-background-color', '#444444'),
             'text-color' => $this->config->getAppValue('side_menu', 'text-color', '#FFFFFF'),
+            'force-light-icon' => $this->config->getAppValue('side_menu', 'force-light-icon', '0'),
             'cache' => $this->config->getAppValue('side_menu', 'cache', '0'),
             'opener' => $this->config->getAppValue('side_menu', 'opener', 'side-menu-opener'),
             'display-logo' => $this->config->getAppValue('side_menu', 'display-logo', '1'),
diff --git a/src/SideMenu.vue b/src/SideMenu.vue
index 280d334..7c43443 100644
--- a/src/SideMenu.vue
+++ b/src/SideMenu.vue
@@ -41,7 +41,8 @@ export default {
     data() {
         return {
             apps: [],
-            logo: null
+            logo: null,
+			forceLightIcon: false,
         }
     },
     methods: {
@@ -60,6 +61,10 @@ export default {
 						.replace('id="invertMenuMain', 'id="invertSideMenu')
 						.replace('url(#invertMenuMain', 'url(#invertSideMenu')
 
+					if (this.forceLightIcon) {
+						svg = svg.replace(/filter="url[^"]+"/, '')
+					}
+
                     this.apps.push({
                         href: href,
                         name: element.querySelector('span').innerHTML,
@@ -90,16 +95,17 @@ export default {
             }
         },
     },
-    created() {
-        this.retrieveApps();
-        this.retrieveLogo();
+    mounted() {
+        this.retrieveApps()
+        this.retrieveLogo()
+		this.forceLightIcon = document.querySelector('#side-menu-container').getAttribute('data-forcelighticon') == 1;
 
         const menu = document.querySelector('#appmenu')
 
         if (menu) {
-            const config = {attributes: true, childList: true, subtree: true};
-            const observer = new MutationObserver(this.retrieveApps);
-            observer.observe(menu, config);
+            const config = {attributes: true, childList: true, subtree: true}
+            const observer = new MutationObserver(this.retrieveApps)
+            observer.observe(menu, config)
         }
     }
 }
diff --git a/src/admin.js b/src/admin.js
index fe2a18e..8cb9315 100644
--- a/src/admin.js
+++ b/src/admin.js
@@ -20,6 +20,7 @@ const elements = [
     'side-menu-background-color-to',
     'side-menu-current-app-background-color',
     'side-menu-text-color',
+    'side-menu-force-light-icon',
     'side-menu-opener',
     'side-menu-opener-position',
     'side-menu-opener-hover',
diff --git a/templates/js/script.php b/templates/js/script.php
index 33a9f50..b902e92 100644
--- a/templates/js/script.php
+++ b/templates/js/script.php
@@ -5,6 +5,10 @@
     var body = $('body')
     var isTouchDevice = window.matchMedia("(pointer: coarse)").matches
 
+    <?php if ($_['force-light-icon']): ?>
+        sideMenuContainer.attr('data-forcelighticon', '1')
+    <?php endif; ?>
+
     body.on('side-menu.apps', function(e, apps) {
         <?php if ($_['hide-when-no-apps']): ?>
             sideMenu = $('#side-menu')
diff --git a/templates/settings/admin-form.php b/templates/settings/admin-form.php
index 9647686..1867d5f 100644
--- a/templates/settings/admin-form.php
+++ b/templates/settings/admin-form.php
@@ -82,6 +82,22 @@ $choicesSizes = [
                 type="color"
                 value="<?php print_unescaped($_['text-color']); ?>">
         </div>
+
+        <div>
+            <label for="side-menu-opener-only" class="settings-hint">
+                <?php p($l->t('Force light icons')); ?>
+            </label>
+        </div>
+
+        <div>
+            <select id="side-menu-force-light-icon" name="force-light-icon">
+                <?php foreach ($choicesYesNo as $label => $value): ?>
+                    <option value="<?php echo $value ?>" <?php if ($value === $_['force-light-icon']): ?>selected<?php endif; ?>>
+                        <?php echo $l->t($label);  ?>
+                    </option>
+                <?php endforeach; ?>
+            </select>
+        </div>
     </div>
 
     <div class="section">