Develop (#25)

2025-07-28 00:22:26 +02:00 · 2020-10-04 11:52:08 +02:00
parent e13af7a2d5
commit beacedd64b
16 changed files with 594 additions and 663 deletions
--- a/src/constants/settings.js
+++ b/src/constants/settings.js
@@ -17,6 +17,7 @@ const settings = {
    root: "apiSettings",
    port: "apiSettings.port",
  },
+  mpris: "mpris",
  windowBounds: {
    root: "windowBounds",
    width: "windowBounds.width",
--- a/src/main.js
+++ b/src/main.js
@@ -34,8 +34,8 @@ function createWindow(options = {}) {
  mainWindow = new BrowserWindow({
    x: options.x,
    y: options.y,
-    width: 1024,
-    height: 800,
+    width: store && store.get(settings.windowBounds.width),
+    height: store && store.get(settings.windowBounds.height),
    icon,
    tray: true,
    backgroundColor: options.backgroundColor,
@@ -43,7 +43,7 @@ function createWindow(options = {}) {
      affinity: "window",
      preload: path.join(__dirname, "preload.js"),
      plugins: true,
-      devTools: !app.isPackaged,
+      devTools: true, // I like tinkering, others might too
    },
  });

@@ -56,7 +56,7 @@ function createWindow(options = {}) {
  mainWindow.webContents.once("did-finish-load", () => {});

  // Emitted when the window is closed.
-  mainWindow.on("closed", function() {
+  mainWindow.on("closed", function () {
    closeSettingsWindow();
    app.quit();
  });
@@ -88,7 +88,7 @@ app.on("ready", () => {
  store.get(settings.api) && expressModule.run(mainWindow);
 });

-app.on("activate", function() {
+app.on("activate", function () {
  // On OS X it's common to re-create a window in the app when the
  // dock icon is clicked and there are no other windows open.
  if (mainWindow === null) {
--- a/src/pages/settings/preload.js
+++ b/src/pages/settings/preload.js
@@ -17,12 +17,13 @@ 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);
 }

 /**
 * Open an url in the default browsers
 */
-window.openExternal = function(url) {
+window.openExternal = function (url) {
  const { shell } = require("electron");
  shell.openExternal(url);
 };
@@ -30,14 +31,14 @@ window.openExternal = function(url) {
 /**
 * hide the settings window
 */
-window.hide = function() {
+window.hide = function () {
  ipcRenderer.send(globalEvents.hideSettings);
 };

 /**
 * Restart tidal-hifi after changes
 */
-window.restart = function() {
+window.restart = function () {
  const remote = require("electron").remote;
  remote.app.relaunch();
  remote.app.exit(0);
@@ -52,7 +53,7 @@ window.addEventListener("DOMContentLoaded", () => {
  }

  function addInputListener(source, key) {
-    source.addEventListener("input", function(event, data) {
+    source.addEventListener("input", function (event, data) {
      if (this.value === "on") {
        store.set(key, source.checked);
      } else {
@@ -66,7 +67,7 @@ window.addEventListener("DOMContentLoaded", () => {
    refreshSettings();
  });

-  ipcRenderer.on("goToTab", (event, tab) => {
+  ipcRenderer.on("goToTab", (_, tab) => {
    document.getElementById(tab).click();
  });

@@ -75,6 +76,7 @@ window.addEventListener("DOMContentLoaded", () => {
  api = get("apiCheckbox");
  port = get("port");
  menuBar = get("menuBar");
+  mpris = get("mprisCheckbox");

  refreshSettings();

@@ -83,4 +85,5 @@ window.addEventListener("DOMContentLoaded", () => {
  addInputListener(api, settings.api);
  addInputListener(port, settings.apiSettings.port);
  addInputListener(menuBar, settings.menuBar);
+  addInputListener(mpris, settings.mpris);
 });
--- a/src/pages/settings/settings.html
+++ b/src/pages/settings/settings.html
@@ -26,14 +26,19 @@
    <div class="body">
        <div class="tabset">
            <!-- Tab 1 -->
-            <input type="radio" name="tabset" id="tab1" checked />
-            <label for="tab1">General</label>
+            <input type="radio" name="tabset" id="general" checked />
+            <label for="general">General</label>
            <!-- Tab 2 -->
-            <input type="radio" name="tabset" id="tab2" />
-            <label for="tab2">Api</label>
-            <!-- Tab 3 -->
-            <input type="radio" name="tabset" id="tab3" />
-            <label for="tab3">About</label>
+            <input type="radio" name="tabset" id="api" />
+            <label for="api">Api</label>
+
+            <!-- Integrations tab -->
+            <input type="radio" name="tabset" id="integrations" />
+            <label for="integrations">Integrations</label>
+
+            <!-- about tab -->
+            <input type="radio" name="tabset" id="about" />
+            <label for="about">About</label>

            <div class="tab-panels">
                <section id="general" class="tab-panel">
@@ -101,7 +106,29 @@
                    </div>
                    <button onClick="restart()">Restart Tidal-hifi</button>
                </section>
-                <section id="general" class="tab-panel">
+                <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">
+                          <h4>mpris-player</h4>
+                          <p>
+                              Whether to enable the mpris media player controls for Linux systems
+                          </p>
+                          <label class="switch">
+                              <input id="mprisCheckbox" type="checkbox">
+                              <span class="slider round"></span>
+                          </label>
+                      </div> -->
+                      <button onClick="restart()">Restart Tidal-hifi</button>
+                  </div>
+              </section>
+                <section id="about" class="tab-panel">
                  <div class="section">
                    <img style="width: 100px; height: auto; display: block; margin: 0 auto; margin-bottom: 20px; margin-top: 20px;" src = "./icon.png">
                    <p style="max-width: 350px; display:block; margin: 0 auto; text-align: center;">
@@ -170,6 +197,7 @@

    .exitWindow {
        border: none;
+        outline: none;
        text-decoration: none;
        font-size: 1.4rem;
        float: right;
@@ -178,6 +206,11 @@
        line-height: 50px;
    }

+    .exitWindow:focus {
+      border: none;
+      outline: none;
+    }
+
    .exitWindow svg {
        height: 50px;
        color: white;
@@ -263,7 +296,9 @@

    .tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
    .tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
-    .tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3) {
+    .tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
+    .tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4)
+     {
        display: block;
    }

--- a/src/preload.js
+++ b/src/preload.js
@@ -1,5 +1,5 @@
 const { setTitle, getTitle } = require("./scripts/window-functions");
-const { dialog } = require("electron").remote;
+const { dialog, process } = require("electron").remote;
 const { store, settings } = require("./scripts/settings");
 const { ipcRenderer } = require("electron");
 const { app } = require("electron").remote;
@@ -10,6 +10,7 @@ const globalEvents = require("./constants/globalEvents");
 const notifier = require("node-notifier");
 const notificationPath = `${app.getPath("userData")}/notification.jpg`;
 let currentSong = "";
+// let player;

 const elements = {
  play: '*[data-test="play"]',
@@ -34,14 +35,14 @@ const elements = {
   * Get an element from the dom
   * @param {*} key key in elements object to fetch
   */
-  get: function(key) {
+  get: function (key) {
    return window.document.querySelector(this[key.toLowerCase()]);
  },

  /**
   * Get the icon of the current song
   */
-  getSongIcon: function() {
+  getSongIcon: function () {
    const figure = this.get("media");

    if (figure) {
@@ -58,7 +59,7 @@ const elements = {
   * Shorthand function to get the text of a dom element
   * @param {*} key key in elements object to fetch
   */
-  getText: function(key) {
+  getText: function (key) {
    const element = this.get(key);
    return element ? element.textContent : "";
  },
@@ -67,7 +68,7 @@ const elements = {
   * Shorthand function to click a dom element
   * @param {*} key key in elements object to fetch
   */
-  click: function(key) {
+  click: function (key) {
    this.get(key).click();
    return this;
  },
@@ -76,7 +77,7 @@ const elements = {
   * Shorthand function to focus a dom element
   * @param {*} key key in elements object to fetch
   */
-  focus: function(key) {
+  focus: function (key) {
    return this.get(key).focus();
  },
 };
@@ -100,55 +101,55 @@ function playPause() {
 * https://defkey.com/tidal-desktop-shortcuts
 */
 function addHotKeys() {
-  hotkeys.add("Control+p", function() {
+  hotkeys.add("Control+p", function () {
    elements.click("account").click("settings");
  });
-  hotkeys.add("Control+l", function() {
+  hotkeys.add("Control+l", function () {
    handleLogout();
  });

-  hotkeys.add("Control+h", function() {
+  hotkeys.add("Control+h", function () {
    elements.click("home");
  });

-  hotkeys.add("backspace", function() {
+  hotkeys.add("backspace", function () {
    elements.click("back");
  });

-  hotkeys.add("shift+backspace", function() {
+  hotkeys.add("shift+backspace", function () {
    elements.click("forward");
  });

-  hotkeys.add("control+f", function() {
+  hotkeys.add("control+f", function () {
    elements.focus("search");
  });

-  hotkeys.add("control+u", function() {
+  hotkeys.add("control+u", function () {
    // reloading window without cache should show the update bar if applicable
    window.location.reload(true);
  });

-  hotkeys.add("control+left", function() {
+  hotkeys.add("control+left", function () {
    elements.click("previous");
  });

-  hotkeys.add("control+right", function() {
+  hotkeys.add("control+right", function () {
    elements.click("next");
  });

-  hotkeys.add("control+right", function() {
+  hotkeys.add("control+right", function () {
    elements.click("next");
  });

-  hotkeys.add("control+s", function() {
+  hotkeys.add("control+s", function () {
    elements.click("shuffle");
  });

-  hotkeys.add("control+r", function() {
+  hotkeys.add("control+r", function () {
    elements.click("repeat");
  });

-  hotkeys.add("control+/", function() {
+  hotkeys.add("control+/", function () {
    ipcRenderer.send(globalEvents.showSettings);
  });
 }
@@ -169,7 +170,7 @@ function handleLogout() {
      buttons: logoutOptions,
      defaultId: 2,
    },
-    function(response) {
+    function (response) {
      if (logoutOptions.indexOf("Yes, please") == response) {
        for (i = 0; i < window.localStorage.length; i++) {
          key = window.localStorage.key(i);
@@ -216,19 +217,28 @@ function addIPCEventListeners() {
 * Update the current status of tidal (e.g playing or paused)
 */
 function updateStatus() {
-  const play = elements.get("play");
-  let status = statuses.paused;
-  // if play button is NOT visible tidal is playing
-  if (!play) {
+  let pause = elements.get("pause");
+  let status;
+
+  // if pause button is visible tidal is playing
+  if (pause) {
    status = statuses.playing;
+  } else {
+    status = statuses.paused;
+  }
+
+  if (status) {
+    ipcRenderer.send(globalEvents.updateStatus, status);
+    // if (player) {
+    //   player.playbackStatus = status == statuses.paused ? "Paused" : "Playing";
+    // }
  }
-  ipcRenderer.send(globalEvents.updateStatus, status);
 }

 /**
 * Watch for song changes and update title + notify
 */
-setInterval(function() {
+setInterval(function () {
  const title = elements.getText("title");
  const artists = elements.getText("artists");
  const songDashArtistTitle = `${title} - ${artists}`;
@@ -264,6 +274,17 @@ setInterval(function() {
        () => {
          ipcRenderer.send(globalEvents.updateInfo, options);
          store.get(settings.notifications) && notifier.notify(options);
+
+          // if (player) {
+          //   player.metadata = {
+          //     ...player.metadata,
+          //     ...{
+          //       "xesam:title": title,
+          //       "xesam:artist": [artists],
+          //       "mpris:artUrl": image,
+          //     },
+          //   };
+          // }
        },
        () => {}
      );
@@ -271,5 +292,57 @@ setInterval(function() {
  }
 }, 200);

+// if (process.platform === "linux" && store.get(settings.mpris)) {
+//   try {
+//     const Player = require("mpris-service");
+//     player = Player({
+//       name: "tidal-hifi",
+//       identity: "tidal-hifi",
+//       supportedUriSchemes: ["file"],
+//       supportedMimeTypes: [
+//         "audio/mpeg",
+//         "audio/flac",
+//         "audio/x-flac",
+//         "application/ogg",
+//         "audio/wav",
+//       ],
+//       supportedInterfaces: ["player"],
+//       desktopEntry: "tidal-hifi",
+//     });
+
+//     // Events
+//     var events = {
+//       next: "next",
+//       previous: "previous",
+//       pause: "pause",
+//       playpause: "playpause",
+//       stop: "stop",
+//       play: "play",
+//       loopStatus: "repeat",
+//       shuffle: "shuffle",
+//       seek: "seek",
+//     };
+//     Object.keys(events).forEach(function (eventName) {
+//       player.on(eventName, function () {
+//         const eventValue = events[eventName];
+//         switch (events[eventValue]) {
+//           case events.playpause:
+//             playPause();
+//             break;
+
+//           default:
+//             elements.click(eventValue);
+//         }
+//       });
+//     });
+
+//     player.on("quit", function () {
+//       app.quit();
+//     });
+//   } catch (exception) {
+//     console.log("player api not working");
+//   }
+// }
+
 addHotKeys();
 addIPCEventListeners();
--- a/src/scripts/menu.js
+++ b/src/scripts/menu.js
@@ -89,18 +89,18 @@ const mainMenu = [
  {
    label: "About",
    click() {
-      showSettingsWindow("tab3");
+      showSettingsWindow("about");
    },
  },
 ];

 const menuModule = { mainMenu };

-menuModule.getMenu = function() {
+menuModule.getMenu = function () {
  return Menu.buildFromTemplate(mainMenu);
 };

-menuModule.addMenu = function() {
+menuModule.addMenu = function () {
  Menu.setApplicationMenu(menuModule.getMenu());
 };

--- a/src/scripts/settings.js
+++ b/src/scripts/settings.js
@@ -14,7 +14,7 @@ const store = new Store({
    apiSettings: {
      port: 47836,
    },
-
+    mpris: false,
    windowBounds: { width: 800, height: 600 },
  },
 });
@@ -25,7 +25,7 @@ const settingsModule = {
  settingsWindow,
 };

-settingsModule.createSettingsWindow = function() {
+settingsModule.createSettingsWindow = function () {
  settingsWindow = new BrowserWindow({
    width: 500,
    height: 600,
@@ -52,18 +52,18 @@ settingsModule.createSettingsWindow = function() {
  settingsModule.settingsWindow = settingsWindow;
 };

-settingsModule.showSettingsWindow = function(tab = "tab1") {
+settingsModule.showSettingsWindow = function (tab = "general") {
  settingsWindow.webContents.send("goToTab", tab);

  // refresh data just before showing the window
  settingsWindow.webContents.send("refreshData");
  settingsWindow.show();
 };
-settingsModule.hideSettingsWindow = function() {
+settingsModule.hideSettingsWindow = function () {
  settingsWindow.hide();
 };

-settingsModule.closeSettingsWindow = function() {
+settingsModule.closeSettingsWindow = function () {
  settingsWindow = null;
 };