Merge pull request #395 from Mastermindzh/next-version

Next version

.stylelintrc.json

@@ -5,6 +5,9 @@
   "extends": [
     "stylelint-config-standard-scss"
   ],
+  "ignoreFiles": [
+    "src/themes/**.scss"
+  ],
   "rules": {
     "prettier/prettier": true,
     "scss/at-extend-no-missing-placeholder": null,

CHANGELOG.md

@@ -4,6 +4,66 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [5.11.0]
+
+- Re-implemented the API, added support for duration/current in seconds & shuffle+repeat
+  - made the original API "legacy" (still works the same)
+  - Now using the correct HTTP verb for all new endpoints
+- Implemented TIDAL's universal links. All links are now universal.
+- Custom `tidal://` protocol fixed - By [TheRockYT](https://github.com/TheRockYT)
+- Global media shortcuts removed since TIDAL includes them by default - By [TheRockYT](https://github.com/TheRockYT)
+
+- Fixes
+  - [#390](https://github.com/Mastermindzh/tidal-hifi/issues/390)
+  - [#376](https://github.com/Mastermindzh/tidal-hifi/issues/376)
+  - [#383](https://github.com/Mastermindzh/tidal-hifi/issues/383)
+  - [#393](https://github.com/Mastermindzh/tidal-hifi/issues/393)
+
+## [5.10.0]
+
+- TIDAL will now close the previous notification if a new one is sent whilst the old is still visible. [#364](https://github.com/Mastermindzh/tidal-hifi/pull/364)
+- Updated developer documentation to get started in README [#365](https://github.com/Mastermindzh/tidal-hifi/pull/365)
+- Links in the about window now open in the user's default browser. fixes [#360](https://github.com/Mastermindzh/tidal-hifi/issues/360)
+- Refactored "nowPlaying" code to always display the current state, even when the built-in UI is updated.
+  - fixes [#351](https://github.com/Mastermindzh/tidal-hifi/issues/351)
+  - fixes [#356](https://github.com/Mastermindzh/tidal-hifi/issues/356)
+  - fixes [#370](https://github.com/Mastermindzh/tidal-hifi/issues/370)
+- Reverted to using old icon syntax with icons in the build directory. fixes [#350](https://github.com/Mastermindzh/tidal-hifi/issues/350)
+- Enabled wayland platform flags by default when launching through .desktop file
+  - fixes [#273](https://github.com/Mastermindzh/tidal-hifi/issues/273)
+  - fixes [#347](https://github.com/Mastermindzh/tidal-hifi/issues/347)
+
+## [5.9.0]
+
+- More Discord options:
+  - Added the ability to hide the current song from the discord activity and display a custom text instead
+  - Added the ability to customize the text that is shown when no song is playing
+  - Discord now reacts to pausing/unpausing events
+- Refactored media info updates so it only updates the required info, fixes #342, #306
+- Added 5.9.0 logs/versions/migrations
+
+### Fixed
+
+- Fixed chromium mediaSession instance showing up. fixes #338 #198
+- Set a new icon, should fix #302
+- Made sure settingsWindow exists before operating on it. fixes #344
+
+## [5.8.0]
+
+- Updated Electron to 28.1.1 (fixes [325](https://github.com/Mastermindzh/tidal-hifi/issues/325))
+- Updated dependencies to latest
+  - added theme files to stylelint ignore
+  - fixed other stylelint errors
+
+- Added functionality to favorite a song (fixes [#323](https://github.com/Mastermindzh/tidal-hifi/issues/323))
+  - Added a hotkey to favorite ("Add to collection") songs: Control+a
+  - Added the "favorite" field in the `mediaInfo` and the API `/current` endpoint
+  - Added an endpoint to toggle favoriting a song: `http://localhost:47836/favorite/toggle`
+
+- Fixed wrong "end time stamp" for currently playing song (fixes [#282](https://github.com/Mastermindzh/tidal-hifi/issues/282))
+  - Affected the API + all integrations
+  - As requested we also added toggle to sync the timestamps to Discord (default = true)
+
 ## [5.7.1]
 
 - Fixed mpris not being set up correctly due to capitalization of the instance name.

README.md

@@ -130,10 +130,13 @@ nix-env -iA nixpkgs.tidal-hifi
 
 To install and work with the code on this project follow these steps:
 
-- git clone [https://github.com/Mastermindzh/tidal-hifi.git](https://github.com/Mastermindzh/tidal-hifi.git)
+- `git clone [https://github.com/Mastermindzh/tidal-hifi.git](https://github.com/Mastermindzh/tidal-hifi.git)`
-- cd TIDAL Hi-Fi
+- `cd tidal-hifi`
-- npm install
+- `npm install`
-- npm start
+- `npm run watch` to watch for auto-reload of Typescript/SCSS changes.
+  - `npm run compile` can be used to trigger it once
+- `npm watchStart` to auto watch for any updates files and reload Tidal Hi-Fi
+  - `npm start` can be used to run Tidal Hi-Fi manually once
 
 ## Integrations
 

build/electron-builder.base.yml

@@ -1,7 +1,7 @@
 appId: com.rickvanlieshout.tidal-hifi
-electronVersion: 24.1.2
+electronVersion: 28.1.1
 electronDownload:
-  version: 24.1.2+wvcus
+  version: 28.1.1+wvcus
   mirror: https://github.com/castlabs/electron-releases/releases/download/v
 snap:
   plugs:
@@ -11,10 +11,16 @@ extraResources:
   - "themes/**"
 linux:
   category: AudioVideo
-  icon: assets/icons
+  icon: build/icons
   target:
     - dir
   executableName: tidal-hifi
+  executableArgs:
+    [
+      "--enable-features=UseOzonePlatform",
+      "--ozone-platform-hint=auto",
+      "--enable-features=WaylandWindowDecorations",
+    ]
   desktop:
     Encoding: UTF-8
     Name: TIDAL Hi-Fi

package.json

@@ -1,12 +1,13 @@
 {
   "name": "tidal-hifi",
-  "version": "5.7.1",
+  "version": "5.11.0",
   "description": "Tidal on Electron with widevine(hifi) support",
   "main": "ts-dist/main.js",
   "scripts": {
     "start": "electron --inspect=0.0.0.0:5858 .",
     "watchStart": "nodemon dist -x \"npm run start\"",
     "compile": "tsc && npm run sass-and-copy",
+    "deps": "npm run watch",
     "watch": "tsc-watch --onSuccess \"npm run sass-and-copy\"",
     "copy-files": "copyfiles -u 1 --exclude './src/**/*.ts' --exclude './src/**/*.scss' \"./src/**/*\" ts-dist",
     "copy-themes-dev": "copyfiles -u 1 \"./themes/*\" node_modules/electron/dist/resources",
@@ -38,38 +39,38 @@
   "homepage": "https://github.com/Mastermindzh/tidal-hifi",
   "license": "MIT",
   "dependencies": {
-    "@electron/remote": "^2.0.10",
+    "@electron/remote": "^2.1.2",
-    "axios": "^1.4.0",
+    "axios": "^1.6.8",
     "discord-rpc": "^4.0.1",
-    "electron-store": "^8.1.0",
+    "electron-store": "^8.2.0",
-    "express": "^4.18.2",
+    "express": "^4.19.2",
-    "hotkeys-js": "^3.12.0",
+    "hotkeys-js": "^3.13.7",
     "mpris-service": "^2.1.2",
     "request": "^2.88.2",
-    "sass": "^1.64.1"
+    "sass": "^1.75.0"
   },
   "devDependencies": {
     "@mastermindzh/prettier-config": "^1.0.0",
-    "@types/discord-rpc": "^4.0.5",
+    "@types/discord-rpc": "^4.0.8",
-    "@types/express": "^4.17.17",
+    "@types/express": "^4.17.21",
-    "@types/node": "^20.4.4",
+    "@types/node": "^20.10.6",
-    "@types/request": "^2.48.8",
+    "@types/request": "^2.48.12",
-    "@typescript-eslint/eslint-plugin": "^6.1.0",
+    "@typescript-eslint/eslint-plugin": "^6.18.0",
-    "@typescript-eslint/parser": "^6.1.0",
+    "@typescript-eslint/parser": "^6.18.0",
     "copyfiles": "^2.4.1",
-    "electron": "git+https://github.com/castlabs/electron-releases.git#v24.1.2+wvcus",
+    "electron": "git+https://github.com/castlabs/electron-releases#v28.1.1+wvcus",
-    "electron-builder": "^24.4.0",
+    "electron-builder": "^24.9.1",
-    "eslint": "^8.45.0",
+    "eslint": "^8.56.0",
     "js-yaml": "^4.1.0",
     "markdown-toc": "^1.2.0",
-    "nodemon": "^3.0.1",
+    "nodemon": "^3.0.2",
-    "prettier": "^3.0.0",
+    "prettier": "^3.1.1",
-    "stylelint": "^15.10.2",
+    "stylelint": "^16.1.0",
-    "stylelint-config-standard": "^34.0.0",
+    "stylelint-config-standard": "^36.0.0",
-    "stylelint-config-standard-scss": "^10.0.0",
+    "stylelint-config-standard-scss": "^13.0.0",
-    "stylelint-prettier": "^4.0.0",
+    "stylelint-prettier": "^5.0.0",
     "tsc-watch": "^6.0.4",
-    "typescript": "^5.1.6"
+    "typescript": "^5.3.3"
   },
   "prettier": "@mastermindzh/prettier-config"
-}
+}

scripts/verifyElements.js

@@ -16,11 +16,12 @@
     search: '[class^="searchField"]',
     shuffle: '*[data-test="shuffle"]',
     repeat: '*[data-test="repeat"]',
-    account: '*[data-test^="profile-image-button"]',
+    account: '*[class^="profileOptions"]',
+    settings: '*[data-test^="open-settings"]',
     media: '*[data-test="current-media-imagery"]',
     image: "img",
     current: '*[data-test="current-time"]',
-    duration: '*[data-test="duration"]',
+    duration: '*[class^=playbackControlsContainer] *[data-test="duration"]',
     bar: '*[data-test="progress-bar"]',
     footer: "#footerPlayer",
     mediaItem: "[data-type='mediaItem']",
@@ -29,6 +30,7 @@
     album_name_cell: '[class^="album"]',
     tracklist_row: '[data-test="tracklist-row"]',
     volume: '*[data-test="volume"]',
+    favorite: '*[data-test="footer-favorite-button"]',
   };
 
   let results = [];

src/constants/globalEvents.ts

@@ -12,4 +12,7 @@ export const globalEvents = {
   error: "error",
   whip: "whip",
   log: "log",
+  toggleFavorite: "toggleFavorite",
+  toggleShuffle: "toggleShuffle",
+  toggleRepeat: "toggleRepeat",
 };

src/constants/settings.ts

@@ -23,6 +23,10 @@ export const settings = {
   discord: {
     detailsPrefix: "discord.detailsPrefix",
     buttonText: "discord.buttonText",
+    includeTimestamps: "discord.includeTimestamps",
+    showSong: "discord.showSong",
+    idleText: "discord.idleText",
+    usingText: "discord.usingText",
   },
   ListenBrainz: {
     root: "ListenBrainz",

src/features/api/features/current.ts

@@ -0,0 +1,20 @@
+import { Request, Response, Router } from "express";
+import fs from "fs";
+import { mediaInfo } from "../../../scripts/mediaInfo";
+
+export const addCurrentInfo = (expressApp: Router) => {
+  expressApp.get("/current", (req, res) => res.json({ ...mediaInfo, artist: mediaInfo.artists }));
+  expressApp.get("/current/image", getCurrentImage);
+};
+
+export const getCurrentImage = (req: Request, res: Response) => {
+  const stream = fs.createReadStream(mediaInfo.icon);
+  stream.on("open", function () {
+    res.set("Content-Type", "image/png");
+    stream.pipe(res);
+  });
+  stream.on("error", function () {
+    res.set("Content-Type", "text/plain");
+    res.status(404).end("Not found");
+  });
+};

src/features/api/features/player.ts

@@ -0,0 +1,36 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { BrowserWindow } from "electron";
+import { Router } from "express";
+import { globalEvents } from "../../../constants/globalEvents";
+import { settings } from "../../../constants/settings";
+import { MediaStatus } from "../../../models/mediaStatus";
+import { mediaInfo } from "../../../scripts/mediaInfo";
+import { settingsStore } from "../../../scripts/settings";
+import { handleWindowEvent } from "../helpers/handleWindowEvent";
+
+export const addPlaybackControl = (expressApp: Router, mainWindow: BrowserWindow) => {
+  const windowEvent = handleWindowEvent(mainWindow);
+  const createRoute = (route: string) => `/player${route}`;
+
+  const createPlayerAction = (route: string, action: string) => {
+    expressApp.post(createRoute(route), (req, res) => windowEvent(res, action));
+  };
+
+  if (settingsStore.get(settings.playBackControl)) {
+    createPlayerAction("/play", globalEvents.play);
+    createPlayerAction("/favorite/toggle", globalEvents.toggleFavorite);
+    createPlayerAction("/pause", globalEvents.pause);
+    createPlayerAction("/next", globalEvents.next);
+    createPlayerAction("/previous", globalEvents.previous);
+    createPlayerAction("/shuffle/toggle", globalEvents.toggleShuffle);
+    createPlayerAction("/repeat/toggle", globalEvents.toggleRepeat);
+
+    expressApp.post(createRoute("/playpause"), (req, res) => {
+      if (mediaInfo.status === MediaStatus.playing) {
+        windowEvent(res, globalEvents.pause);
+      } else {
+        windowEvent(res, globalEvents.play);
+      }
+    });
+  }
+};

src/features/api/helpers/handleWindowEvent.ts

@@ -0,0 +1,12 @@
+import { BrowserWindow } from "electron";
+import { Response } from "express";
+
+/**
+ * Shorthand to handle a fire and forget global event
+ * @param {*} res
+ * @param {*} action
+ */
+export const handleWindowEvent = (mainWindow: BrowserWindow) => (res: Response, action: string) => {
+  mainWindow.webContents.send("globalEvent", action);
+  res.sendStatus(200);
+};

src/features/api/index.ts

@@ -0,0 +1,31 @@
+import { BrowserWindow, dialog } from "electron";
+import express from "express";
+import { settings } from "../../constants/settings";
+import { settingsStore } from "../../scripts/settings";
+import { addCurrentInfo } from "./features/current";
+import { addPlaybackControl } from "./features/player";
+import { addLegacyApi } from "./legacy";
+
+/**
+ * Function to enable TIDAL Hi-Fi's express api
+ */
+export const startApi = (mainWindow: BrowserWindow) => {
+  const expressApp = express();
+  expressApp.get("/", (req, res) => res.send("Hello World!"));
+
+  // add features
+  addLegacyApi(expressApp, mainWindow);
+  addPlaybackControl(expressApp, mainWindow);
+  addCurrentInfo(expressApp);
+
+  const port = settingsStore.get<string, number>(settings.apiSettings.port);
+  const expressInstance = expressApp.listen(port, "127.0.0.1");
+  expressInstance.on("error", function (e: { code: string }) {
+    let message = e.code;
+    if (e.code === "EADDRINUSE") {
+      message = `Port ${port} in use.`;
+    }
+
+    dialog.showErrorBox("Api failed to start.", message);
+  });
+};

src/features/api/legacy.ts

@@ -0,0 +1,47 @@
+import { BrowserWindow } from "electron";
+import { Response, Router } from "express";
+import { globalEvents } from "../../constants/globalEvents";
+import { settings } from "../../constants/settings";
+import { MediaStatus } from "../../models/mediaStatus";
+import { mediaInfo } from "../../scripts/mediaInfo";
+import { settingsStore } from "../../scripts/settings";
+import { getCurrentImage } from "./features/current";
+
+/**
+ * The legacy API, this will not be maintained and probably has duplicate code :)
+ * @param expressApp
+ * @param mainWindow
+ */
+export const addLegacyApi = (expressApp: Router, mainWindow: BrowserWindow) => {
+  expressApp.get("/image", getCurrentImage);
+
+  if (settingsStore.get(settings.playBackControl)) {
+    addLegacyControls();
+  }
+  function addLegacyControls() {
+    expressApp.get("/play", ({ res }) => handleGlobalEvent(res, globalEvents.play));
+    expressApp.post("/favorite/toggle", (req, res) =>
+      handleGlobalEvent(res, globalEvents.toggleFavorite)
+    );
+    expressApp.get("/pause", (req, res) => handleGlobalEvent(res, globalEvents.pause));
+    expressApp.get("/next", (req, res) => handleGlobalEvent(res, globalEvents.next));
+    expressApp.get("/previous", (req, res) => handleGlobalEvent(res, globalEvents.previous));
+    expressApp.get("/playpause", (req, res) => {
+      if (mediaInfo.status === MediaStatus.playing) {
+        handleGlobalEvent(res, globalEvents.pause);
+      } else {
+        handleGlobalEvent(res, globalEvents.play);
+      }
+    });
+  }
+
+  /**
+   * Shorthand to handle a fire and forget global event
+   * @param {*} res
+   * @param {*} action
+   */
+  function handleGlobalEvent(res: Response, action: string) {
+    mainWindow.webContents.send("globalEvent", action);
+    res.sendStatus(200);
+  }
+};

src/features/time/parse.ts

@@ -0,0 +1,14 @@
+/**
+ * Convert a HH:MM:SS string (or variants such as MM:SS or SS) to plain seconds
+ * @param duration in HH:MM:SS format
+ * @returns number of seconds in duration
+ */
+export const convertDurationToSeconds = (duration: string) => {
+  return duration
+    .split(":")
+    .reverse()
+    .map((val) => Number(val))
+    .reduce((previous, current, index) => {
+      return index === 0 ? current : previous + current * Math.pow(60, index);
+    }, 0);
+};

src/main.ts

@@ -1,17 +1,9 @@
 import { enable, initialize } from "@electron/remote/main";
-import {
+import { BrowserWindow, app, components, ipcMain, session } from "electron";
-  app,
-  BrowserWindow,
-  components,
-  globalShortcut,
-  ipcMain,
-  protocol,
-  session,
-} from "electron";
 import path from "path";
 import { globalEvents } from "./constants/globalEvents";
-import { mediaKeys } from "./constants/mediaKeys";
 import { settings } from "./constants/settings";
+import { startApi } from "./features/api";
 import { setDefaultFlags, setManagedFlagsFromSettings } from "./features/flags/flags";
 import {
   acquireInhibitorIfInactive,
@@ -22,7 +14,6 @@ import { Songwhip } from "./features/songwhip/songwhip";
 import { MediaInfo } from "./models/mediaInfo";
 import { MediaStatus } from "./models/mediaStatus";
 import { initRPC, rpc, unRPC } from "./scripts/discord";
-import { startExpress } from "./scripts/express";
 import { updateMediaInfo } from "./scripts/mediaInfo";
 import { addMenu } from "./scripts/menu";
 import {
@@ -61,20 +52,31 @@ function syncMenuBarWithStore() {
 }
 
 /**
- * Determine whether the current window is the main window
+ * @returns true/false based on whether the current window is the main window
- * if singleInstance is requested.
- * If singleInstance isn't requested simply return true
- * @returns true if singInstance is not requested, otherwise true/false based on whether the current window is the main window
  */
-function isMainInstanceOrMultipleInstancesAllowed() {
+function isMainInstance() {
-  if (settingsStore.get(settings.singleInstance)) {
+  return app.requestSingleInstanceLock();
-    const gotTheLock = app.requestSingleInstanceLock();
+}
 
-    if (!gotTheLock) {
+/**
-      return false;
+ * @returns true/false based on whether multiple instances are allowed
-    }
+ */
+function isMultipleInstancesAllowed() {
+  return !settingsStore.get(settings.singleInstance);
+}
+
+/**
+ * @param args the arguments passed to the app
+ * @returns the custom protocol url if it exists, otherwise null
+ */
+function getCustomProtocolUrl(args: string[]) {
+  const customProtocolArg = args.find((arg) => arg.startsWith(PROTOCOL_PREFIX));
+
+  if (!customProtocolArg) {
+    return null;
   }
-  return true;
+
+  return tidalUrl + "/" + customProtocolArg.substring(PROTOCOL_PREFIX.length + 3);
 }
 
 function createWindow(options = { x: 0, y: 0, backgroundColor: "white" }) {
@@ -98,8 +100,16 @@ function createWindow(options = { x: 0, y: 0, backgroundColor: "white" }) {
   registerHttpProtocols();
   syncMenuBarWithStore();
 
-  // load the Tidal website
+  // find the custom protocol argument
-  mainWindow.loadURL(tidalUrl);
+  const customProtocolUrl = getCustomProtocolUrl(process.argv);
+
+  if (customProtocolUrl) {
+    // load the url received from the custom protocol
+    mainWindow.loadURL(customProtocolUrl);
+  } else {
+    // load the Tidal website
+    mainWindow.loadURL(tidalUrl);
+  }
 
   if (settingsStore.get(settings.disableBackgroundThrottle)) {
     // prevent setInterval lag
@@ -139,27 +149,32 @@ function createWindow(options = { x: 0, y: 0, backgroundColor: "white" }) {
 }
 
 function registerHttpProtocols() {
-  protocol.registerHttpProtocol(PROTOCOL_PREFIX, (request) => {
-    mainWindow.loadURL(`${tidalUrl}/${request.url.substring(PROTOCOL_PREFIX.length + 3)}`);
-  });
   if (!app.isDefaultProtocolClient(PROTOCOL_PREFIX)) {
     app.setAsDefaultProtocolClient(PROTOCOL_PREFIX);
   }
 }
 
-function addGlobalShortcuts() {
-  Object.keys(mediaKeys).forEach((key) => {
-    globalShortcut.register(`${key}`, () => {
-      mainWindow.webContents.send("globalEvent", `${(mediaKeys as any)[key]}`);
-    });
-  });
-}
-
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
 app.on("ready", async () => {
-  if (isMainInstanceOrMultipleInstancesAllowed()) {
+  // check if the app is the main instance and multiple instances are not allowed
+  if (isMainInstance() && !isMultipleInstancesAllowed()) {
+    app.on("second-instance", (_, commandLine) => {
+      const customProtocolUrl = getCustomProtocolUrl(commandLine);
+
+      if (customProtocolUrl) {
+        mainWindow.loadURL(customProtocolUrl);
+      }
+
+      if (mainWindow) {
+        if (mainWindow.isMinimized()) mainWindow.restore();
+        mainWindow.focus();
+      }
+    });
+  }
+
+  if (isMainInstance() || isMultipleInstancesAllowed()) {
     await components.whenReady();
 
     // Adblock
@@ -174,12 +189,11 @@ app.on("ready", async () => {
     createWindow();
     addMenu(mainWindow);
     createSettingsWindow();
-    addGlobalShortcuts();
     if (settingsStore.get(settings.trayIcon)) {
       addTray(mainWindow, { icon });
       refreshTray(mainWindow);
     }
-    settingsStore.get(settings.api) && startExpress(mainWindow);
+    settingsStore.get(settings.api) && startApi(mainWindow);
     settingsStore.get(settings.enableDiscord) && initRPC();
   } else {
     app.quit();

src/models/mediaInfo.ts

@@ -8,6 +8,9 @@ export interface MediaInfo {
   status: MediaStatus;
   url: string;
   current: string;
+  currentInSeconds?: number;
   duration: string;
+  durationInSeconds?: number;
   image: string;
+  favorite: boolean;
 }

src/models/options.ts

@@ -5,8 +5,11 @@ export interface Options {
   status: string;
   url: string;
   current: string;
+  currentInSeconds: number;
   duration: string;
+  durationInSeconds: number;
   "app-name": string;
   image: string;
   icon: string;
+  favorite: boolean;
 }

src/pages/settings/preload.ts

@@ -20,6 +20,11 @@ const switchesWithSettings = {
     classToHide: "discord_options",
     settingsKey: settings.enableDiscord,
   },
+  discord_show_song: {
+    switch: "discord_show_song",
+    classToHide: "discord_show_song_options",
+    settingsKey: settings.discord.showSong,
+  }
 };
 
 let adBlock: HTMLInputElement,
@@ -48,7 +53,11 @@ let adBlock: HTMLInputElement,
   listenbrainz_delay: HTMLInputElement,
   enableWaylandSupport: HTMLInputElement,
   discord_details_prefix: HTMLInputElement,
-  discord_button_text: HTMLInputElement;
+  discord_include_timestamps: HTMLInputElement,
+  discord_button_text: HTMLInputElement,
+  discord_show_song: HTMLInputElement,
+  discord_idle_text: HTMLInputElement,
+  discord_using_text: HTMLInputElement;
 
 addCustomCss(app);
 
@@ -135,7 +144,11 @@ function refreshSettings() {
     ListenBrainzToken.value = settingsStore.get(settings.ListenBrainz.token);
     listenbrainz_delay.value = settingsStore.get(settings.ListenBrainz.delay);
     discord_details_prefix.value = settingsStore.get(settings.discord.detailsPrefix);
+    discord_include_timestamps.checked = settingsStore.get(settings.discord.includeTimestamps);
     discord_button_text.value = settingsStore.get(settings.discord.buttonText);
+    discord_show_song.checked = settingsStore.get(settings.discord.showSong);
+    discord_idle_text.value = settingsStore.get(settings.discord.idleText);
+    discord_using_text.value = settingsStore.get(settings.discord.usingText);
 
     // set state of all switches with additional settings
     Object.values(switchesWithSettings).forEach((settingSwitch) => {
@@ -246,8 +259,12 @@ window.addEventListener("DOMContentLoaded", () => {
   ListenBrainzAPI = get("ListenBrainzAPI");
   ListenBrainzToken = get("ListenBrainzToken");
   discord_details_prefix = get("discord_details_prefix");
+  discord_include_timestamps = get("discord_include_timestamps");
   listenbrainz_delay = get("listenbrainz_delay");
   discord_button_text = get("discord_button_text");
+  discord_show_song = get("discord_show_song");
+  discord_using_text = get("discord_using_text");
+  discord_idle_text = get("discord_idle_text")
 
   refreshSettings();
   addInputListener(adBlock, settings.adBlock);
@@ -280,5 +297,9 @@ window.addEventListener("DOMContentLoaded", () => {
   addInputListener(ListenBrainzToken, settings.ListenBrainz.token);
   addInputListener(listenbrainz_delay, settings.ListenBrainz.delay);
   addInputListener(discord_details_prefix, settings.discord.detailsPrefix);
+  addInputListener(discord_include_timestamps, settings.discord.includeTimestamps);
   addInputListener(discord_button_text, settings.discord.buttonText);
+  addInputListener(discord_show_song, settings.discord.showSong, switchesWithSettings.discord_show_song);
+  addInputListener(discord_idle_text, settings.discord.idleText);
+  addInputListener(discord_using_text, settings.discord.usingText);
 });

src/pages/settings/settings.html

@@ -216,21 +216,64 @@
               </label>
             </div>
             <div id="discord_options">
+
               <div class="group__option" class="hidden">
                 <div class="group__description">
-                  <h4>Details prefix</h4>
+                  <h4>Idle Text</h4>
-                  <p>Prefix for the "details" field of Discord's rich presence.</p>
+                  <p>The text displayed on Discord's rich presence while idling in the app.</p>
-                  <input id="discord_details_prefix" type="text" class="text-input" name="discord_details_prefix" />
+                  <input id="discord_idle_text" type="text" class="text-input" name="discord_idle_text" />
                 </div>
               </div>
 
-              <div class="group__option">
+              <div class="group__option" class="hidden">
                 <div class="group__description">
-                  <h4>Button text</h4>
+                  <h4>Using Tidal Text</h4>
-                  <p>Text to display on the button below the song information.</p>
+                  <p>The text displayed on Discord's rich presence while "showSong" is turned off</p>
-                  <input id="discord_button_text" type="text" class="text-input" name="discord_button_text" />
+                  <input id="discord_using_text" type="text" class="text-input" name="discord_using_text" />
                 </div>
               </div>
+
+              <div class="group__option" class="hidden">
+                <div class="group__description">
+                  <h4>Show song</h4>
+                  <p>Show the current song in the Discord client</p>
+                </div>
+                <label class="switch">
+                  <input id="discord_show_song" type="checkbox" />
+                  <span class="switch__slider"></span>
+                </label>
+              </div>
+
+              <div id="discord_show_song_options" class="hidden">
+
+                <div class="group__option" class="hidden">
+                  <div class="group__description">
+                    <h4>Include timestamps</h4>
+                    <p>Show current/end playtime in the Discord client</p>
+                  </div>
+                  <label class="switch">
+                    <input id="discord_include_timestamps" type="checkbox" />
+                    <span class="switch__slider"></span>
+                  </label>
+                </div>
+
+                <div class="group__option" class="hidden">
+                  <div class="group__description">
+                    <h4>Details prefix</h4>
+                    <p>Prefix for the "details" field of Discord's rich presence.</p>
+                    <input id="discord_details_prefix" type="text" class="text-input" name="discord_details_prefix" />
+                  </div>
+                </div>
+
+                <div class="group__option">
+                  <div class="group__description">
+                    <h4>Button text</h4>
+                    <p>Text to display on the button below the song information.</p>
+                    <input id="discord_button_text" type="text" class="text-input" name="discord_button_text" />
+                  </div>
+                </div>
+              </div>
+
             </div>
           </div>
           <div class="group">
@@ -389,14 +432,16 @@
           <img alt="tidal icon" class="about-section__icon" src="./icon.png" />
           <h4>TIDAL Hi-Fi</h4>
           <div class="about-section__version">
-            <a href="">5.7.0</a>
+            <a target="_blank" rel="noopener"
+              href="https://github.com/Mastermindzh/tidal-hifi/releases/tag/5.11.0">5.11.0</a>
           </div>
           <div class="about-section__links">
-            <a href="https://github.com/mastermindzh/tidal-hifi/" class="about-section__button">Github <i
+            <a target="_blank" rel="noopener" href="https://github.com/mastermindzh/tidal-hifi/"
-                class="fa fa-external-link"></i></a>
+              class="about-section__button">Github
-            <a href="https://github.com/Mastermindzh/tidal-hifi/issues" class="about-section__button">Report an issue <i
+              <i class="fa fa-external-link"></i></a>
-                class="fa fa-external-link"></i></a>
+            <a target="_blank" rel="noopener" href="https://github.com/Mastermindzh/tidal-hifi/issues"
-            <a href="https://github.com/Mastermindzh/tidal-hifi/graphs/contributors"
+              class="about-section__button">Report an issue <i class="fa fa-external-link"></i></a>
+            <a target="_blank" rel="noopener" href="https://github.com/Mastermindzh/tidal-hifi/graphs/contributors"
               class="about-section__button">Contributors <i class="fa fa-external-link"></i></a>
           </div>
         </section>

src/pages/settings/settings.scss

@@ -323,16 +323,19 @@ html {
     max-width: 500px;
     margin: -15px auto 0;
   }
+
   &__table {
     width: 120px;
-    margin: 0 auto 0;
+    margin: 0 auto;
 
     td {
       text-align: left;
     }
   }
+
   &__version {
-    margin: -10px 0px 30px 0px;
+    margin: -10px 0 30px;
+
     a {
       background-color: $tidal-grey-darker;
       border: none;
@@ -349,6 +352,7 @@ html {
   &__links {
     width: 300px;
     margin: 0 auto;
+
     a {
       border-radius: 10px;
       border: none;
@@ -411,17 +415,17 @@ html {
 }
 
 // file upload
-
 .file-drop-area {
   position: relative;
   display: flex;
   align-items: center;
   width: 100%;
   max-width: 100%;
-  padding: 25px 0 25px 0px;
+  padding: 25px 0;
   border: 1px dashed $tidal-grey;
   border-radius: 3px;
   transition: 0.2s;
+
   &.is-active {
     background-color: $black;
   }
@@ -459,6 +463,7 @@ html {
   width: 100%;
   cursor: pointer;
   opacity: 0;
+
   &:focus {
     outline: none;
   }

src/preload.ts

@@ -12,6 +12,7 @@ import { StoreData } from "./features/listenbrainz/models/storeData";
 import { Logger } from "./features/logger";
 import { Songwhip } from "./features/songwhip/songwhip";
 import { addCustomCss } from "./features/theming/theming";
+import { convertDurationToSeconds } from "./features/time/parse";
 import { MediaStatus } from "./models/mediaStatus";
 import { Options } from "./models/options";
 import { downloadFile } from "./scripts/download";
@@ -27,6 +28,10 @@ let currentPlayStatus = MediaStatus.paused;
 let currentListenBrainzDelayId: ReturnType<typeof setTimeout>;
 let scrobbleWaitingForDelay = false;
 
+let currentlyPlaying = MediaStatus.paused;
+let currentMediaInfo: Options;
+let currentNotification: Electron.Notification;
+
 const elements = {
   play: '*[data-test="play"]',
   pause: '*[data-test="pause"]',
@@ -45,7 +50,7 @@ const elements = {
   media: '*[data-test="current-media-imagery"]',
   image: "img",
   current: '*[data-test="current-time"]',
-  duration: '*[data-test="duration"]',
+  duration: '*[class^=playbackControlsContainer] *[data-test="duration"]',
   bar: '*[data-test="progress-bar"]',
   footer: "#footerPlayer",
   mediaItem: "[data-type='mediaItem']",
@@ -54,6 +59,7 @@ const elements = {
   album_name_cell: '[class^="album"]',
   tracklist_row: '[data-test="tracklist-row"]',
   volume: '*[data-test="volume"]',
+  favorite: '*[data-test="footer-favorite-button"]',
   /**
    * Get an element from the dom
    * @param {*} key key in elements object to fetch
@@ -131,6 +137,10 @@ const elements = {
     return this.get("volume").getAttribute("aria-checked") === "false"; // it's muted if aria-checked is false
   },
 
+  isFavorite: function () {
+    return this.get("favorite").getAttribute("aria-checked") === "true";
+  },
+
   /**
    * Shorthand function to get the text of a dom element
    * @param {*} key key in elements object to fetch
@@ -208,6 +218,10 @@ function addHotKeys() {
       handleLogout();
     });
 
+    addHotkey("Control+a", function () {
+      elements.click("favorite");
+    });
+
     addHotkey("Control+h", function () {
       elements.click("home");
     });
@@ -292,6 +306,8 @@ function addIPCEventListeners() {
     ipcRenderer.on("globalEvent", (_event, args) => {
       switch (args) {
         case globalEvents.playPause:
+        case globalEvents.play:
+        case globalEvents.pause:
           playPause();
           break;
         case globalEvents.next:
@@ -300,11 +316,14 @@ function addIPCEventListeners() {
         case globalEvents.previous:
           elements.click("previous");
           break;
-        case globalEvents.play:
+        case globalEvents.toggleFavorite:
-          elements.click("play");
+          elements.click("favorite");
           break;
-        case globalEvents.pause:
+        case globalEvents.toggleShuffle:
-          elements.click("pause");
+          elements.click("shuffle");
+          break;
+        case globalEvents.toggleRepeat:
+          elements.click("repeat");
           break;
         default:
           break;
@@ -345,9 +364,16 @@ function convertDuration(duration: string) {
  */
 function updateMediaInfo(options: Options, notify: boolean) {
   if (options) {
+    currentMediaInfo = options;
     ipcRenderer.send(globalEvents.updateInfo, options);
     if (settingsStore.get(settings.notifications) && notify) {
-      new Notification({ title: options.title, body: options.artists, icon: options.icon }).show();
+      if (currentNotification) currentNotification.close();
+      currentNotification = new Notification({
+        title: options.title,
+        body: options.artists,
+        icon: options.icon,
+      });
+      currentNotification.show();
     }
     updateMpris(options);
     updateListenBrainz(options);
@@ -474,23 +500,6 @@ function getTrackID() {
   return window.location;
 }
 
-function updateMediaSession(options: Options) {
-  if ("mediaSession" in navigator) {
-    navigator.mediaSession.metadata = new MediaMetadata({
-      title: options.title,
-      artist: options.artists,
-      album: options.album,
-      artwork: [
-        {
-          src: options.icon,
-          sizes: "640x640",
-          type: "image/png",
-        },
-      ],
-    });
-  }
-}
-
 /**
  * Watch for song changes and update title + notify
  */
@@ -498,59 +507,73 @@ setInterval(function () {
   const title = elements.getText("title");
   const artistsArray = elements.getArtistsArray();
   const artistsString = elements.getArtistsString(artistsArray);
-  skipArtistsIfFoundInSkippedArtistsList(artistsArray);
-
-  const album = elements.getAlbumName();
-  const current = elements.getText("current");
-  const duration = elements.getText("duration");
   const songDashArtistTitle = `${title} - ${artistsString}`;
-  const currentStatus = getCurrentlyPlayingStatus();
-  const options = {
-    title,
-    artists: artistsString,
-    album: album,
-    status: currentStatus,
-    url: getTrackURL(),
-    current,
-    duration,
-    "app-name": appName,
-    image: "",
-    icon: "",
-  };
-
   const titleOrArtistsChanged = currentSong !== songDashArtistTitle;
+  const current = elements.getText("current");
+  const currentStatus = getCurrentlyPlayingStatus();
 
-  // update title, url and play info with new info
+  const playStateChanged = currentStatus != currentlyPlaying;
-  setTitle(songDashArtistTitle);
-  getTrackURL();
-  currentSong = songDashArtistTitle;
-  currentPlayStatus = currentStatus;
 
-  const image = elements.getSongIcon();
+  // update info if song changed or was just paused/resumed
-
+  if (titleOrArtistsChanged || playStateChanged) {
-  new Promise<void>((resolve) => {
+    if (playStateChanged) {
-    if (image.startsWith("http")) {
+      currentlyPlaying = currentStatus;
-      options.image = image;
-      downloadFile(image, notificationPath).then(
-        () => {
-          options.icon = notificationPath;
-          resolve();
-        },
-        () => {
-          // if the image can't be downloaded then continue without it
-          resolve();
-        }
-      );
-    } else {
-      // if the image can't be found on the page continue without it
-      resolve();
     }
-  }).then(() => {
+    skipArtistsIfFoundInSkippedArtistsList(artistsArray);
-    updateMediaInfo(options, titleOrArtistsChanged);
+
-    if (titleOrArtistsChanged) {
+    const album = elements.getAlbumName();
-      updateMediaSession(options);
+    const duration = elements.getText("duration");
-    }
+    const options = {
-  });
+      title,
+      artists: artistsString,
+      album: album,
+      status: currentStatus,
+      url: getTrackURL(),
+      current,
+      currentInSeconds: convertDurationToSeconds(current),
+      duration,
+      durationInSeconds: convertDurationToSeconds(duration),
+      "app-name": appName,
+      image: "",
+      icon: "",
+      favorite: elements.isFavorite(),
+    };
+
+    // update title, url and play info with new info
+    setTitle(songDashArtistTitle);
+    getTrackURL();
+    currentSong = songDashArtistTitle;
+    currentPlayStatus = currentStatus;
+
+    const image = elements.getSongIcon();
+
+    new Promise<void>((resolve) => {
+      if (image.startsWith("http")) {
+        options.image = image;
+        downloadFile(image, notificationPath).then(
+          () => {
+            options.icon = notificationPath;
+            resolve();
+          },
+          () => {
+            // if the image can't be downloaded then continue without it
+            resolve();
+          }
+        );
+      } else {
+        // if the image can't be found on the page continue without it
+        resolve();
+      }
+    }).then(() => {
+      updateMediaInfo(options, titleOrArtistsChanged);
+    });
+  } else {
+    // just update the time
+    updateMediaInfo(
+      { ...currentMediaInfo, ...{ current, currentInSeconds: convertDurationToSeconds(current) } },
+      false
+    );
+  }
 
   /**
    * automatically skip a song if the artists are found in the list of artists to skip

src/scripts/discord.ts

@@ -1,67 +1,85 @@
-import { Client } from "discord-rpc";
+import { Client, Presence } from "discord-rpc";
 import { app, ipcMain } from "electron";
 import { globalEvents } from "../constants/globalEvents";
 import { settings } from "../constants/settings";
 import { Logger } from "../features/logger";
+import { convertDurationToSeconds } from "../features/time/parse";
 import { MediaStatus } from "../models/mediaStatus";
 import { mediaInfo } from "./mediaInfo";
 import { settingsStore } from "./settings";
 
 const clientId = "833617820704440341";
 
-function timeToSeconds(timeArray: string[]) {
-  const minutes = parseInt(timeArray[0]) * 1;
-  const seconds = minutes * 60 + parseInt(timeArray[1]) * 1;
-  return seconds;
-}
-
 export let rpc: Client;
 
 const observer = () => {
-  if (mediaInfo.status === MediaStatus.paused && rpc) {
+  if (rpc) {
-    rpc.setActivity(idleStatus);
+    rpc.setActivity(getActivity());
-  } else if (rpc) {
+  }
-    const currentSeconds = timeToSeconds(mediaInfo.current.split(":"));
+};
-    const durationSeconds = timeToSeconds(mediaInfo.duration.split(":"));
+
-    const date = new Date();
+const defaultPresence = {
-    const now = (date.getTime() / 1000) | 0;
+  largeImageKey: "tidal-hifi-icon",
-    const remaining = date.setSeconds(date.getSeconds() + (durationSeconds - currentSeconds));
+  largeImageText: `TIDAL Hi-Fi ${app.getVersion()}`,
+  instance: false,
+};
+
+const getActivity = (): Presence => {
+  const presence: Presence = { ...defaultPresence };
+
+  if (mediaInfo.status === MediaStatus.paused) {
+    presence.details =
+      settingsStore.get<string, string>(settings.discord.idleText) ?? "Browsing Tidal";
+  } else {
+    const showSong = settingsStore.get<string, boolean>(settings.discord.showSong) ?? false;
+    if (showSong) {
+      const { includeTimestamps, detailsPrefix, buttonText } = getFromStore();
+      includeTimeStamps(includeTimestamps);
+      setPresenceFromMediaInfo(detailsPrefix, buttonText);
+    } else {
+      presence.details =
+        settingsStore.get<string, string>(settings.discord.usingText) ?? "Playing media on TIDAL";
+    }
+  }
+  return presence;
+
+  function getFromStore() {
+    const includeTimestamps =
+      settingsStore.get<string, boolean>(settings.discord.includeTimestamps) ?? true;
     const detailsPrefix =
       settingsStore.get<string, string>(settings.discord.detailsPrefix) ?? "Listening to ";
     const buttonText =
       settingsStore.get<string, string>(settings.discord.buttonText) ?? "Play on TIDAL";
+
+    return { includeTimestamps, detailsPrefix, buttonText };
+  }
+
+  function setPresenceFromMediaInfo(detailsPrefix: string, buttonText: string) {
     if (mediaInfo.url) {
-      rpc.setActivity({
+      presence.details = `${detailsPrefix}${mediaInfo.title}`;
-        ...idleStatus,
+      presence.state = mediaInfo.artists ? mediaInfo.artists : "unknown artist(s)";
-        ...{
+      presence.largeImageKey = mediaInfo.image;
-          details: `${detailsPrefix}${mediaInfo.title}`,
+      if (mediaInfo.album) {
-          state: mediaInfo.artists ? mediaInfo.artists : "unknown artist(s)",
+        presence.largeImageText = mediaInfo.album;
-          startTimestamp: now,
+      }
-          endTimestamp: remaining,
+      presence.buttons = [{ label: buttonText, url: mediaInfo.url }];
-          largeImageKey: mediaInfo.image,
-          largeImageText: mediaInfo.album ? mediaInfo.album : `${idleStatus.largeImageText}`,
-          buttons: [{ label: buttonText, url: mediaInfo.url }],
-        },
-      });
     } else {
-      rpc.setActivity({
+      presence.details = `Watching ${mediaInfo.title}`;
-        ...idleStatus,
+      presence.state = mediaInfo.artists;
-        ...{
-          details: `Watching ${mediaInfo.title}`,
-          state: mediaInfo.artists,
-          startTimestamp: now,
-          endTimestamp: remaining,
-        },
-      });
     }
   }
-};
 
-const idleStatus = {
+  function includeTimeStamps(includeTimestamps: boolean) {
-  details: `Browsing Tidal`,
+    if (includeTimestamps) {
-  largeImageKey: "tidal-hifi-icon",
+      const currentSeconds = convertDurationToSeconds(mediaInfo.current);
-  largeImageText: `TIDAL Hi-Fi ${app.getVersion()}`,
+      const durationSeconds = convertDurationToSeconds(mediaInfo.duration);
-  instance: false,
+      const date = new Date();
+      const now = (date.getTime() / 1000) | 0;
+      const remaining = date.setSeconds(date.getSeconds() + (durationSeconds - currentSeconds));
+      presence.startTimestamp = now;
+      presence.endTimestamp = remaining;
+    }
+  }
 };
 
 /**
@@ -72,7 +90,7 @@ export const initRPC = () => {
   rpc.login({ clientId }).then(
     () => {
       rpc.on("ready", () => {
-        rpc.setActivity(idleStatus);
+        rpc.setActivity(getActivity());
       });
       ipcMain.on(globalEvents.updateInfo, observer);
     },

src/scripts/express.ts

@@ -1,66 +0,0 @@
-import { BrowserWindow, dialog } from "electron";
-import express, { Response } from "express";
-import fs from "fs";
-import { settings } from "../constants/settings";
-import { MediaStatus } from "../models/mediaStatus";
-import { globalEvents } from "./../constants/globalEvents";
-import { mediaInfo } from "./mediaInfo";
-import { settingsStore } from "./settings";
-
-/**
- * Function to enable TIDAL Hi-Fi's express api
- */
-
-// expressModule.run = function (mainWindow)
-export const startExpress = (mainWindow: BrowserWindow) => {
-  /**
-   * Shorthand to handle a fire and forget global event
-   * @param {*} res
-   * @param {*} action
-   */
-  function handleGlobalEvent(res: Response, action: string) {
-    mainWindow.webContents.send("globalEvent", action);
-    res.sendStatus(200);
-  }
-
-  const expressApp = express();
-  expressApp.get("/", (req, res) => res.send("Hello World!"));
-  expressApp.get("/current", (req, res) => res.json({ ...mediaInfo, artist: mediaInfo.artists }));
-  expressApp.get("/image", (req, res) => {
-    const stream = fs.createReadStream(mediaInfo.icon);
-    stream.on("open", function () {
-      res.set("Content-Type", "image/png");
-      stream.pipe(res);
-    });
-    stream.on("error", function () {
-      res.set("Content-Type", "text/plain");
-      res.status(404).end("Not found");
-    });
-  });
-
-  if (settingsStore.get(settings.playBackControl)) {
-    expressApp.get("/play", (req, res) => handleGlobalEvent(res, globalEvents.play));
-    expressApp.get("/pause", (req, res) => handleGlobalEvent(res, globalEvents.pause));
-    expressApp.get("/next", (req, res) => handleGlobalEvent(res, globalEvents.next));
-    expressApp.get("/previous", (req, res) => handleGlobalEvent(res, globalEvents.previous));
-    expressApp.get("/playpause", (req, res) => {
-      if (mediaInfo.status === MediaStatus.playing) {
-        handleGlobalEvent(res, globalEvents.pause);
-      } else {
-        handleGlobalEvent(res, globalEvents.play);
-      }
-    });
-  }
-
-  const port = settingsStore.get<string, number>(settings.apiSettings.port);
-
-  const expressInstance = expressApp.listen(port, "127.0.0.1");
-  expressInstance.on("error", function (e: { code: string }) {
-    let message = e.code;
-    if (e.code === "EADDRINUSE") {
-      message = `Port ${port} in use.`;
-    }
-
-    dialog.showErrorBox("Api failed to start.", message);
-  });
-};

src/scripts/mediaInfo.ts

@@ -9,8 +9,11 @@ export const mediaInfo = {
   status: MediaStatus.paused as string,
   url: "",
   current: "",
+  currentInSeconds: 0,
   duration: "",
+  durationInSeconds: 0,
   image: "tidal-hifi-icon",
+  favorite: false,
 };
 
 export const updateMediaInfo = (arg: MediaInfo) => {
@@ -18,11 +21,14 @@ export const updateMediaInfo = (arg: MediaInfo) => {
   mediaInfo.artists = propOrDefault(arg.artists);
   mediaInfo.album = propOrDefault(arg.album);
   mediaInfo.icon = propOrDefault(arg.icon);
-  mediaInfo.url = propOrDefault(arg.url);
+  mediaInfo.url = toUniversalUrl(propOrDefault(arg.url));
   mediaInfo.status = propOrDefault(arg.status);
   mediaInfo.current = propOrDefault(arg.current);
+  mediaInfo.currentInSeconds = arg.currentInSeconds ?? 0;
   mediaInfo.duration = propOrDefault(arg.duration);
+  mediaInfo.durationInSeconds = arg.durationInSeconds ?? 0;
   mediaInfo.image = propOrDefault(arg.image);
+  mediaInfo.favorite = arg.favorite;
 };
 
 /**
@@ -31,5 +37,18 @@ export const updateMediaInfo = (arg: MediaInfo) => {
  * @param {*} defaultValue defaults to ""
  */
 function propOrDefault(prop: string, defaultValue = "") {
-  return prop ? prop : defaultValue;
+  return prop || defaultValue;
+}
+
+/**
+ * Append the universal link syntax (?u) to any url
+ * @param url url to append the universal link syntax to
+ * @returns url with `?u` appended, or the original value of url if falsy
+ */
+function toUniversalUrl(url: string) {
+  if (url) {
+    const queryParamsSet = url.indexOf("?");
+    return queryParamsSet > -1 ? `${url}&u` : `${url}?u`;
+  }
+  return url;
 }

src/scripts/settings.ts

@@ -1,10 +1,29 @@
 import Store from "electron-store";
 
-import { BrowserWindow } from "electron";
+import { BrowserWindow, shell } from "electron";
 import path from "path";
 import { settings } from "../constants/settings";
 
 let settingsWindow: BrowserWindow;
+/**
+ * Build a migration step for several settings.
+ * All settings will be checked and set to the default if non-existent.
+ * @param version
+ * @param migrationStore
+ * @param options
+ */
+const buildMigration = (
+  version: string,
+  migrationStore: { get: (str: string) => string; set: (str: string, val: unknown) => void },
+  options: Array<{ key: string; value: unknown }>
+) => {
+  console.log(`running migrations for ${version}`);
+  options.forEach(({ key, value }) => {
+    const valueToSet = migrationStore.get(key) ?? value;
+    console.log(`  - setting ${key} to ${value}`);
+    migrationStore.set(key, valueToSet);
+  });
+};
 
 export const settingsStore = new Store({
   defaults: {
@@ -19,6 +38,10 @@ export const settingsStore = new Store({
     enableCustomHotkeys: false,
     enableDiscord: false,
     discord: {
+      showSong: true,
+      idleText: "Browsing Tidal",
+      usingText: "Playing media on TIDAL",
+      includeTimestamps: true,
       detailsPrefix: "Listening to ",
       buttonText: "Play on Tidal",
     },
@@ -61,6 +84,23 @@ export const settingsStore = new Store({
         migrationStore.get(settings.ListenBrainz.delay) ?? 5000
       );
     },
+    "5.8.0": (migrationStore) => {
+      console.log("running migrations for 5.8.0");
+      migrationStore.set(
+        settings.discord.includeTimestamps,
+        migrationStore.get(settings.discord.includeTimestamps) ?? true
+      );
+    },
+    "5.9.0": (migrationStore) => {
+      buildMigration("5.9.0", migrationStore, [
+        { key: settings.discord.showSong, value: "true" },
+        { key: settings.discord.idleText, value: "Browsing Tidal" },
+        {
+          key: settings.discord.usingText,
+          value: "Playing media on TIDAL",
+        },
+      ]);
+    },
   },
 });
 
@@ -94,10 +134,18 @@ export const createSettingsWindow = function () {
 
   settingsWindow.loadURL(`file://${__dirname}/../pages/settings/settings.html`);
 
+  settingsWindow.webContents.setWindowOpenHandler(({ url }) => {
+    shell.openExternal(url);
+    return { action: "deny" };
+  });
   settingsModule.settingsWindow = settingsWindow;
 };
 
 export const showSettingsWindow = function (tab = "general") {
+  if (!settingsWindow) {
+    console.log("Settings window is not initialized. Attempting to create it.");
+    createSettingsWindow();
+  }
   settingsWindow.webContents.send("goToTab", tab);
 
   // refresh data just before showing the window