added the option to disable the system tray icon and fixed the settings menu

src/constants/settings.js

@@ -18,6 +18,7 @@ const settings = {
     port: "apiSettings.port",
   },
   mpris: "mpris",
+  trayIcon: "trayIcon",
   windowBounds: {
     root: "windowBounds",
     width: "windowBounds.width",

src/main.js

@@ -83,8 +83,7 @@ app.on("ready", () => {
   addMenu();
   createSettingsWindow();
   addGlobalShortcuts();
-  addTray({ icon });
-  refreshTray();
+  store.get(settings.trayIcon) && addTray({ icon }) && refreshTray();
   store.get(settings.api) && expressModule.run(mainWindow);
 });
 

src/pages/settings/preload.js

@@ -17,7 +17,8 @@ function refreshSettings() {
   api.checked = store.get(settings.api);
   port.value = store.get(settings.apiSettings.port);
   menuBar.checked = store.get(settings.menuBar);
-  mpris.checked = store.get(settings.mpris);
+  trayIcon.checked = store.get(settings.trayIcon);
+  // mpris.checked = store.get(settings.mpris);
 }
 
 /**
@@ -76,7 +77,8 @@ window.addEventListener("DOMContentLoaded", () => {
   api = get("apiCheckbox");
   port = get("port");
   menuBar = get("menuBar");
-  mpris = get("mprisCheckbox");
+  trayIcon = get("trayIcon");
+  // mpris = get("mprisCheckbox");
 
   refreshSettings();
 
@@ -85,5 +87,6 @@ window.addEventListener("DOMContentLoaded", () => {
   addInputListener(api, settings.api);
   addInputListener(port, settings.apiSettings.port);
   addInputListener(menuBar, settings.menuBar);
-  addInputListener(mpris, settings.mpris);
+  addInputListener(trayIcon, settings.trayIcon);
+  // addInputListener(mpris, settings.mpris);
 });

src/pages/settings/settings.html

@@ -68,15 +68,25 @@
                             </label>
                         </div>
                     </div>
+                    <div class="section">
+                      <h3>System</h3>
+                      <div class="option">
+                          <h4>Tray icon</h4>
+                          <p>
+                              Show Tidal-hifi's tray icon<br />
+                          </p>
+                          <label class="switch">
+                              <input id="trayIcon" type="checkbox">
+                              <span class="slider round"></span>
+                          </label>
+                      </div>
+                  </div>
                 </section>
                 <section id="api" class="tab-panel">
                     <div class="section">
                         <h3>Api</h3>
                         <p style="margin-bottom: 15px;">
                             Tidal-hifi has a web api built in to allow users to get current song information. You can optionally enable playback control as well.
-                            <br />
-                            <br />
-                            <small>* api changes require a restart to update</small>
                         </p>
 
                         <div class="option">
@@ -104,15 +114,12 @@
                             </label>
                         </div>
                     </div>
-                    <button onClick="restart()">Restart Tidal-hifi</button>
                 </section>
                 <section id="integrations" class="tab-panel">
                   <div class="section">
                       <h3>integrations</h3>
                       <p style="margin-bottom: 15px;">
                           Tidal-hifi is extensible trough the use of integrations. You can enable or disable integrations here
-                          <br />
-                          * not all integrations require restarting but some do, your best bet is to restart :)
                       </p>
                       <!-- disabled until the 403 with mpris-service/dbus is fixed  -->
                       <!-- <div class="option">
@@ -125,7 +132,6 @@
                               <span class="slider round"></span>
                           </label>
                       </div> -->
-                      <button onClick="restart()">Restart Tidal-hifi</button>
                   </div>
               </section>
                 <section id="about" class="tab-panel">
@@ -138,6 +144,9 @@
 
                   </div>
                 </section>
+
+              <small>Some settings require a restart of Tidal-hifi. To do so click the button below:</small>
+              <button onClick="restart()" style ="width: 100%">Restart Tidal-hifi</button>
             </div>
         </div>
     </div>

src/scripts/settings.js

@@ -14,6 +14,7 @@ const store = new Store({
     apiSettings: {
       port: 47836,
     },
+    trayIcon: true,
     mpris: false,
     windowBounds: { width: 800, height: 600 },
   },

src/scripts/tray.js

@@ -3,12 +3,15 @@ const { getMenu } = require("./menu");
 const trayModule = {};
 let tray;
 
-trayModule.addTray = function(options = { icon: "" }) {
+trayModule.addTray = function (options = { icon: "" }) {
   tray = new Tray(options.icon);
 };
 
-trayModule.refreshTray = function() {
-  tray.on("click", function(e) {
+trayModule.refreshTray = function () {
+  if (!tray) {
+    trayModule.addTray();
+  }
+  tray.on("click", function (e) {
     // do nothing on click
   });