Merge pull request #1117 from th-ch/release-1-20

Bump version to 1.20.0

.gitattributes

@@ -1,2 +1,2 @@
-* text=auto
-*.js text eol=lf
+* text=auto eol=lf
+*.js text

.github/workflows/build.yml

@@ -1,7 +1,12 @@
 name: Build YouTube Music
 
 on:
-  - push
+  push:
+    branches: [ master ]
+  pull_request:
+
+env:
+  NODE_VERSION: "16.x"
 
 jobs:
   build:
@@ -13,50 +18,189 @@ jobs:
         os: [macos-latest, ubuntu-latest, windows-latest]
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Setup NodeJS
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: "12.x"
+          node-version: ${{ env.NODE_VERSION }}
 
-      - name: Get yarn cache directory path
-        id: yarn-cache-dir-path
-        run: echo "::set-output name=dir::$(yarn cache dir)"
+      - name: Expose yarn config as "$GITHUB_OUTPUT"
+        id: yarn-config
+        shell: bash
+        run: |
+          echo "CACHE_FOLDER=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT
 
-      - uses: actions/cache@v2
-        id: yarn-cache
+      # Yarn rotates the downloaded cache archives, @see https://github.com/actions/setup-node/issues/325
+      # Yarn cache is also reusable between arch and os.
+      - name: Restore yarn cache
+        uses: actions/cache@v3
+        id: yarn-download-cache
         with:
-          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          path: ${{ steps.yarn-config.outputs.CACHE_FOLDER }}
+          key: yarn-download-cache-${{ hashFiles('yarn.lock') }}
           restore-keys: |
-            ${{ runner.os }}-yarn-
+            yarn-download-cache-
+
+      # Invalidated on yarn.lock changes
+      - name: Restore yarn install state
+        id: yarn-install-state-cache
+        uses: actions/cache@v3
+        with:
+          path: .yarn/ci-cache/
+          key: ${{ runner.os }}-yarn-install-state-cache-${{ hashFiles('yarn.lock', '.yarnrc.yml') }}
 
       - name: Install dependencies
-        run: yarn --frozen-lockfile
+        shell: bash
+        run: |
+          yarn install --immutable --inline-builds
+        env:
+          # CI optimizations. Overrides yarnrc.yml options (or their defaults) in the CI action.
+          YARN_ENABLE_GLOBAL_CACHE: "false" # Use local cache folder to keep downloaded archives
+          YARN_NM_MODE: "hardlinks-local" # Hardlinks-(local|global) reduces io / node_modules size
+          YARN_INSTALL_STATE_PATH: .yarn/ci-cache/install-state.gz # Very small speedup when lock does not change
 
       - name: Test
         uses: GabrielBB/xvfb-action@v1
+        env:
+          PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
         with:
           run: yarn test
 
-      - name: Build on Mac
-        if: startsWith(matrix.os, 'macOS')
+      # Build and release if it's the main repository
+      - name: Build and release on Mac
+        if: startsWith(matrix.os, 'macOS') && github.repository == 'th-ch/youtube-music'
         env:
           GH_TOKEN: ${{ secrets.GH_TOKEN }}
         run: |
           yarn run release:mac
 
-      - name: Build on Linux
-        if: startsWith(matrix.os, 'ubuntu')
+      - name: Build and release on Linux
+        if: startsWith(matrix.os, 'ubuntu') && github.repository == 'th-ch/youtube-music'
         env:
           GH_TOKEN: ${{ secrets.GH_TOKEN }}
         run: |
           yarn run release:linux
 
-      - name: Build on Windows
-        if: startsWith(matrix.os, 'windows')
+      - name: Build and release on Windows
+        if: startsWith(matrix.os, 'windows') && github.repository == 'th-ch/youtube-music'
         env:
           GH_TOKEN: ${{ secrets.GH_TOKEN }}
         run: |
           yarn run release:win
+
+      # Only build without release if it is a fork
+      - name: Build on Mac
+        if: startsWith(matrix.os, 'macOS') && github.repository != 'th-ch/youtube-music'
+        run: |
+          yarn run build:mac
+
+      - name: Build on Linux
+        if: startsWith(matrix.os, 'ubuntu') && github.repository != 'th-ch/youtube-music'
+        run: |
+          yarn run build:linux
+
+      - name: Build on Windows
+        if: startsWith(matrix.os, 'windows') && github.repository != 'th-ch/youtube-music'
+        run: |
+          yarn run build:win
+
+  release:
+    runs-on: ubuntu-latest
+    name: Release YouTube Music
+    if: github.repository == 'th-ch/youtube-music' && github.ref == 'refs/heads/master'
+    needs: build
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Setup NodeJS
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Expose yarn config as "$GITHUB_OUTPUT"
+        id: yarn-config
+        shell: bash
+        run: |
+          echo "CACHE_FOLDER=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT
+
+      # Yarn rotates the downloaded cache archives, @see https://github.com/actions/setup-node/issues/325
+      # Yarn cache is also reusable between arch and os.
+      - name: Restore yarn cache
+        uses: actions/cache@v3
+        id: yarn-download-cache
+        with:
+          path: ${{ steps.yarn-config.outputs.CACHE_FOLDER }}
+          key: yarn-download-cache-${{ hashFiles('yarn.lock') }}
+          restore-keys: |
+            yarn-download-cache-
+
+      # Invalidated on yarn.lock changes
+      - name: Restore yarn install state
+        id: yarn-install-state-cache
+        uses: actions/cache@v3
+        with:
+          path: .yarn/ci-cache/
+          key: ${{ runner.os }}-yarn-install-state-cache-${{ hashFiles('yarn.lock', '.yarnrc.yml') }}
+
+      - name: Install dependencies
+        shell: bash
+        run: |
+          yarn install --immutable --inline-builds
+        env:
+          # CI optimizations. Overrides yarnrc.yml options (or their defaults) in the CI action.
+          YARN_ENABLE_GLOBAL_CACHE: "false" # Use local cache folder to keep downloaded archives
+          YARN_NM_MODE: "hardlinks-local" # Hardlinks-(local|global) reduces io / node_modules size
+          YARN_INSTALL_STATE_PATH: .yarn/ci-cache/install-state.gz # Very small speedup when lock does not change
+
+      - name: Get version
+        run: |
+          echo "VERSION_TAG=v$(node -pe "require('./package.json').version")" >> $GITHUB_ENV
+
+      - name: Check if version already exists in tags
+        run: |
+          echo "VERSION_HASH=$(git rev-parse -q --verify 'refs/tags/${{ env.VERSION_TAG }}')" >> $GITHUB_ENV
+          echo "CHANGELOG_ANCHOR=$(echo $VERSION_TAG | sed -e 's/\.//g')" >> $GITHUB_ENV
+
+      - name: Fetch draft release
+        if: ${{ env.VERSION_HASH == '' }}
+        uses: cardinalby/git-get-release-action@v1
+        id: get_draft_release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+        with:
+          latest: true
+          draft: true
+          searchLimit: 1
+
+      - name: Publish Release (if it does not exist)
+        if: ${{ env.VERSION_HASH == '' }}
+        uses: irongut/EditRelease@v1.2.0
+        with:
+          token: ${{ secrets.GH_TOKEN }}
+          id: ${{ steps.get_draft_release.outputs.id }}
+          draft: false
+          prerelease: false
+          replacename: true
+          name: ${{ env.VERSION_TAG }}
+          replacebody: true
+          body: |
+            See [changelog](https://github.com/th-ch/youtube-music/blob/master/changelog.md#${{ env.CHANGELOG_ANCHOR }}) for the list of updates and the full diff.
+
+            Thanks to all contributors! 🏅
+
+      - name: Update changelog
+        if: ${{ env.VERSION_HASH == '' }}
+        run: |
+          yarn changelog
+
+      - name: Commit changelog
+        if: ${{ env.VERSION_HASH == '' }}
+        uses: stefanzweifel/git-auto-commit-action@v4
+        with:
+          commit_message: Update changelog for ${{ env.VERSION_TAG }}
+          file_pattern: "changelog.md"
+          commit_user_name: CI
+          commit_user_email: th-ch@users.noreply.github.com

.github/workflows/dependency-review.yml

@@ -0,0 +1,20 @@
+# Dependency Review Action
+#
+# This Action will scan dependency manifest files that change as part of a Pull Reqest, surfacing known-vulnerable versions of the packages declared or updated in the PR. Once installed, if the workflow run is marked as required, PRs introducing known-vulnerable packages will be blocked from merging.
+#
+# Source repository: https://github.com/actions/dependency-review-action
+# Public documentation: https://docs.github.com/en/code-security/supply-chain-security/understanding-your-software-supply-chain/about-dependency-review#dependency-review-enforcement
+name: "Dependency Review"
+on: [pull_request]
+
+permissions:
+  contents: read
+
+jobs:
+  dependency-review:
+    runs-on: ubuntu-latest
+    steps:
+      - name: "Checkout Repository"
+        uses: actions/checkout@v3
+      - name: "Dependency Review"
+        uses: actions/dependency-review-action@v3

.github/workflows/winget-submission.yml

@@ -0,0 +1,26 @@
+name: Submit to Windows Package Manager Community Repository
+
+on:
+  release:
+    types: [released]
+  workflow_dispatch:
+    inputs:
+      tag_name:
+        description: "Specific tag name"
+        required: true
+        type: string
+
+jobs:
+  winget:
+    name: Publish winget package
+    runs-on: windows-latest
+    steps:
+      - name: Submit package to Windows Package Manager Community Repository
+        uses: vedantmgoyal2009/winget-releaser@v2
+        with:
+          identifier: th-ch.YouTubeMusic
+          installers-regex: '^YouTube-Music-Setup-[\d\.]+\.exe$'
+          version: ${{ inputs.tag_name || github.event.release.tag_name }}
+          release-tag: ${{ inputs.tag_name || github.event.release.tag_name }}
+          token: ${{ secrets.WINGET_ACC_TOKEN }}
+          fork-user: youtube-music-winget

.gitignore

@@ -1,4 +1,13 @@
 node_modules
 /dist
-/assets/generated
 electron-builder.yml
+.vscode/settings.json
+.idea
+
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions

.yarn/patches/electron-is-dev-npm-2.0.0-9d41637d91.patch

@@ -0,0 +1,24 @@
+diff --git a/index.js b/index.js
+index c8f2fd4467c11b484fe654f7f250e2ba37e8100d..c9ae1ed3d3c7683b14dfe0eee801f5a07585d2aa 100644
+--- a/index.js
++++ b/index.js
+@@ -5,7 +5,16 @@ if (typeof electron === 'string') {
+ 	throw new TypeError('Not running in an Electron environment!');
+ }
+ 
+-const isEnvSet = 'ELECTRON_IS_DEV' in process.env;
+-const getFromEnv = Number.parseInt(process.env.ELECTRON_IS_DEV, 10) === 1;
++const isDev = () => {
++	if ('ELECTRON_IS_DEV' in process.env) {
++		return Number.parseInt(process.env.ELECTRON_IS_DEV, 10) === 1;
++	}
+ 
+-module.exports = isEnvSet ? getFromEnv : !electron.app.isPackaged;
++	if (process.type === 'browser') {
++		return !electron.app.isPackaged;
++	}
++
++	return 'npm_package_name' in process.env;
++};
++
++module.exports = isDev();

.yarn/plugins/@yarnpkg/plugin-after-install.cjs

@@ -0,0 +1,9 @@
+/* eslint-disable */
+//prettier-ignore
+module.exports = {
+name: "@yarnpkg/plugin-after-install",
+factory: function (require) {
+var plugin=(()=>{var g=Object.create,r=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var I=t=>r(t,"__esModule",{value:!0});var i=t=>{if(typeof require!="undefined")return require(t);throw new Error('Dynamic require of "'+t+'" is not supported')};var h=(t,o)=>{for(var e in o)r(t,e,{get:o[e],enumerable:!0})},w=(t,o,e)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of C(o))!y.call(t,n)&&n!=="default"&&r(t,n,{get:()=>o[n],enumerable:!(e=x(o,n))||e.enumerable});return t},a=t=>w(I(r(t!=null?g(k(t)):{},"default",t&&t.__esModule&&"default"in t?{get:()=>t.default,enumerable:!0}:{value:t,enumerable:!0})),t);var j={};h(j,{default:()=>b});var c=a(i("@yarnpkg/core")),m={afterInstall:{description:"Hook that will always run after install",type:c.SettingsType.STRING,default:""}};var u=a(i("clipanion")),d=a(i("@yarnpkg/core"));var p=a(i("@yarnpkg/shell")),l=async(t,o)=>{var f;let e=t.get("afterInstall"),n=!!((f=t.projectCwd)==null?void 0:f.endsWith(`dlx-${process.pid}`));return e&&!n?(o&&console.log("Running `afterInstall` hook..."),(0,p.execute)(e,[],{cwd:t.projectCwd||void 0})):0};var s=class extends u.Command{async execute(){let o=await d.Configuration.find(this.context.cwd,this.context.plugins);return l(o,!1)}};s.paths=[["after-install"]];var P={configuration:m,commands:[s],hooks:{afterAllInstalled:async t=>{if(await l(t.configuration,!0))throw new Error("The `afterInstall` hook failed, see output above.")}}},b=P;return j;})();
+return plugin;
+}
+};

.yarnrc.yml

@@ -0,0 +1,9 @@
+afterInstall: yarn postinstall
+
+nodeLinker: node-modules
+
+plugins:
+  - path: .yarn/plugins/@yarnpkg/plugin-after-install.cjs
+    spec: "https://raw.githubusercontent.com/mhassan1/yarn-plugin-after-install/v0.3.1/bundles/@yarnpkg/plugin-after-install.js"
+
+yarnPath: .yarn/releases/yarn-3.4.1.cjs

changelog.md

@@ -0,0 +1,599 @@
+### Changelog
+
+All notable changes to this project will be documented in this file. Dates are displayed in UTC.
+
+#### [v1.19.0](https://github.com/th-ch/youtube-music/compare/v1.18.0...v1.19.0)
+
+- Automatic release by CI when version is updated [`#936`](https://github.com/th-ch/youtube-music/pull/936)
+- Center toggle of video-toggle [`#894`](https://github.com/th-ch/youtube-music/pull/894)
+- Load plugins as soon as the window is created [`#890`](https://github.com/th-ch/youtube-music/pull/890)
+- Bump qs from 6.5.2 to 6.5.3 [`#913`](https://github.com/th-ch/youtube-music/pull/913)
+- [Snyk] Upgrade custom-electron-titlebar from 4.1.1 to 4.1.2 [`#900`](https://github.com/th-ch/youtube-music/pull/900)
+- Add option in skip-silences plugin to only skip at the beginning [`#931`](https://github.com/th-ch/youtube-music/pull/931)
+- Replace rimraf by del-cli [`#932`](https://github.com/th-ch/youtube-music/pull/932)
+- docs: Added winget install instructions [`#873`](https://github.com/th-ch/youtube-music/pull/873)
+- [Snyk] Upgrade async-mutex from 0.3.2 to 0.4.0 [`#855`](https://github.com/th-ch/youtube-music/pull/855)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.25.0 to 1.25.1 [`#856`](https://github.com/th-ch/youtube-music/pull/856)
+- [Snyk] Upgrade custom-electron-titlebar from 4.1.0 to 4.1.1 [`#865`](https://github.com/th-ch/youtube-music/pull/865)
+- [Snyk] Upgrade @ffmpeg/ffmpeg from 0.11.5 to 0.11.6 [`#876`](https://github.com/th-ch/youtube-music/pull/876)
+- Discord Plugin RPC Fix [`#888`](https://github.com/th-ch/youtube-music/pull/888)
+- Bump FFMpeg [`#854`](https://github.com/th-ch/youtube-music/pull/854)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.23.8 to 1.23.9 [`#823`](https://github.com/th-ch/youtube-music/pull/823)
+- [Snyk] Upgrade electron-store from 8.0.2 to 8.1.0 [`#801`](https://github.com/th-ch/youtube-music/pull/801)
+- proposal: Adding an option to hide duration before the song ends [`#802`](https://github.com/th-ch/youtube-music/pull/802)
+- [Snyk] Security upgrade node-fetch from 2.6.7 to 3.2.10 [`#790`](https://github.com/th-ch/youtube-music/pull/790)
+- Update README.md with a new theme repo [`#807`](https://github.com/th-ch/youtube-music/pull/807)
+- Fix likes on touchbar (they were inverted) [`#822`](https://github.com/th-ch/youtube-music/pull/822)
+- Add Scoop install directions for Windows 🪟 [`#839`](https://github.com/th-ch/youtube-music/pull/839)
+- Bump version and change release type when publishing a new version [`31ab27c`](https://github.com/th-ch/youtube-music/commit/31ab27c39ff6319116a6514d952eed1f02dd45fd)
+- Lock node-fetch to v2 for commonJS [`c9f610f`](https://github.com/th-ch/youtube-music/commit/c9f610f7fcfcce1317338364045ab0e1bf4249a4)
+- fix: upgrade @cliqz/adblocker-electron from 1.25.0 to 1.25.1 [`762ef4e`](https://github.com/th-ch/youtube-music/commit/762ef4eede29b53aae912b3b50a1ca53f6765c53)
+
+#### [v1.18.0](https://github.com/th-ch/youtube-music/compare/v1.17.0...v1.18.0)
+
+> 5 September 2022
+
+- Bump ytdl-core (bug fix) [`#816`](https://github.com/th-ch/youtube-music/pull/816)
+- Bump electron and fix tests in CI [`#813`](https://github.com/th-ch/youtube-music/pull/813)
+- Allow user to pass custom CSS file [`#800`](https://github.com/th-ch/youtube-music/pull/800)
+- [Snyk] Upgrade html-to-text from 8.2.0 to 8.2.1 [`#799`](https://github.com/th-ch/youtube-music/pull/799)
+- [Snyk] Upgrade electron-store from 8.0.1 to 8.0.2 [`#772`](https://github.com/th-ch/youtube-music/pull/772)
+- Bump jpeg-js from 0.4.3 to 0.4.4 [`#756`](https://github.com/th-ch/youtube-music/pull/756)
+- Support MPRIS loop and volume change [`#749`](https://github.com/th-ch/youtube-music/pull/749)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.23.7 to 1.23.8 [`#742`](https://github.com/th-ch/youtube-music/pull/742)
+- Use ; instead of space for play/pause. [`#745`](https://github.com/th-ch/youtube-music/pull/745)
+- Update readme.md [`#750`](https://github.com/th-ch/youtube-music/pull/750)
+- fix lyrics font size [`#753`](https://github.com/th-ch/youtube-music/pull/753)
+- fix top gap between nav-bar and browse-page [`#734`](https://github.com/th-ch/youtube-music/pull/734)
+- migrate from remote to ipc + fix restart in portable app [`#605`](https://github.com/th-ch/youtube-music/pull/605)
+- [Snyk] Upgrade custom-electron-prompt from 1.4.2 to 1.5.0 [`#717`](https://github.com/th-ch/youtube-music/pull/717)
+- Picture in Picture v2 [`#685`](https://github.com/th-ch/youtube-music/pull/685)
+- Add MPRIS volume control [`#776`](https://github.com/th-ch/youtube-music/issues/776)
+- Remove jest [`bb6115f`](https://github.com/th-ch/youtube-music/commit/bb6115fec1a18a416edb365a442eb0b0ee330768)
+- migrate from remote to ipc [`5bd9768`](https://github.com/th-ch/youtube-music/commit/5bd97685b9e07c656e0b57a9e02819afc70af1b1)
+- v3 [`d23bfe9`](https://github.com/th-ch/youtube-music/commit/d23bfe936840b947ca101fd304464f65d36e88cc)
+
+#### [v1.17.0](https://github.com/th-ch/youtube-music/compare/v1.16.0...v1.17.0)
+
+> 16 May 2022
+
+- Bump ejs from 3.1.6 to 3.1.7 [`#712`](https://github.com/th-ch/youtube-music/pull/712)
+- fix injectCSS `did-finish-load` listener overload [`#693`](https://github.com/th-ch/youtube-music/pull/693)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.23.6 to 1.23.7 [`#689`](https://github.com/th-ch/youtube-music/pull/689)
+- [Snyk] Upgrade custom-electron-prompt from 1.4.1 to 1.4.2 [`#686`](https://github.com/th-ch/youtube-music/pull/686)
+- [Snyk] Upgrade @electron/remote from 2.0.7 to 2.0.8 [`#684`](https://github.com/th-ch/youtube-music/pull/684)
+- Improve plugin submenu ux [`#699`](https://github.com/th-ch/youtube-music/pull/699)
+- update build action [`#702`](https://github.com/th-ch/youtube-music/pull/702)
+- add different modes to video-toggle plugin [`#700`](https://github.com/th-ch/youtube-music/pull/700)
+- lint [`#701`](https://github.com/th-ch/youtube-music/pull/701)
+- [ImgBot] Optimize images [`#703`](https://github.com/th-ch/youtube-music/pull/703)
+- add album to lastfm if available [`#695`](https://github.com/th-ch/youtube-music/pull/695)
+- [in-app-menu] add hide icon option [`#680`](https://github.com/th-ch/youtube-music/pull/680)
+- Add plugin to bypass age restrictions [`#682`](https://github.com/th-ch/youtube-music/pull/682)
+- Add "Picture in picture" plugin [`#674`](https://github.com/th-ch/youtube-music/pull/674)
+- Set lyrics metadata from Genius [`#679`](https://github.com/th-ch/youtube-music/pull/679)
+- MacOS: bring back the app in dock when using tray + app hidden [`#677`](https://github.com/th-ch/youtube-music/pull/677)
+- [Snyk] Upgrade @electron/remote from 2.0.4 to 2.0.5 [`#644`](https://github.com/th-ch/youtube-music/pull/644)
+- [Snyk] Upgrade ytpl from 2.2.3 to 2.3.0 [`#660`](https://github.com/th-ch/youtube-music/pull/660)
+- [Snyk] Upgrade ytdl-core from 4.10.1 to 4.11.0 [`#659`](https://github.com/th-ch/youtube-music/pull/659)
+- Bump plist from 3.0.2 to 3.0.5 [`#678`](https://github.com/th-ch/youtube-music/pull/678)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.23.4 to 1.23.5 [`#624`](https://github.com/th-ch/youtube-music/pull/624)
+- [Precise-Volume] fix volumeHud position in miniplayer [`#645`](https://github.com/th-ch/youtube-music/pull/645)
+- add always-on-top option [`#655`](https://github.com/th-ch/youtube-music/pull/655)
+- [precise-volume] fix expand-volume-slider not updating its value [`#670`](https://github.com/th-ch/youtube-music/pull/670)
+- Fix lyrics genius missing parts [`#671`](https://github.com/th-ch/youtube-music/pull/671)
+- feat: option to force show like buttons [`#673`](https://github.com/th-ch/youtube-music/pull/673)
+- fix custom titlebar in prompt options [`#619`](https://github.com/th-ch/youtube-music/pull/619)
+- Process lyrics HTML in Genius util [`d0532d6`](https://github.com/th-ch/youtube-music/commit/d0532d691e56f955ef0b41f5fe2efe6295dddf9e)
+- Create first version of picture in picture plugin [`d2265b5`](https://github.com/th-ch/youtube-music/commit/d2265b59d78143cf51fe4dc3d5dee9da66873cc1)
+- Bump electron-builder to fix Mac build script [`ae8365f`](https://github.com/th-ch/youtube-music/commit/ae8365f721eafda6c502d02eee86d098f2b9e2a1)
+
+#### [v1.16.0](https://github.com/th-ch/youtube-music/compare/v1.15.0...v1.16.0)
+
+> 20 February 2022
+
+- update in-app-menu [`#596`](https://github.com/th-ch/youtube-music/pull/596)
+- Fix clientID [`#602`](https://github.com/th-ch/youtube-music/pull/602)
+- Add snoretoast custom compile script [`#600`](https://github.com/th-ch/youtube-music/pull/600)
+- fix interactive notifications icon + exclude platform specific plugins from build [`#591`](https://github.com/th-ch/youtube-music/pull/591)
+- Add album title to largeImage and change paused icon [`#587`](https://github.com/th-ch/youtube-music/pull/587)
+- make useragent override optional [`#595`](https://github.com/th-ch/youtube-music/pull/595)
+- get album name from DOM [`#588`](https://github.com/th-ch/youtube-music/pull/588)
+- fix various lyrics issues [`#584`](https://github.com/th-ch/youtube-music/pull/584)
+- discord set inactivity timeout prompt [`#580`](https://github.com/th-ch/youtube-music/pull/580)
+- add single instance lock option [`#578`](https://github.com/th-ch/youtube-music/pull/578)
+- fix "restart app on config change" option [`#561`](https://github.com/th-ch/youtube-music/pull/561)
+- fix window position save spam [`#562`](https://github.com/th-ch/youtube-music/pull/562)
+- load adblocker sooner [`#583`](https://github.com/th-ch/youtube-music/pull/583)
+- add description of new plugins to readme [`#585`](https://github.com/th-ch/youtube-music/pull/585)
+- Use `center` alignment for lyrics text [`#573`](https://github.com/th-ch/youtube-music/pull/573)
+- fix precise-volume hud positioning [`#567`](https://github.com/th-ch/youtube-music/pull/567)
+- update electron and dependencies [`#565`](https://github.com/th-ch/youtube-music/pull/565)
+- filenamify playlist folder name [`#557`](https://github.com/th-ch/youtube-music/pull/557)
+- [Snyk] Security upgrade node-fetch from 2.6.6 to 2.6.7 (3.1.1 incompatible) [`#554`](https://github.com/th-ch/youtube-music/pull/554)
+- fix app starting offscreen [`#548`](https://github.com/th-ch/youtube-music/pull/548)
+- Release Mac arm64 [`#566`](https://github.com/th-ch/youtube-music/pull/566)
+- Build command for Apple (m1) silicon macs  [`#553`](https://github.com/th-ch/youtube-music/pull/553)
+- [Snyk] Upgrade custom-electron-titlebar from 3.2.9 to 3.2.10 [`#545`](https://github.com/th-ch/youtube-music/pull/545)
+- Fix duplicate media session on linux [`#551`](https://github.com/th-ch/youtube-music/pull/551)
+- show a badge remaining items when downloading a playlist [`#550`](https://github.com/th-ch/youtube-music/pull/550)
+- allow downloading playlists from popup menu [`#549`](https://github.com/th-ch/youtube-music/pull/549)
+- xesam:artist should be a list [`#539`](https://github.com/th-ch/youtube-music/pull/539)
+- fix notifications showing thumbnail of last song [`#537`](https://github.com/th-ch/youtube-music/pull/537)
+- Fix https://github.com/th-ch/youtube-music/pull/578#issuecomment-1035517531 [`#578`](https://github.com/th-ch/youtube-music/pull/578)
+- Add automatic changelog [`1d9bfe8`](https://github.com/th-ch/youtube-music/commit/1d9bfe8ac8869cde648164979986964baa52c2f9)
+- update electron to v17.0.0 [`fef7115`](https://github.com/th-ch/youtube-music/commit/fef711549fa9862f8ea23301edde747c5802e352)
+- update dependencies [`8be07bc`](https://github.com/th-ch/youtube-music/commit/8be07bcb7ad8b727d97c36aa0760aed4e2fc481f)
+
+#### [v1.15.0](https://github.com/th-ch/youtube-music/compare/v1.14.0...v1.15.0)
+
+> 30 December 2021
+
+- Switch from spectron to playwright to fix tests [`#531`](https://github.com/th-ch/youtube-music/pull/531)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.23.0 to 1.23.1 [`#529`](https://github.com/th-ch/youtube-music/pull/529)
+- fix precise-volume options sync [`#525`](https://github.com/th-ch/youtube-music/pull/525)
+- Add album art/thumbnail to discord activity [`#524`](https://github.com/th-ch/youtube-music/pull/524)
+- fix skip-silences plugin [`#521`](https://github.com/th-ch/youtube-music/pull/521)
+- [Snyk] Upgrade electron-updater from 4.6.2 to 4.6.3 [`#520`](https://github.com/th-ch/youtube-music/pull/520)
+- update electron & remote & user agents [`#515`](https://github.com/th-ch/youtube-music/pull/515)
+- fixes mpris bug in snap [`#513`](https://github.com/th-ch/youtube-music/pull/513)
+- Add "Skip silences" plugin [`#519`](https://github.com/th-ch/youtube-music/pull/519)
+- Aligned lyric design [`#510`](https://github.com/th-ch/youtube-music/pull/510)
+- Fix mpris bugs - follows #480 [`#509`](https://github.com/th-ch/youtube-music/pull/509)
+- Various small fixes (discord, video-toggle, precise-volume, playback-speed, shortcuts, lyrics) [`#476`](https://github.com/th-ch/youtube-music/pull/476)
+- Mpris + obs-tuna fixes [`#480`](https://github.com/th-ch/youtube-music/pull/480)
+- [Snyk] Upgrade node-fetch from 2.6.5 to 2.6.6 [`#498`](https://github.com/th-ch/youtube-music/pull/498)
+- fix interaction between blur navbar & in-app-menu [`#491`](https://github.com/th-ch/youtube-music/pull/491)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.22.7 to 1.23.0 [`#475`](https://github.com/th-ch/youtube-music/pull/475)
+- New Plugin: Exponential Volume [`#488`](https://github.com/th-ch/youtube-music/pull/488)
+- [Snyk] Upgrade electron-updater from 4.6.0 to 4.6.1 [`#474`](https://github.com/th-ch/youtube-music/pull/474)
+- Fix loadeddata/metadata video events rarely not firing (+other small fixes) [`#477`](https://github.com/th-ch/youtube-music/pull/477)
+- fix #490 [`#490`](https://github.com/th-ch/youtube-music/issues/490)
+- fix #472 [`#472`](https://github.com/th-ch/youtube-music/issues/472)
+- fix mpris [`ccfe743`](https://github.com/th-ch/youtube-music/commit/ccfe7434bf708ee58156c2952234a049706edfc2)
+- lint [`4362101`](https://github.com/th-ch/youtube-music/commit/4362101c0a2ebb7f0536f615cecba8a55ac96702)
+- rework songInfo pause listener [`6726e26`](https://github.com/th-ch/youtube-music/commit/6726e2600b3ca3a8d68e3e1b95b50da211fa354d)
+
+#### [v1.14.0](https://github.com/th-ch/youtube-music/compare/v1.13.0...v1.14.0)
+
+> 7 November 2021
+
+- [Snyk] Upgrade custom-electron-prompt from 1.1.0 to 1.2.0 [`#467`](https://github.com/th-ch/youtube-music/pull/467)
+- Video Toggle Plugin [`#448`](https://github.com/th-ch/youtube-music/pull/448)
+- fix playback speed plugin [`#462`](https://github.com/th-ch/youtube-music/pull/462)
+- Fix sponsorblock skipping when not needed [`#465`](https://github.com/th-ch/youtube-music/pull/465)
+- Sponsorblock fix + use new apiLoaded event [`#463`](https://github.com/th-ch/youtube-music/pull/463)
+- use apiLoaded event in audio-compressor plugin [`#458`](https://github.com/th-ch/youtube-music/pull/458)
+- alert on initial hide-menu enabled [`#456`](https://github.com/th-ch/youtube-music/pull/456)
+- Blur plugin tweaks and integration with in-app-menu [`#451`](https://github.com/th-ch/youtube-music/pull/451)
+- set resume on start url to songInfo.url [`#449`](https://github.com/th-ch/youtube-music/pull/449)
+- quality-changer-plugin [`#446`](https://github.com/th-ch/youtube-music/pull/446)
+- get songInfo from youtube API [`#443`](https://github.com/th-ch/youtube-music/pull/443)
+- New plugin: Blur navigation bar [`#442`](https://github.com/th-ch/youtube-music/pull/442)
+- Discord plugin: Clean Up Export (follow-up #380) [`#440`](https://github.com/th-ch/youtube-music/pull/440)
+- remove upgrade button + makes images unselectable [`#434`](https://github.com/th-ch/youtube-music/pull/434)
+- new auto confirm when paused [`#433`](https://github.com/th-ch/youtube-music/pull/433)
+- fix: mpris instance not registering itself and media controls [`#431`](https://github.com/th-ch/youtube-music/pull/431)
+- Audio compressor plugin [`#288`](https://github.com/th-ch/youtube-music/pull/288)
+- precise-volume plugin fixes & updates [`#275`](https://github.com/th-ch/youtube-music/pull/275)
+- Custom Prompt for changing options [`#243`](https://github.com/th-ch/youtube-music/pull/243)
+- [Snyk] Upgrade async-mutex from 0.3.1 to 0.3.2 [`#412`](https://github.com/th-ch/youtube-music/pull/412)
+- build(deps): bump tmpl from 1.0.4 to 1.0.5 [`#414`](https://github.com/th-ch/youtube-music/pull/414)
+- [Snyk] Upgrade node-fetch from 2.6.1 to 2.6.2 [`#416`](https://github.com/th-ch/youtube-music/pull/416)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.22.5 to 1.22.6 [`#429`](https://github.com/th-ch/youtube-music/pull/429)
+- build(deps-dev): bump electron from 12.0.8 to 12.1.0 [`#430`](https://github.com/th-ch/youtube-music/pull/430)
+- Fix discord clearActivity, menu, listen along option [`#380`](https://github.com/th-ch/youtube-music/pull/380)
+- Bump dev deps [`41a01ba`](https://github.com/th-ch/youtube-music/commit/41a01ba58a17056ba5143fdbd10d3bae11dd8d52)
+- Discord add reconnecting functionality [`b5fd6b4`](https://github.com/th-ch/youtube-music/commit/b5fd6b4969a318b3738583e7f33eb2c0cf295237)
+- add custom-electron-prompt [`e4eed2e`](https://github.com/th-ch/youtube-music/commit/e4eed2e51979378e62dab902e425218cae5108dc)
+
+#### [v1.13.0](https://github.com/th-ch/youtube-music/compare/v1.12.2...v1.13.0)
+
+> 19 September 2021
+
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.22.4 to 1.22.5 [`#406`](https://github.com/th-ch/youtube-music/pull/406)
+- Fix incorrect Google alert caused by changing user agent coresponding to current platform [`#384`](https://github.com/th-ch/youtube-music/pull/384)
+- [Snyk] Upgrade electron-updater from 4.4.3 to 4.4.6 [`#401`](https://github.com/th-ch/youtube-music/pull/401)
+- [Snyk] Upgrade electron-updater from 4.4.0 to 4.4.1 [`#370`](https://github.com/th-ch/youtube-music/pull/370)
+- Bump path-parse from 1.0.6 to 1.0.7 [`#375`](https://github.com/th-ch/youtube-music/pull/375)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.22.2 to 1.22.3 [`#385`](https://github.com/th-ch/youtube-music/pull/385)
+- Bump jszip from 3.5.0 to 3.7.1 [`#388`](https://github.com/th-ch/youtube-music/pull/388)
+- List missing plugins [`#382`](https://github.com/th-ch/youtube-music/pull/382)
+- add tuna plugin for obs [`#397`](https://github.com/th-ch/youtube-music/pull/397)
+- Update menu buttons to new format [`#389`](https://github.com/th-ch/youtube-music/pull/389)
+- Plugin to fetch lyrics from Genius [`#387`](https://github.com/th-ch/youtube-music/pull/387)
+- Add mpris support with cherry picked commit from previous PR https://github.com/th-ch/youtube-music/pull/394 [`#395`](https://github.com/th-ch/youtube-music/pull/395)
+- Add "Listen Along" button, solve #353 [`#383`](https://github.com/th-ch/youtube-music/pull/383)
+- Bump node to v14 [`#386`](https://github.com/th-ch/youtube-music/pull/386)
+- [Snyk] Upgrade electron-updater from 4.3.9 to 4.3.10 [`#350`](https://github.com/th-ch/youtube-music/pull/350)
+- [Snyk] Upgrade chokidar from 3.5.1 to 3.5.2 [`#354`](https://github.com/th-ch/youtube-music/pull/354)
+- Bump ytdl/ytpl [`c01506d`](https://github.com/th-ch/youtube-music/commit/c01506dc441bfc538471dc2c552c1a8a2800c611)
+- Add mpris support [`e255777`](https://github.com/th-ch/youtube-music/commit/e255777283c7b16611404cbfe260bfcca75a1e40)
+- Add Genius lyrics plugin [`acbe0ac`](https://github.com/th-ch/youtube-music/commit/acbe0ac25d568c25fedb514e0e96c66497b0f2d6)
+
+#### [v1.12.2](https://github.com/th-ch/youtube-music/compare/v1.12.1...v1.12.2)
+
+> 1 July 2021
+
+- Fix downloader plugin [`#339`](https://github.com/th-ch/youtube-music/pull/339)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.22.0 to 1.22.1 [`#337`](https://github.com/th-ch/youtube-music/pull/337)
+- Update and simplify in-app-menu [`#249`](https://github.com/th-ch/youtube-music/pull/249)
+- Bump hosted-git-info from 2.8.8 to 2.8.9 [`#331`](https://github.com/th-ch/youtube-music/pull/331)
+- Bump lodash from 4.17.20 to 4.17.21 [`#330`](https://github.com/th-ch/youtube-music/pull/330)
+- [Snyk] Upgrade ytdl-core from 4.8.0 to 4.8.2 [`#328`](https://github.com/th-ch/youtube-music/pull/328)
+- [Snyk] Upgrade electron-updater from 4.3.8 to 4.3.9 [`#324`](https://github.com/th-ch/youtube-music/pull/324)
+- Bump normalize-url from 4.5.0 to 4.5.1 [`#323`](https://github.com/th-ch/youtube-music/pull/323)
+- Bump trim-newlines from 3.0.0 to 3.0.1 [`#320`](https://github.com/th-ch/youtube-music/pull/320)
+- [Snyk] Upgrade @ffmpeg/core from 0.9.0 to 0.10.0 [`#317`](https://github.com/th-ch/youtube-music/pull/317)
+- [Snyk] Upgrade @ffmpeg/ffmpeg from 0.9.8 to 0.10.0 [`#316`](https://github.com/th-ch/youtube-music/pull/316)
+- [Snyk] Upgrade custom-electron-titlebar from 3.2.6 to 3.2.7 [`#311`](https://github.com/th-ch/youtube-music/pull/311)
+- fix hidden webp thumbnail throwing MIME type error in downloader [`#318`](https://github.com/th-ch/youtube-music/pull/318)
+- Add Sponsorblock plugin [`#308`](https://github.com/th-ch/youtube-music/pull/308)
+- [Snyk] Upgrade @ffmpeg/ffmpeg from 0.9.7 to 0.9.8 [`#305`](https://github.com/th-ch/youtube-music/pull/305)
+- Bump dependencies to fix vulnerabilities [`496836b`](https://github.com/th-ch/youtube-music/commit/496836b33b116e06b8d1361ce1f47ab6c9138cae)
+- update refreshMenu() function [`33855f1`](https://github.com/th-ch/youtube-music/commit/33855f17dd80c099117a3d84bbd9b5021776771c)
+- Add SponsorBlock plugin [`ca64a77`](https://github.com/th-ch/youtube-music/commit/ca64a77ed0236fd9cfb4b40e450578a186638dc7)
+
+#### [v1.12.1](https://github.com/th-ch/youtube-music/compare/v1.12.0...v1.12.1)
+
+> 28 May 2021
+
+- Bump ws from 7.4.3 to 7.4.6 [`#303`](https://github.com/th-ch/youtube-music/pull/303)
+- Bump browserslist from 4.16.3 to 4.16.6 [`#301`](https://github.com/th-ch/youtube-music/pull/301)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.20.4 to 1.20.5 [`#300`](https://github.com/th-ch/youtube-music/pull/300)
+- [Snyk] Upgrade ytdl-core from 4.5.0 to 4.7.0 [`#299`](https://github.com/th-ch/youtube-music/pull/299)
+- [Snyk] Upgrade @ffmpeg/core from 0.8.5 to 0.9.0 [`#298`](https://github.com/th-ch/youtube-music/pull/298)
+- [Snyk] Upgrade filenamify from 4.2.0 to 4.3.0 [`#293`](https://github.com/th-ch/youtube-music/pull/293)
+- [Snyk] Upgrade ytpl from 2.1.1 to 2.2.0 [`#285`](https://github.com/th-ch/youtube-music/pull/285)
+- fix song-info callback duplication [`#269`](https://github.com/th-ch/youtube-music/pull/269)
+- fix notification showing appID instead of app name on windows [`#270`](https://github.com/th-ch/youtube-music/pull/270)
+- Upgrade electron to v12 [`#273`](https://github.com/th-ch/youtube-music/pull/273)
+- fix last-fm overwrite config on each start [`#267`](https://github.com/th-ch/youtube-music/pull/267)
+- Downloader tweaks + taskbar progress bar [`#265`](https://github.com/th-ch/youtube-music/pull/265)
+- remove `open` dependency from last-fm plugin [`#262`](https://github.com/th-ch/youtube-music/pull/262)
+- Fix downloader metadata if not currently playing [`#252`](https://github.com/th-ch/youtube-music/pull/252)
+- fix playPause bugs by directly playPause video element [`#259`](https://github.com/th-ch/youtube-music/pull/259)
+- Bump ua-parser-js from 0.7.23 to 0.7.28 [`#260`](https://github.com/th-ch/youtube-music/pull/260)
+- Fix precise volume listener override [`#253`](https://github.com/th-ch/youtube-music/pull/253)
+- fix css not inserting on reload [`#255`](https://github.com/th-ch/youtube-music/pull/255)
+- playlist download progressBar using `chokidar` [`53bf7c5`](https://github.com/th-ch/youtube-music/commit/53bf7c5068fdc14f5aa469d47b3174d27f40e05c)
+- download progress bar on taskbar [`a8ac2c3`](https://github.com/th-ch/youtube-music/commit/a8ac2c3af988f299be85010e7fea541096b7e261)
+- fix: upgrade @cliqz/adblocker-electron from 1.20.4 to 1.20.5 [`c5f84b5`](https://github.com/th-ch/youtube-music/commit/c5f84b568b0c3480af1abc8ff111771e2170a50e)
+
+#### [v1.12.0](https://github.com/th-ch/youtube-music/compare/v1.11.0...v1.12.0)
+
+> 4 May 2021
+
+- Menu tweaks [`#224`](https://github.com/th-ch/youtube-music/pull/224)
+- Interactive notifications for windows [`#228`](https://github.com/th-ch/youtube-music/pull/228)
+- [Plugin] Precise volume control [`#236`](https://github.com/th-ch/youtube-music/pull/236)
+- [Snyk] Upgrade electron-store from 7.0.2 to 7.0.3 [`#244`](https://github.com/th-ch/youtube-music/pull/244)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.20.3 to 1.20.4 [`#233`](https://github.com/th-ch/youtube-music/pull/233)
+- Dependencies update [`#231`](https://github.com/th-ch/youtube-music/pull/231)
+- Fix downloader metadata [`#245`](https://github.com/th-ch/youtube-music/pull/245)
+- Last.fm support [`#196`](https://github.com/th-ch/youtube-music/pull/196)
+- simple fix for discord plugin [`#239`](https://github.com/th-ch/youtube-music/pull/239)
+- In-app-menu plugin - rename plugin & configure menu builder [`#215`](https://github.com/th-ch/youtube-music/pull/215)
+- Allows downloading songs that aren't currently playing [`#221`](https://github.com/th-ch/youtube-music/pull/221)
+- Updated download plugin icon color to match other icons [`#222`](https://github.com/th-ch/youtube-music/pull/222)
+- [Notification Plugin] Fix duplicate notification [`#216`](https://github.com/th-ch/youtube-music/pull/216)
+- Pass metadata to front + use metadata URL in downloader [`#213`](https://github.com/th-ch/youtube-music/pull/213)
+- Refresh menu on plugin enable/disable (show/hide submenu) [`#217`](https://github.com/th-ch/youtube-music/pull/217)
+- remove 'shortcuts' from default plugins [`#218`](https://github.com/th-ch/youtube-music/pull/218)
+- [Plugin] styled-bars [`#201`](https://github.com/th-ch/youtube-music/pull/201)
+- Add configurable notification urgency [`#212`](https://github.com/th-ch/youtube-music/pull/212)
+- add Download Folder Chooser [`#207`](https://github.com/th-ch/youtube-music/pull/207)
+- Improved songinfo provider, by using the data from the '/player' request [`#194`](https://github.com/th-ch/youtube-music/pull/194)
+- Download plugin directory chooser [`#10`](https://github.com/th-ch/youtube-music/pull/10)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.20.0 to 1.20.1 [`#180`](https://github.com/th-ch/youtube-music/pull/180)
+- [Plugin] taskbar-mediacontrol  (for Windows) [`#200`](https://github.com/th-ch/youtube-music/pull/200)
+- merge source [`#3`](https://github.com/th-ch/youtube-music/pull/3)
+- merge source [`#2`](https://github.com/th-ch/youtube-music/pull/2)
+- Add playlist feature in downloader plugin + custom menus in plugin system [`#203`](https://github.com/th-ch/youtube-music/pull/203)
+- Added Discord timeout [`#192`](https://github.com/th-ch/youtube-music/pull/192)
+- Override hide(),show(),isVisible from inside plugin [`6427b34`](https://github.com/th-ch/youtube-music/commit/6427b3406c8d84c5b7ecbe6a28158d5dc895c3c2)
+- added back original yarn.lock [`24fea5a`](https://github.com/th-ch/youtube-music/commit/24fea5a24afd4f547628549962d24756cca5e413)
+- remove local prompt [`8dc486f`](https://github.com/th-ch/youtube-music/commit/8dc486f18fe02a218b149838dc7ab939ec1b698a)
+
+#### [v1.11.0](https://github.com/th-ch/youtube-music/compare/v1.10.0...v1.11.0)
+
+> 9 March 2021
+
+- [Snyk] Upgrade electron-store from 7.0.1 to 7.0.2 [`#178`](https://github.com/th-ch/youtube-music/pull/178)
+- Added function to toggle resuming of last song when app starts [`#177`](https://github.com/th-ch/youtube-music/pull/177)
+- [Snyk] Upgrade discord-rpc from 3.1.4 to 3.2.0 [`#175`](https://github.com/th-ch/youtube-music/pull/175)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.19.0 to 1.20.0 [`#154`](https://github.com/th-ch/youtube-music/pull/154)
+- Added metadata to downloader plugin, and updated packages [`dd1bdae`](https://github.com/th-ch/youtube-music/commit/dd1bdae9478ef831ee2a00b29be04c65626933f8)
+- Fix download/speed menu item [`796a7aa`](https://github.com/th-ch/youtube-music/commit/796a7aaaf1ecaf80b2ef113137f2222499803e29)
+- fix: upgrade @cliqz/adblocker-electron from 1.19.0 to 1.20.0 [`538ab52`](https://github.com/th-ch/youtube-music/commit/538ab52abd46c2e3c6abb529c5137b5286d29670)
+
+#### [v1.10.0](https://github.com/th-ch/youtube-music/compare/v1.9.0...v1.10.0)
+
+> 7 February 2021
+
+- [Snyk] Upgrade @ffmpeg/ffmpeg from 0.9.6 to 0.9.7 [`#146`](https://github.com/th-ch/youtube-music/pull/146)
+- Reuse the same notification, instead of creating a new one each time the song changes. [`#144`](https://github.com/th-ch/youtube-music/pull/144)
+- [Snyk] Upgrade ytdl-core from 4.2.1 to 4.3.0 [`#136`](https://github.com/th-ch/youtube-music/pull/136)
+- bring the new commits to this fork [`#1`](https://github.com/th-ch/youtube-music/pull/1)
+- GH page [`3bcf409`](https://github.com/th-ch/youtube-music/commit/3bcf409f2b1629333714b187c606891cedb12512)
+- Add plugin to control playback speed like in YouTube (from 0.25 to 2) [`f7f3185`](https://github.com/th-ch/youtube-music/commit/f7f31850d3d9879002dc47326e4f6ec9a52c25a1)
+- Update back.js [`1fdf241`](https://github.com/th-ch/youtube-music/commit/1fdf2416ad414035104bfb51b8450d82e566cb13)
+
+#### [v1.9.0](https://github.com/th-ch/youtube-music/compare/v1.8.2...v1.9.0)
+
+> 15 January 2021
+
+- [Snyk] Upgrade electron-debug from 3.1.0 to 3.2.0 [`#121`](https://github.com/th-ch/youtube-music/pull/121)
+- Refactor providers [`#125`](https://github.com/th-ch/youtube-music/pull/125)
+- Added Discord rich presence and added extra properties to songInfo provider [`#124`](https://github.com/th-ch/youtube-music/pull/124)
+- Fix plugins with context isolation [`#127`](https://github.com/th-ch/youtube-music/pull/127)
+- Windows portable exe [`#126`](https://github.com/th-ch/youtube-music/pull/126)
+- Split providers in 2 [`0743034`](https://github.com/th-ch/youtube-music/commit/0743034de0443e889ec11d7ea83727ff4fb96599)
+- Added Discord rich presence and added extra properties to songinfo provider [`a8ce87f`](https://github.com/th-ch/youtube-music/commit/a8ce87f2ccb4f0fdbd36676883e6a0497bebc263)
+- Update discord plugin for new provider + wait for ready [`aec542e`](https://github.com/th-ch/youtube-music/commit/aec542e95e2837f54bf19de675f311444789ea4e)
+
+#### [v1.8.2](https://github.com/th-ch/youtube-music/compare/v1.8.1...v1.8.2)
+
+> 12 January 2021
+
+- Downloader plugin - custom audio format [`#118`](https://github.com/th-ch/youtube-music/pull/118)
+- Globalized the song info and song controls, and updated Touch Bar for it. [`#102`](https://github.com/th-ch/youtube-music/pull/102)
+- Bump electron to v11 [`#120`](https://github.com/th-ch/youtube-music/pull/120)
+- Globalized the songinfo and song controls, and changed the pause/play button. [`9be3e1a`](https://github.com/th-ch/youtube-music/commit/9be3e1afe91f0aa3419040bba65e7b3b83b469c6)
+- Simplifies the notification plugin to use the globalized song info [`5bffdbd`](https://github.com/th-ch/youtube-music/commit/5bffdbd6285a6816749c467d6e912d14748f9959)
+- Loads providers before plugins [`3a5d9bd`](https://github.com/th-ch/youtube-music/commit/3a5d9bd973bdd67e77f8a7687c1430245a9490bd)
+
+#### [v1.8.1](https://github.com/th-ch/youtube-music/compare/v1.8.0...v1.8.1)
+
+> 8 January 2021
+
+- [Snyk] Upgrade electron-updater from 4.3.5 to 4.3.6 [`#116`](https://github.com/th-ch/youtube-music/pull/116)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.18.8 to 1.19.0 [`#117`](https://github.com/th-ch/youtube-music/pull/117)
+- [Snyk] Upgrade ytdl-core from 4.1.1 to 4.1.2 [`#109`](https://github.com/th-ch/youtube-music/pull/109)
+- Bump node-notifier from 8.0.0 to 8.0.1 [`#104`](https://github.com/th-ch/youtube-music/pull/104)
+- fix: upgrade electron-updater from 4.3.5 to 4.3.6 [`0bf77e5`](https://github.com/th-ch/youtube-music/commit/0bf77e592a87eb8a5222cf2c1588488a51044422)
+- fix: upgrade @cliqz/adblocker-electron from 1.18.8 to 1.19.0 [`5c0cc08`](https://github.com/th-ch/youtube-music/commit/5c0cc08d80d60c46e8b27343c6fc302f64fe89e2)
+- fix: upgrade ytdl-core from 4.1.1 to 4.1.2 [`e2cc262`](https://github.com/th-ch/youtube-music/commit/e2cc2628aea653739f878ec2cd2e72e2e70018a1)
+
+#### [v1.8.0](https://github.com/th-ch/youtube-music/compare/v1.7.5...v1.8.0)
+
+> 20 December 2020
+
+- Added Touch Bar plugin [`#101`](https://github.com/th-ch/youtube-music/pull/101)
+- [Snyk] Upgrade @ffmpeg/core from 0.8.4 to 0.8.5 [`#99`](https://github.com/th-ch/youtube-music/pull/99)
+- [Snyk] Upgrade @ffmpeg/ffmpeg from 0.9.5 to 0.9.6 [`#100`](https://github.com/th-ch/youtube-music/pull/100)
+- [Readme] Web folder for readme assets + new SVG animation [`#96`](https://github.com/th-ch/youtube-music/pull/96)
+- Add new Linux targets (deb, freebsd, rpm) [`#94`](https://github.com/th-ch/youtube-music/pull/94)
+- Web folder for readme assets + new svg animation [`01fc965`](https://github.com/th-ch/youtube-music/commit/01fc9651705f457da63615ff774f00957f783d3d)
+- touchbar plugin - fixed code style [`7473677`](https://github.com/th-ch/youtube-music/commit/7473677477071ca5e7b18bda3193e345d7fd549f)
+- added initial touchbar support [`c3e2c13`](https://github.com/th-ch/youtube-music/commit/c3e2c1380810d156d9d6863fffc804242171bec0)
+
+#### [v1.7.5](https://github.com/th-ch/youtube-music/compare/v1.7.4...v1.7.5)
+
+> 12 December 2020
+
+- Bump ini from 1.3.5 to 1.3.7 [`#92`](https://github.com/th-ch/youtube-music/pull/92)
+- Fix adblocking [`#90`](https://github.com/th-ch/youtube-music/pull/90)
+- Bump adblocker dependency [`49497d0`](https://github.com/th-ch/youtube-music/commit/49497d0efb28ee0be5b16d0f1c3660efafcd289c)
+- Fix adblocker preloading to inject scripts/styles [`66c5ce4`](https://github.com/th-ch/youtube-music/commit/66c5ce46caa85a7ae4ceb3d63a9e168827015c71)
+- Add uBlock Origin filters to default sources [`79c7959`](https://github.com/th-ch/youtube-music/commit/79c795927a3be96456a2f45159285c64166a29b8)
+
+#### [v1.7.4](https://github.com/th-ch/youtube-music/compare/v1.7.3...v1.7.4)
+
+> 8 December 2020
+
+#### [v1.7.3](https://github.com/th-ch/youtube-music/compare/v1.7.2...v1.7.3)
+
+> 8 December 2020
+
+- Adblocker: add option to disable default lists [`22c7f70`](https://github.com/th-ch/youtube-music/commit/22c7f70c938566a9db9c4d46a57224cfdee43df0)
+
+#### [v1.7.2](https://github.com/th-ch/youtube-music/compare/v1.7.1...v1.7.2)
+
+> 6 December 2020
+
+- Add AUR badge + beautify badges [`#82`](https://github.com/th-ch/youtube-music/pull/82)
+- Bugfix: only use cache with no additional blocklists [`467171a`](https://github.com/th-ch/youtube-music/commit/467171a17e648331d63f166c2da2f3134e95b37f)
+- Add AUR tag + beautify tags [`d212206`](https://github.com/th-ch/youtube-music/commit/d21220693b9ffa26e05fe1963376b636b40b9952)
+- Readme: add youtube-music logo to badges [`3022fac`](https://github.com/th-ch/youtube-music/commit/3022facbead40ccd81629c37b870ab33ce7fa106)
+
+#### [v1.7.1](https://github.com/th-ch/youtube-music/compare/v1.7.0...v1.7.1)
+
+> 3 December 2020
+
+- Option to restart the app on config changes [`fd97576`](https://github.com/th-ch/youtube-music/commit/fd97576611ae80b959ffe7984e88ddc8d28a1ffc)
+- Bump version to 1.7.1 [`e07cac2`](https://github.com/th-ch/youtube-music/commit/e07cac240691b1c9d6909e457824616182374c3a)
+
+#### [v1.7.0](https://github.com/th-ch/youtube-music/compare/v1.6.5...v1.7.0)
+
+> 3 December 2020
+
+- Refactor config, custom plugin options [`#79`](https://github.com/th-ch/youtube-music/pull/79)
+- Refactor config for simpler use and advanced options in plugins [`8ab2da0`](https://github.com/th-ch/youtube-music/commit/8ab2da0482b6211b6b6d43423ec06daed48dac4f)
+- Allow editing config (advanced) [`f4fe5c2`](https://github.com/th-ch/youtube-music/commit/f4fe5c2a58e1ad555c321f27c00d2d78184fc687)
+- Adblocker - advanced options (caching or not, additional lists) [`b94d0d4`](https://github.com/th-ch/youtube-music/commit/b94d0d4e8bd3a92bbb5e012a63fa782baa774be7)
+
+#### [v1.6.5](https://github.com/th-ch/youtube-music/compare/v1.6.4...v1.6.5)
+
+> 2 December 2020
+
+- Add option to disable hardware acceleration [`#77`](https://github.com/th-ch/youtube-music/pull/77)
+- Downloader plugin - retry and upgrade dependencies [`#76`](https://github.com/th-ch/youtube-music/pull/76)
+- Reflect Arch Linux package name change [`#70`](https://github.com/th-ch/youtube-music/pull/70)
+- Option to hide menu [`#67`](https://github.com/th-ch/youtube-music/pull/67)
+- Add Arch Linux installation instructions [`#68`](https://github.com/th-ch/youtube-music/pull/68)
+- Update ytdl-core to 4.1.1 [`33a11ef`](https://github.com/th-ch/youtube-music/commit/33a11efe9acad234e41ad9044ae9e67fd573b7f4)
+- Autoupdate modal: add download/disable updates buttons [`ae5b85d`](https://github.com/th-ch/youtube-music/commit/ae5b85d8d748659f2e23d417560026f24ab8ce9c)
+- Option to hide menu (win/linux) [`4bac3ac`](https://github.com/th-ch/youtube-music/commit/4bac3ace186c5be2cb9409d2b703f960bd662145)
+
+#### [v1.6.4](https://github.com/th-ch/youtube-music/compare/v1.6.3...v1.6.4)
+
+> 24 November 2020
+
+#### [v1.6.3](https://github.com/th-ch/youtube-music/compare/v1.6.2...v1.6.3)
+
+> 24 November 2020
+
+- Improve CI [`#64`](https://github.com/th-ch/youtube-music/pull/64)
+- Ensure menu is visible on all platforms [`#63`](https://github.com/th-ch/youtube-music/pull/63)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.18.3 to 1.18.4 [`#62`](https://github.com/th-ch/youtube-music/pull/62)
+- fix: upgrade @cliqz/adblocker-electron from 1.18.3 to 1.18.4 [`2b243f6`](https://github.com/th-ch/youtube-music/commit/2b243f6dcb00d3b6f27fd066c093e7b16bb384e2)
+- CI: cache yarn directory [`0fd4933`](https://github.com/th-ch/youtube-music/commit/0fd49330d3218ec5f1bc62b72ace28e79d02bc93)
+- Run CI on every push/PR [`cf4827d`](https://github.com/th-ch/youtube-music/commit/cf4827d780fee510a27eecf42453b0505c52bcf9)
+
+#### [v1.6.2](https://github.com/th-ch/youtube-music/compare/v1.6.0...v1.6.2)
+
+> 22 November 2020
+
+- Add github action to build/release [`#60`](https://github.com/th-ch/youtube-music/pull/60)
+- Bump to node 12 [`#59`](https://github.com/th-ch/youtube-music/pull/59)
+- Bump to node 12 [`#59`](https://github.com/th-ch/youtube-music/pull/59)
+- Add downloader (video -> mp3) plugin (in music menu) [`e197087`](https://github.com/th-ch/youtube-music/commit/e197087a5027af1ca71ecde7bbdf6351137555b9)
+- Delete AppVeyor/Travis CI integration [`941dd90`](https://github.com/th-ch/youtube-music/commit/941dd90d77a5c46ed5505918374693fcd892af1f)
+- GH action to build/release [`fc4754a`](https://github.com/th-ch/youtube-music/commit/fc4754a1709e6eb70d662f89eafd360aa4a77aa2)
+
+#### [v1.6.0](https://github.com/th-ch/youtube-music/compare/v1.5.0...v1.6.0)
+
+> 11 November 2020
+
+- [Snyk] Upgrade electron-store from 6.0.0 to 6.0.1 [`#54`](https://github.com/th-ch/youtube-music/pull/54)
+- Add notifications plugin (notify of song on play event) [`bcff6e5`](https://github.com/th-ch/youtube-music/commit/bcff6e51348645395549c206717225fb16a29cda)
+- Plugins/event handlers in each window [`9bc81da`](https://github.com/th-ch/youtube-music/commit/9bc81da6f2c7f5f35769489e179851bdd80a7da8)
+- Option to toggle devtools [`3e97e93`](https://github.com/th-ch/youtube-music/commit/3e97e9307cf0991adc5584a603c292b03bc6202d)
+
+#### [v1.5.0](https://github.com/th-ch/youtube-music/compare/v1.4.0...v1.5.0)
+
+> 4 October 2020
+
+- Bump node-fetch from 2.6.0 to 2.6.1 [`#45`](https://github.com/th-ch/youtube-music/pull/45)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.17.0 to 1.18.0 [`#47`](https://github.com/th-ch/youtube-music/pull/47)
+- [Snyk] Upgrade electron-updater from 4.3.3 to 4.3.4 [`#40`](https://github.com/th-ch/youtube-music/pull/40)
+- Bump elliptic from 6.5.2 to 6.5.3 [`#38`](https://github.com/th-ch/youtube-music/pull/38)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.16.0 to 1.16.1 [`#37`](https://github.com/th-ch/youtube-music/pull/37)
+- Bump lodash from 4.17.15 to 4.17.19 [`#34`](https://github.com/th-ch/youtube-music/pull/34)
+- Option to start at login [`#32`](https://github.com/th-ch/youtube-music/pull/32)
+- Bump dependencies [`97dce5a`](https://github.com/th-ch/youtube-music/commit/97dce5ad41ba7ff7a12d4e57a6a0acfeccd666d8)
+- Bump electron to v10 (+ remove devtron, bump spectron) [`5f0dcbb`](https://github.com/th-ch/youtube-music/commit/5f0dcbb3fc9b2912bba690db232184d32c599150)
+- Navigation plugin: fix arrow style [`8d74a0a`](https://github.com/th-ch/youtube-music/commit/8d74a0a9b52c5b5a04b0986e5fbec9b47a35823e)
+
+#### [v1.4.0](https://github.com/th-ch/youtube-music/compare/v1.3.3...v1.4.0)
+
+> 12 July 2020
+
+- Bump electron from 8.2.1 to 8.2.4 [`#31`](https://github.com/th-ch/youtube-music/pull/31)
+- [Snyk] Upgrade electron-store from 5.1.1 to 5.2.0 [`#30`](https://github.com/th-ch/youtube-music/pull/30)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.14.4 to 1.15.0 [`#29`](https://github.com/th-ch/youtube-music/pull/29)
+- [Snyk] Upgrade electron-debug from 3.0.1 to 3.1.0 [`#28`](https://github.com/th-ch/youtube-music/pull/28)
+- [Snyk] Upgrade electron-updater from 4.3.1 to 4.3.2 [`#27`](https://github.com/th-ch/youtube-music/pull/27)
+- [Snyk] Upgrade electron-updater from 4.3.0 to 4.3.1 [`#26`](https://github.com/th-ch/youtube-music/pull/26)
+- [Snyk] Upgrade @cliqz/adblocker-electron from 1.14.1 to 1.14.2 [`#25`](https://github.com/th-ch/youtube-music/pull/25)
+- [Tests] Add integration tests [`#24`](https://github.com/th-ch/youtube-music/pull/24)
+- Add jest, spectron and getPort util for tests [`736a706`](https://github.com/th-ch/youtube-music/commit/736a70680108620cdecab2da9dd48e10354c713e)
+- fix: upgrade electron-updater from 4.3.1 to 4.3.2 [`8c94510`](https://github.com/th-ch/youtube-music/commit/8c945100e24187885dbbe5bb7830b1da11e4eaa2)
+- Add jest config and test environment to launch app [`bce5b7d`](https://github.com/th-ch/youtube-music/commit/bce5b7d8ebd96886d462a3c999d72e6c69b6f807)
+
+#### [v1.3.3](https://github.com/th-ch/youtube-music/compare/v1.3.2...v1.3.3)
+
+> 29 April 2020
+
+- Move tray click callback in setUpTray [`4824dda`](https://github.com/th-ch/youtube-music/commit/4824dda5d52565deb5cd6ef4b51d2d742677a154)
+- Bump version to 1.3.3 [`37cac19`](https://github.com/th-ch/youtube-music/commit/37cac19d9ccae59b89a68b995eaf7e08c7d24d11)
+
+#### [v1.3.2](https://github.com/th-ch/youtube-music/compare/v1.3.1...v1.3.2)
+
+> 26 April 2020
+
+- [Snyk] Upgrade electron-updater from 4.2.5 to 4.3.0 [`#22`](https://github.com/th-ch/youtube-music/pull/22)
+- fix: upgrade electron-updater from 4.2.5 to 4.3.0 [`9821300`](https://github.com/th-ch/youtube-music/commit/98213005d09d00bf013d2217809736bdc334ede6)
+- Hide the app (no quit) on close if tray enabled [`430687f`](https://github.com/th-ch/youtube-music/commit/430687f4d6d301aaeaeeaa11ae34d971ac3280df)
+- Show/hide window when clicking on tray [`058371a`](https://github.com/th-ch/youtube-music/commit/058371ace8fbd3d9f126454fdc7dbff86df05506)
+
+#### [v1.3.1](https://github.com/th-ch/youtube-music/compare/v1.2.0...v1.3.1)
+
+> 12 April 2020
+
+- Add options and tray [`#21`](https://github.com/th-ch/youtube-music/pull/21)
+- Upgrade outdated dependencies [`#20`](https://github.com/th-ch/youtube-music/pull/20)
+- [Plugins] Migrate ad blocker [`#19`](https://github.com/th-ch/youtube-music/pull/19)
+- Upgrade xo [`297de08`](https://github.com/th-ch/youtube-music/commit/297de08278c2704b3baf65c455bba72f72acc06f)
+- Bump electron-builder (needed after electron upgrade) [`3d9e59d`](https://github.com/th-ch/youtube-music/commit/3d9e59dc90e0e994e20af55af9134477e68907a5)
+- Migrate from adblock-rs to cliqz [`422c3fc`](https://github.com/th-ch/youtube-music/commit/422c3fc28d83da309a80447dcd5064a4346580e8)
+
+#### [v1.2.0](https://github.com/th-ch/youtube-music/compare/v1.1.6...v1.2.0)
+
+> 15 March 2020
+
+- [Snyk] Upgrade electron-localshortcut from 3.1.0 to 3.2.1 [`#13`](https://github.com/th-ch/youtube-music/pull/13)
+- [Snyk] Upgrade electron-updater from 4.0.6 to 4.2.2 [`#12`](https://github.com/th-ch/youtube-music/pull/12)
+- [Snyk] Upgrade electron-debug from 2.1.0 to 2.2.0 [`#15`](https://github.com/th-ch/youtube-music/pull/15)
+- Fix vulnerability [`#16`](https://github.com/th-ch/youtube-music/pull/16)
+- Plugin: autoconfirm when paused [`#11`](https://github.com/th-ch/youtube-music/pull/11)
+- Migrate to yarn to install packages without package.json (but keep npm rebuild) [`9371a48`](https://github.com/th-ch/youtube-music/commit/9371a4827e2312258a4f692c18f964155d57ceb8)
+- Bump electron-store to fix a vulnerability [`7050dfc`](https://github.com/th-ch/youtube-music/commit/7050dfca5c6a545dabc334690572d7f88b37e027)
+- Bump electron updater [`f25bb59`](https://github.com/th-ch/youtube-music/commit/f25bb59065d84cde202b5192688847c528c6ef61)
+
+#### [v1.1.6](https://github.com/th-ch/youtube-music/compare/v1.1.5...v1.1.6)
+
+> 11 September 2019
+
+- Bump eslint-utils from 1.3.1 to 1.4.2 [`#7`](https://github.com/th-ch/youtube-music/pull/7)
+- Bump lodash.mergewith from 4.6.1 to 4.6.2 [`#4`](https://github.com/th-ch/youtube-music/pull/4)
+- Bump lodash from 4.17.11 to 4.17.14 [`#5`](https://github.com/th-ch/youtube-music/pull/5)
+- npm audit fix [`1a72129`](https://github.com/th-ch/youtube-music/commit/1a72129108935cbe732621d93b877e90d11a4195)
+- Fix Google login [`746b5f1`](https://github.com/th-ch/youtube-music/commit/746b5f13bb08c614df290e69946cfd116a550521)
+- Bump version to 1.1.6 [`6fd10ea`](https://github.com/th-ch/youtube-music/commit/6fd10ea4a0f63e9a46e7307d811977f4e0f3213f)
+
+#### [v1.1.5](https://github.com/th-ch/youtube-music/compare/v1.1.4...v1.1.5)
+
+> 6 July 2019
+
+- Fix navigation plugin [`b10a1bb`](https://github.com/th-ch/youtube-music/commit/b10a1bb32dbea187422a43487527c379a9ddbb26)
+- Bump version to 1.1.5 [`07c4a42`](https://github.com/th-ch/youtube-music/commit/07c4a429c15f22b173629618518abb97d9ec0100)
+
+#### [v1.1.4](https://github.com/th-ch/youtube-music/compare/v1.1.3...v1.1.4)
+
+> 8 June 2019
+
+- isDev -> is package [`a85325f`](https://github.com/th-ch/youtube-music/commit/a85325f33dbd40517b6029e500569fc1640af2ef)
+- Add titlebar/frame only on MacOS [`b1c4cc9`](https://github.com/th-ch/youtube-music/commit/b1c4cc9c45cc48413118aec8ce54767b1983a3e7)
+- Bump version to 1.1.4 [`0420f2e`](https://github.com/th-ch/youtube-music/commit/0420f2e49e295cede0db22dbb1f35ffafd6318ed)
+
+#### [v1.1.3](https://github.com/th-ch/youtube-music/compare/v1.1.2...v1.1.3)
+
+> 2 June 2019
+
+- Bump fstream from 1.0.11 to 1.0.12 [`#3`](https://github.com/th-ch/youtube-music/pull/3)
+- Version 1.1.3 + npm audit fix [`147ac48`](https://github.com/th-ch/youtube-music/commit/147ac48de6540c836e835fefe47e66e55dbdc9bc)
+- Fix case for {en/dis}ablePlugin [`e86d63d`](https://github.com/th-ch/youtube-music/commit/e86d63da8cb083b89c2a26e6514a5b0df8868b13)
+- Remove outdated download links [`ec58b5c`](https://github.com/th-ch/youtube-music/commit/ec58b5cbedda8d6f881f0e81f185a1707dbe5fab)
+
+#### [v1.1.2](https://github.com/th-ch/youtube-music/compare/v1.1.1...v1.1.2)
+
+> 1 May 2019
+
+- Display error/retry in case of failure [`5a1d7fb`](https://github.com/th-ch/youtube-music/commit/5a1d7fbf230fcd840a3ea654f31602fb5f504852)
+- Bump version to 1.1.2 [`eac2c5c`](https://github.com/th-ch/youtube-music/commit/eac2c5cf14d0a348704f7fbf0ff0bdce02758670)
+
+#### [v1.1.1](https://github.com/th-ch/youtube-music/compare/v1.1.0...v1.1.1)
+
+> 28 April 2019
+
+- Update package lock [`2d3f77d`](https://github.com/th-ch/youtube-music/commit/2d3f77d96211460bb81a73c8c62b9e5407a7cf30)
+- Add travis config [`5279a45`](https://github.com/th-ch/youtube-music/commit/5279a45f3537170006ba04cd5d59ac8b879d78a5)
+- Add Appveyor config [`abc2bb8`](https://github.com/th-ch/youtube-music/commit/abc2bb8a4f749704f2daf376c0d392030f030caf)
+
+#### [v1.1.0](https://github.com/th-ch/youtube-music/compare/v1.0.0...v1.1.0)
+
+> 19 April 2019
+
+- Build script + check for updates [`b3c24a5`](https://github.com/th-ch/youtube-music/commit/b3c24a521281c352c37d649e8334b581b2a1de4f)
+- Add download section in readme [`828e8d4`](https://github.com/th-ch/youtube-music/commit/828e8d472ca3d76dea71d95a85f8fa726404b8e7)
+- Add release/licence badge in readme [`9d343bf`](https://github.com/th-ch/youtube-music/commit/9d343bf779f2fa830302cc84c484bf4a93a25f36)
+
+#### v1.0.0
+
+> 19 April 2019
+
+- Initial commit - app + 4 plugins [`8787b5c`](https://github.com/th-ch/youtube-music/commit/8787b5c175d02b52de65f2c559b411d999fa51e4)
+- Fix screenshot shadow + compress image [`c5c128f`](https://github.com/th-ch/youtube-music/commit/c5c128fa0f77c69e9bf12f6ca551315b37c51e84)
+- Missing quote in readme [`4b446ac`](https://github.com/th-ch/youtube-music/commit/4b446ac7c816c660cf369f3b8b6e420f766ee35f)

config/defaults.js

@@ -11,25 +11,172 @@ const defaultConfig = {
 		hideMenu: false,
 		startAtLogin: false,
 		disableHardwareAcceleration: false,
+		restartOnConfigChanges: false,
+		trayClickPlayPause: false,
+		autoResetAppCache: false,
+		resumeOnStart: true,
+		proxy: "",
+		startingPage: "",
 	},
 	plugins: {
 		// Enabled plugins
 		navigation: {
 			enabled: true,
 		},
-		shortcuts: {
-			enabled: true,
-		},
 		adblocker: {
 			enabled: true,
 			cache: true,
 			additionalBlockLists: [], // Additional list of filters, e.g "https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters.txt"
 		},
 		// Disabled plugins
+		shortcuts: {
+			enabled: false,
+			overrideMediaKeys: false,
+		},
 		downloader: {
 			enabled: false,
 			ffmpegArgs: [], // e.g. ["-b:a", "192k"] for an audio bitrate of 192kb/s
 			downloadFolder: undefined, // Custom download folder (absolute path)
+			preset: "mp3",
+		},
+		"last-fm": {
+			enabled: false,
+			api_root: "http://ws.audioscrobbler.com/2.0/",
+			api_key: "04d76faaac8726e60988e14c105d421a", // api key registered by @semvis123
+			secret: "a5d2a36fdf64819290f6982481eaffa2",
+		},
+		discord: {
+			enabled: false,
+			autoReconnect: true, // if enabled, will try to reconnect to discord every 5 seconds after disconnecting or failing to connect
+			activityTimoutEnabled: true, // if enabled, the discord rich presence gets cleared when music paused after the time specified below
+			activityTimoutTime: 10 * 60 * 1000, // 10 minutes
+			listenAlong: true, // add a "listen along" button to rich presence
+			hideDurationLeft: false, // hides the start and end time of the song to rich presence
+		},
+		notifications: {
+			enabled: false,
+			unpauseNotification: false,
+			urgency: "normal", //has effect only on Linux 
+			// the following has effect only on Windows
+			interactive: true,
+			toastStyle: 1, // see plugins/notifications/utils for more info
+			refreshOnPlayPause: false,
+			trayControls: true,
+			hideButtonText: false 
+		},
+		"precise-volume": {
+			enabled: false,
+			steps: 1, //percentage of volume to change
+			arrowsShortcut: true, //enable ArrowUp + ArrowDown local shortcuts
+			globalShortcuts: {
+				volumeUp: "",
+				volumeDown: ""
+			},
+			savedVolume: undefined //plugin save volume between session here
+		},
+		sponsorblock: {
+			enabled: false,
+			apiURL: "https://sponsor.ajay.app",
+			categories: [
+				"sponsor",
+				"intro",
+				"outro",
+				"interaction",
+				"selfpromo",
+				"music_offtopic",
+			],
+		},
+		"video-toggle": {
+			enabled: false,
+			mode: "custom",
+			forceHide: false,
+		},
+		"picture-in-picture": {
+			"enabled": false,
+			"alwaysOnTop": true,
+			"savePosition": true,
+			"saveSize": false,
+			"hotkey": "P"
+		},
+		"captions-selector": {
+			enabled: false,
+			disableCaptions: false
+		},
+		"skip-silences": {
+			onlySkipBeginning: false,
+		},
+		"crossfade": {
+			enabled: false,
+			fadeInDuration: 1500, // ms
+			fadeOutDuration: 5000, // ms
+			secondsBeforeEnd: 10, // s
+			fadeScaling: "linear", // 'linear', 'logarithmic' or a positive number in dB
+		},
+		visualizer: {
+			enabled: false,
+			type: "butterchurn",
+			// Config per visualizer
+			butterchurn: {
+				preset: "martin [shadow harlequins shape code] - fata morgana",
+				renderingFrequencyInMs: 500,
+				blendTimeInSeconds: 2.7,
+			},
+			vudio: {
+				effect: "lighting",
+				accuracy: 128,
+				lighting: {
+					maxHeight: 160,
+					maxSize: 12,
+					lineWidth: 1,
+					color: "#49f3f7",
+					shadowBlur: 2,
+					shadowColor: "rgba(244,244,244,.5)",
+					fadeSide: true,
+					prettify: false,
+					horizontalAlign: "center",
+					verticalAlign: "middle",
+					dottify: true,
+				},
+			},
+			wave: {
+				animations: [
+					{
+						type: "Cubes",
+						config: {
+							bottom: true,
+							count: 30,
+							cubeHeight: 5,
+							fillColor: { gradient: ["#FAD961", "#F76B1C"] },
+							lineColor: "rgba(0,0,0,0)",
+							radius: 20,
+						},
+					},
+					{
+						type: "Cubes",
+						config: {
+							top: true,
+							count: 12,
+							cubeHeight: 5,
+							fillColor: { gradient: ["#FAD961", "#F76B1C"] },
+							lineColor: "rgba(0,0,0,0)",
+							radius: 10,
+						},
+					},
+					{
+						type: "Circles",
+						config: {
+							lineColor: {
+								gradient: ["#FAD961", "#FAD961", "#F76B1C"],
+								rotate: 90,
+							},
+							lineWidth: 4,
+							diameter: 20,
+							count: 10,
+							frequencyBand: "base",
+						},
+					},
+				],
+			},
 		},
 	},
 };

config/dynamic.js

@@ -0,0 +1,205 @@
+const { ipcRenderer, ipcMain } = require("electron");
+
+const defaultConfig = require("./defaults");
+const { getOptions, setOptions, setMenuOptions } = require("./plugins");
+const { sendToFront } = require("../providers/app-controls");
+
+const activePlugins = {};
+/**
+ * [!IMPORTANT!]
+ * The method is **sync** in the main process and **async** in the renderer process.
+ */
+module.exports.getActivePlugins =
+	process.type === "renderer"
+		? async () => ipcRenderer.invoke("get-active-plugins")
+		: () => activePlugins;
+
+if (process.type === "browser") {
+	ipcMain.handle("get-active-plugins", this.getActivePlugins);
+}
+
+/**
+ * [!IMPORTANT!]
+ * The method is **sync** in the main process and **async** in the renderer process.
+ */
+module.exports.isActive =
+	process.type === "renderer"
+		? async (plugin) =>
+				plugin in (await ipcRenderer.invoke("get-active-plugins"))
+		: (plugin) => plugin in activePlugins;
+
+/**
+ * This class is used to create a dynamic synced config for plugins.
+ *
+ * [!IMPORTANT!]
+ * The methods are **sync** in the main process and **async** in the renderer process.
+ *
+ * @param {string} name - The name of the plugin.
+ * @param {boolean} [options.enableFront] - Whether the config should be available in front.js. Default: false.
+ * @param {object} [options.initialOptions] - The initial options for the plugin. Default: loaded from store.
+ *
+ * @example
+ * const { PluginConfig } = require("../../config/dynamic");
+ * const config = new PluginConfig("plugin-name", { enableFront: true });
+ * module.exports = { ...config };
+ *
+ * // or
+ *
+ * module.exports = (win, options) => {
+ *  const config = new PluginConfig("plugin-name", {
+ *  	enableFront: true,
+ *  	initialOptions: options,
+ *  });
+ *  setupMyPlugin(win, config);
+ * };
+ */
+module.exports.PluginConfig = class PluginConfig {
+	#name;
+	#config;
+	#defaultConfig;
+	#enableFront;
+
+	#subscribers = {};
+	#allSubscribers = [];
+
+	constructor(name, { enableFront = false, initialOptions = undefined } = {}) {
+		const pluginDefaultConfig = defaultConfig.plugins[name] || {};
+		const pluginConfig = initialOptions || getOptions(name) || {};
+
+		this.#name = name;
+		this.#enableFront = enableFront;
+		this.#defaultConfig = pluginDefaultConfig;
+		this.#config = { ...pluginDefaultConfig, ...pluginConfig };
+
+		if (this.#enableFront) {
+			this.#setupFront();
+		}
+
+		activePlugins[name] = this;
+	}
+
+	get = (option) => {
+		return this.#config[option];
+	};
+
+	set = (option, value) => {
+		this.#config[option] = value;
+		this.#onChange(option);
+		this.#save();
+	};
+
+	toggle = (option) => {
+		this.#config[option] = !this.#config[option];
+		this.#onChange(option);
+		this.#save();
+	};
+
+	getAll = () => {
+		return { ...this.#config };
+	};
+
+	setAll = (options) => {
+		if (!options || typeof options !== "object")
+			throw new Error("Options must be an object.");
+
+		let changed = false;
+		for (const [key, val] of Object.entries(options)) {
+			if (this.#config[key] !== val) {
+				this.#config[key] = val;
+				this.#onChange(key, false);
+				changed = true;
+			}
+		}
+		if (changed) this.#allSubscribers.forEach((fn) => fn(this.#config));
+		this.#save();
+	};
+
+	getDefaultConfig = () => {
+		return this.#defaultConfig;
+	};
+
+	/**
+	 * Use this method to set an option and restart the app if `appConfig.restartOnConfigChange === true`
+	 *
+	 * Used for options that require a restart to take effect.
+	 */
+	setAndMaybeRestart = (option, value) => {
+		this.#config[option] = value;
+		setMenuOptions(this.#name, this.#config);
+		this.#onChange(option);
+	};
+
+	subscribe = (valueName, fn) => {
+		this.#subscribers[valueName] = fn;
+	};
+
+	subscribeAll = (fn) => {
+		this.#allSubscribers.push(fn);
+	};
+
+	/** Called only from back */
+	#save() {
+		setOptions(this.#name, this.#config);
+	}
+
+	#onChange(valueName, single = true) {
+		this.#subscribers[valueName]?.(this.#config[valueName]);
+		if (single) this.#allSubscribers.forEach((fn) => fn(this.#config));
+	}
+
+	#setupFront() {
+		const ignoredMethods = ["subscribe", "subscribeAll"];
+
+		if (process.type === "renderer") {
+			for (const [fnName, fn] of Object.entries(this)) {
+				if (typeof fn !== "function" || fn.name in ignoredMethods) return;
+				this[fnName] = async (...args) => {
+					return await ipcRenderer.invoke(
+						`${this.#name}-config-${fnName}`,
+						...args,
+					);
+				};
+
+				this.subscribe = (valueName, fn) => {
+					if (valueName in this.#subscribers) {
+						console.error(`Already subscribed to ${valueName}`);
+					}
+					this.#subscribers[valueName] = fn;
+					ipcRenderer.on(
+						`${this.#name}-config-changed-${valueName}`,
+						(_, value) => {
+							fn(value);
+						},
+					);
+					ipcRenderer.send(`${this.#name}-config-subscribe`, valueName);
+				};
+
+				this.subscribeAll = (fn) => {
+					ipcRenderer.on(`${this.#name}-config-changed`, (_, value) => {
+						fn(value);
+					});
+					ipcRenderer.send(`${this.#name}-config-subscribe-all`);
+				};
+			}
+		} else if (process.type === "browser") {
+			for (const [fnName, fn] of Object.entries(this)) {
+				if (typeof fn !== "function" || fn.name in ignoredMethods) return;
+				ipcMain.handle(`${this.#name}-config-${fnName}`, (_, ...args) => {
+					return fn(...args);
+				});
+			}
+
+			ipcMain.on(`${this.#name}-config-subscribe`, (_, valueName) => {
+				this.subscribe(valueName, (value) => {
+					sendToFront(`${this.#name}-config-changed-${valueName}`, value);
+				});
+			});
+
+			ipcMain.on(`${this.#name}-config-subscribe-all`, () => {
+				this.subscribeAll((value) => {
+					sendToFront(`${this.#name}-config-changed`, value);
+				});
+			});
+		}
+	}
+};

config/index.js

@@ -1,18 +1,30 @@
+const defaultConfig = require("./defaults");
 const plugins = require("./plugins");
 const store = require("./store");
+const { restart } = require("../providers/app-controls");
 
 const set = (key, value) => {
 	store.set(key, value);
 };
 
+function setMenuOption(key, value) {
+	set(key, value);
+	if (store.get("options.restartOnConfigChanges")) restart();
+}
+
 const get = (key) => {
 	return store.get(key);
 };
 
 module.exports = {
+	defaultConfig,
 	get,
 	set,
+	setMenuOption,
 	edit: () => store.openInEditor(),
-	watch: (cb) => store.onDidAnyChange(cb),
+	watch: (cb) => {
+		store.onDidChange("options", cb);
+		store.onDidChange("plugins", cb);
+	},
 	plugins,
 };

config/plugins.js

@@ -1,4 +1,5 @@
 const store = require("./store");
+const { restart } = require("../providers/app-controls");
 
 function getEnabled() {
 	const plugins = store.get("plugins");
@@ -24,12 +25,21 @@ function setOptions(plugin, options) {
 	});
 }
 
+function setMenuOptions(plugin, options) {
+	setOptions(plugin, options);
+	if (store.get("options.restartOnConfigChanges")) restart();
+}
+
+function getOptions(plugin) {
+	return store.get("plugins")[plugin];
+}
+
 function enable(plugin) {
-	setOptions(plugin, { enabled: true });
+	setMenuOptions(plugin, { enabled: true });
 }
 
 function disable(plugin) {
-	setOptions(plugin, { enabled: false });
+	setMenuOptions(plugin, { enabled: false });
 }
 
 module.exports = {
@@ -38,4 +48,6 @@ module.exports = {
 	enable,
 	disable,
 	setOptions,
+	setMenuOptions,
+	getOptions,
 };

config/store.js

@@ -2,7 +2,79 @@ const Store = require("electron-store");
 
 const defaults = require("./defaults");
 
+const setDefaultPluginOptions = (store, plugin) => {
+	if (!store.get(`plugins.${plugin}`)) {
+		store.set(`plugins.${plugin}`, defaults.plugins[plugin]);
+	}
+}
+
 const migrations = {
+	">=1.20.0": (store) => {
+		setDefaultPluginOptions(store, "visualizer");
+
+		if (store.get("plugins.notifications.toastStyle") === undefined) {
+			const pluginOptions = store.get("plugins.notifications") || {};
+			store.set("plugins.notifications", {
+				...defaults.plugins.notifications,
+				...pluginOptions,
+			});
+		}
+
+		if (store.get("options.ForceShowLikeButtons")) {
+			store.delete("options.ForceShowLikeButtons");
+			store.set("options.likeButtons", 'force');
+		}
+	},
+	">=1.17.0": (store) => {
+		setDefaultPluginOptions(store, "picture-in-picture");
+
+		if (store.get("plugins.video-toggle.mode") === undefined) {
+			store.set("plugins.video-toggle.mode", "custom");
+		}
+	},
+	">=1.14.0": (store) => {
+		if (
+			typeof store.get("plugins.precise-volume.globalShortcuts") !== "object"
+		) {
+			store.set("plugins.precise-volume.globalShortcuts", {});
+		}
+
+		if (store.get("plugins.hide-video-player.enabled")) {
+			store.delete("plugins.hide-video-player");
+			store.set("plugins.video-toggle.enabled", true);
+		}
+	},
+	">=1.13.0": (store) => {
+		if (store.get("plugins.discord.listenAlong") === undefined) {
+			store.set("plugins.discord.listenAlong", true);
+		}
+	},
+	">=1.12.0": (store) => {
+		const options = store.get("plugins.shortcuts");
+		let updated = false;
+		for (const optionType of ["global", "local"]) {
+			if (Array.isArray(options[optionType])) {
+				const updatedOptions = {};
+				for (const optionObject of options[optionType]) {
+					if (optionObject.action && optionObject.shortcut) {
+						updatedOptions[optionObject.action] = optionObject.shortcut;
+					}
+				}
+
+				options[optionType] = updatedOptions;
+				updated = true;
+			}
+		}
+
+		if (updated) {
+			store.set("plugins.shortcuts", options);
+		}
+	},
+	">=1.11.0": (store) => {
+		if (store.get("options.resumeOnStart") === undefined) {
+			store.set("options.resumeOnStart", true);
+		}
+	},
 	">=1.7.0": (store) => {
 		const enabledPlugins = store.get("plugins");
 		if (!Array.isArray(enabledPlugins)) {

docs/img/adblock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400"><g transform="translate(183.604 196.396)" stroke="#fff" stroke-width="2.23"><path style="line-height:normal;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration-line:none;text-transform:none;block-progression:tb;marker:none" d="M-116.99 106.245l31.82 31.82 236.31-236.31-31.82-31.82z" color="#000" font-weight="400" font-family="Sans" overflow="visible" fill="#fff" stroke="none"/><circle r="171.304" cy="4" cx="16" fill="none" stroke-width="44.6"/></g></svg>

docs/img/bg-bottom.svg

@@ -0,0 +1 @@
+<svg width="1440" height="347" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="a"><stop stop-color="#606483" stop-opacity="0" offset="0%"/><stop stop-color="#0B0D19" stop-opacity=".72" offset="100%"/></linearGradient><linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="b"><stop stop-color="#0B0D19" offset="0%"/><stop stop-color="#0B0D19" stop-opacity="0" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><path d="M177.486 208.219c78.18 89.285 218.65-81.067 218.65-119.337 0-38.27-86.408-69.295-193-69.295-106.59 0-193 31.024-193 69.295 0 38.27 89.17 30.051 167.35 119.337z" transform="rotate(6 -140.175 3980.948)" fill="url(#a)"/><path d="M252.464 335.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z" fill="url(#a)" transform="rotate(24 321.92 -247.724)"/><path d="M302.512 242.909c88.025 32.428 156-25.04 156-55.93 0-30.888-69.844-55.928-156-55.928-86.157 0-156 25.04-156 55.929 0 30.888 67.974 23.5 156 55.929z" fill="url(#b)" transform="rotate(24 338.741 -285.505)"/></g></svg>

docs/img/bg-top.svg

@@ -0,0 +1 @@
+<svg width="1440" height="318" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="38.706%" y1="-187.115%" x2="18.675%" y2="110.984%" id="a"><stop stop-color="#FFF" stop-opacity="0" offset="0%"/><stop stop-color="#c3352e" offset="100%"/></linearGradient><linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="c"><stop stop-color="#606483" stop-opacity="0" offset="0%"/><stop stop-color="#0B0D19" stop-opacity=".72" offset="100%"/></linearGradient><linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="d"><stop stop-color="#0B0D19" stop-opacity=".32" offset="0%"/><stop stop-color="#0B0D19" stop-opacity="0" offset="100%"/></linearGradient><filter id="b"><feTurbulence type="fractalNoise" numOctaves="2" baseFrequency=".3" result="turb"/><feComposite in="turb" operator="arithmetic" k1=".1" k2=".1" k3=".1" k4=".1" result="result1"/><feComposite operator="in" in="result1" in2="SourceGraphic" result="finalFilter"/><feBlend mode="multiply" in="finalFilter" in2="SourceGraphic"/></filter></defs><g fill="none" fill-rule="evenodd"><path d="M88.494 90c67.04 7.177 161.094-24.753 224.996-90H.2c25.3 48.079 42.361 85.083 88.294 90z" transform="translate(1051)" fill="url(#a)" filter="url(#b)"/><path d="M250.464 367.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z" fill="url(#c)" transform="rotate(143 810.285 354.367)"/><path d="M373.408 256.178c88.026 32.429 156-25.04 156-55.929 0-30.888-69.843-55.929-156-55.929-86.156 0-156 25.04-156 55.93 0 30.888 67.975 23.5 156 55.928z" fill="url(#d)" transform="rotate(136 905.21 332.676)"/></g></svg>

docs/img/code.svg

@@ -0,0 +1 @@
+<svg width="96" height="48" xmlns="http://www.w3.org/2000/svg"><text y="35" x="48" fill="#fff" stroke-width="0" font-size="36" font-family="Monospace" text-anchor="middle" stroke="#fff">&lt;/&gt;</text></svg>

docs/img/download.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="style-scope yt-icon" style="width:100%;height:100%" pointer-events="none" display="block" fill="#fff"><g class="style-scope yt-icon"><path d="M25.462 19.105v6.848H4.515v-6.848H.489v8.861c0 1.111.9 2.012 2.016 2.012h24.967c1.115 0 2.016-.9 2.016-2.012v-8.861h-4.026zM14.62 18.426l-5.764-6.965s-.877-.828.074-.828h3.248V9.217.494S12.049 0 12.793 0h4.572c.536 0 .524.416.524.416V10.424h2.998c1.154 0 .285.867.285.867s-4.904 6.51-5.588 7.193c-.492.495-.964-.058-.964-.058z" class="style-scope yt-icon"/></g></svg>

docs/img/footer.svg

@@ -0,0 +1 @@
+<svg width="1440" height="582" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="a"><stop stop-color="#606483" stop-opacity="0" offset="0%"/><stop stop-color="#363636" stop-opacity=".72" offset="100%"/></linearGradient><linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="b"><stop stop-color="#363636" offset="0%"/><stop stop-color="#363636" stop-opacity="0" offset="100%"/></linearGradient><radialGradient cx="33.3%" cy="43.394%" fx="33.3%" fy="43.394%" r="57.93%" gradientTransform="matrix(.24796 -.96592 .92535 .25883 -.151 .643)" id="c"><stop stop-color="#c3352e" stop-opacity="0" offset="0%"/><stop stop-color="#c3352e" stop-opacity=".64" offset="51.712%"/><stop stop-color="#c3352e" stop-opacity=".24" offset="100%"/></radialGradient><filter id="d"><feTurbulence type="fractalNoise" numOctaves="2" baseFrequency=".3" result="turb"/><feComposite in="turb" operator="arithmetic" k1=".1" k2=".1" k3=".1" k4=".1" result="result1"/><feComposite operator="in" in="result1" in2="SourceGraphic" result="finalFilter"/><feBlend mode="multiply" in="finalFilter" in2="SourceGraphic"/></filter></defs><g fill="none" fill-rule="evenodd"><path d="M252.464 335.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z" fill="url(#a)" transform="rotate(24 -272.272 -82.087)"/><path d="M302.512 242.909c88.025 32.428 156-25.04 156-55.93 0-30.888-69.844-55.928-156-55.928-86.157 0-156 25.04-156 55.929 0 30.888 67.974 23.5 156 55.929z" fill="url(#b)" transform="rotate(24 -255.451 -119.868)"/><path d="M103.064 315.218c128.156 12.998 192.38 157.059 218.627 106.632 26.247-50.427-44.059-106.456 60.397-202.707 104.457-96.252-143.2-285.785-172.392-122.551C180.503 259.825-25.091 302.22 103.064 315.218z" transform="translate(1176 -33)" fill="url(#c)" filter="url(#d)"/></g></svg>

docs/img/plugins.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" fill="#fff"><path d="M45.563 29.174l-22-15A1 1 0 0022 15v30a.999.999 0 001.563.826l22-15a1 1 0 000-1.652zM24 43.107V16.893L43.225 30 24 43.107z"/><path d="M30 0C13.458 0 0 13.458 0 30s13.458 30 30 30 30-13.458 30-30S46.542 0 30 0zm0 58C14.561 58 2 45.439 2 30S14.561 2 30 2s28 12.561 28 28-12.561 28-28 28z"/></svg>

docs/img/youtube-music.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 176 176" width="32" height="32"><circle fill="red" cx="88" cy="88" r="88"/><path fill="#FFF" d="M88 46c23.1 0 42 18.8 42 42s-18.8 42-42 42-42-18.8-42-42 18.9-42 42-42m0-4c-25.4 0-46 20.6-46 46s20.6 46 46 46 46-20.6 46-46-20.6-46-46-46z"/><path fill="#FFF" d="M72 111l39-24-39-22z"/></svg>

docs/index.html

@@ -0,0 +1,490 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<title>YouTube Music Desktop App (Unofficial)</title>
+		<link
+			rel="icon"
+			href="./favicon/favicon.ico"
+			sizes="16x16"
+			type="image/x-icon"
+		/>
+		<link
+			rel="icon"
+			href="./favicon/favicon_32.png"
+			sizes="32x32"
+			type="image/png"
+		/>
+		<link
+			rel="icon"
+			href="./favicon/favicon_48.png"
+			sizes="48x48"
+			type="image/png"
+		/>
+		<link
+			rel="icon"
+			href="./favicon/favicon_96.png"
+			sizes="96x96"
+			type="image/png"
+		/>
+		<link
+			rel="icon"
+			href="./favicon/favicon_144.png"
+			sizes="144x144"
+			type="image/png"
+		/>
+
+		<meta name="theme-color" content="#131313" />
+		<meta
+			name="description"
+			content="YouTube Music Unofficial Desktop App with built-in ad blocker and downloader"
+		/>
+		<meta
+			property="og:site_name"
+			content="YouTube&nbsp;Music&nbsp;Desktop&nbsp;App"
+		/>
+		<meta
+			property="og:url"
+			class="meta-url"
+			content="https://th-ch.github.io/youtube-music"
+		/>
+		<meta property="og:type" content="website" />
+		<meta
+			name="twitter:url"
+			class="meta-url"
+			content="https://th-ch.github.io/youtube-music"
+		/>
+
+		<link href="./style/fonts.css" rel="stylesheet" />
+		<link rel="stylesheet" href="./style/style.css" />
+		<script src="https://unpkg.com/scrollreveal"></script>
+	</head>
+	<body class="has-animations vsc-initialized" style="height: 100%;">
+		<div class="body-wrap boxed-container">
+			<header class="site-header text-light">
+				<div class="container">
+					<div class="site-header-inner">
+						<div class="brand header-brand">
+							<h1 class="m-0">
+								<a href="https://github.com/th-ch/youtube-music">
+									<img
+										class="header-logo-image"
+										src="./img/youtube-music.svg"
+										alt="YouTube Music"
+									/>
+								</a>
+							</h1>
+						</div>
+					</div>
+				</div>
+			</header>
+
+			<main>
+				<section class="hero text-center text-light">
+					<div class="hero-bg"></div>
+					<div class="hero-particles-container">
+						<canvas id="hero-particles"></canvas>
+					</div>
+					<div class="container-sm">
+						<div class="hero-inner">
+							<div class="hero-copy">
+								<h1 class="hero-title mt-0">
+									Custom YouTube Music Desktop App
+								</h1>
+								<p class="hero-paragraph">
+									Open source, cross-platform, unofficial YouTube Music Desktop
+									App with built-in <strong>ad blocker</strong> and
+									<strong>downloader</strong>
+								</p>
+								<div class="hero-cta">
+									<a
+										class="button button-primary button-wide-mobile"
+										href="https://github.com/th-ch/youtube-music/releases/latest"
+										>Download</a
+									>
+								</div>
+							</div>
+							<div class="mockup-container">
+								<div class="mockup-bg">
+									<img
+										src="./img/youtube-music.png"
+										id="mockup-header-img"
+										alt="YouTube Music"
+									/>
+								</div>
+							</div>
+						</div>
+					</div>
+				</section>
+
+				<section class="features-extended section">
+					<div class="features-extended-inner section-inner">
+						<div class="features-extended-wrap">
+							<div class="container">
+								<div class="feature-extended">
+									<div class="feature-extended-image">
+										<img
+											class="device-mockup"
+											src="./img/adblock.svg"
+											width="100px"
+											alt="Adblocker"
+											data-sr-id="0"
+											style="
+												visibility: visible;
+												opacity: 1;
+												transform: matrix3d(
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1
+												);
+												transition: opacity 0.6s
+														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+											"
+										/>
+									</div>
+									<div
+										class="feature-extended-body"
+										data-sr-id="5"
+										style="
+											visibility: visible;
+											opacity: 1;
+											transform: matrix3d(
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1
+											);
+											transition: opacity 0.6s
+													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+										"
+									>
+										<h3 class="mt-0 mb-16">Built-in adblocker</h3>
+										<p class="m-0">Block all ads and tracking out of the box</p>
+									</div>
+								</div>
+								<div class="feature-extended">
+									<div class="feature-extended-image">
+										<img
+											class="device-mockup"
+											src="./img/download.svg"
+											alt="Downloader"
+											data-sr-id="2"
+											style="
+												visibility: visible;
+												opacity: 1;
+												transform: matrix3d(
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1
+												);
+												transition: opacity 0.6s
+														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+											"
+										/>
+									</div>
+									<div
+										class="feature-extended-body"
+										data-sr-id="6"
+										style="
+											visibility: visible;
+											opacity: 1;
+											transform: matrix3d(
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1
+											);
+											transition: opacity 0.6s
+													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+										"
+									>
+										<h3 class="mt-0 mb-16">Built-in downloader</h3>
+										<p class="m-0">
+											Download (like youtube-dl) to custom formats (mp3, opus,
+											etc) directly from the interface
+										</p>
+									</div>
+								</div>
+								<div class="feature-extended">
+									<div class="feature-extended-image">
+										<img
+											class="device-mockup"
+											src="./img/plugins.svg"
+											alt="Plugins"
+											data-sr-id="3"
+											style="
+												visibility: visible;
+												opacity: 1;
+												transform: matrix3d(
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1
+												);
+												transition: opacity 0.6s
+														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+											"
+										/>
+									</div>
+									<div
+										class="feature-extended-body"
+										data-sr-id="7"
+										style="
+											visibility: visible;
+											opacity: 1;
+											transform: matrix3d(
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1
+											);
+											transition: opacity 0.6s
+													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+										"
+									>
+										<h3 class="mt-0 mb-16">Many other plugins in one click</h3>
+										<p class="m-0">
+											Enhance your user experience with media keys, integrations
+											(Discord), cosmetic filters, notifications, TouchBar,
+											auto-unpause and many more! Every plugin can be enabled or
+											disabled in one click.
+										</p>
+									</div>
+								</div>
+								<div class="feature-extended">
+									<div class="feature-extended-image">
+										<img
+											class="device-mockup"
+											src="./img/code.svg"
+											alt="Code"
+											data-sr-id="4"
+											style="
+												visibility: visible;
+												width: 200%;
+												opacity: 1;
+												transform: matrix3d(
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1,
+													0,
+													0,
+													0,
+													0,
+													1
+												);
+												transition: opacity 0.6s
+														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+											"
+										/>
+									</div>
+									<div
+										class="feature-extended-body"
+										data-sr-id="8"
+										style="
+											visibility: visible;
+											opacity: 1;
+											transform: matrix3d(
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1,
+												0,
+												0,
+												0,
+												0,
+												1
+											);
+											transition: opacity 0.6s
+													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
+												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
+										"
+									>
+										<h3 class="mt-0 mb-16">Open source & Cross platform</h3>
+										<p class="m-0">
+											Available for Windows (installer and portable), Mac and
+											Linux (AppImage, deb, etc)
+										</p>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="main-particles-container">
+						<canvas id="main-particles"></canvas>
+					</div>
+				</section>
+			</main>
+
+			<footer class="site-footer">
+				<div class="footer-particles-container">
+					<canvas id="footer-particles"></canvas>
+				</div>
+				<div class="site-footer-top">
+					<section class="cta section text-light">
+						<div class="container-sm">
+							<div class="cta-inner section-inner">
+								<div class="cta-header text-center">
+									<h2 class="section-title mt-0">Download and/or contribute</h2>
+									<p class="section-paragraph">Pull requests welcome!</p>
+									<div class="cta-cta">
+										<a
+											class="button button-primary button-wide-mobile"
+											href="https://github.com/th-ch/youtube-music"
+											>Go to code</a
+										>
+									</div>
+								</div>
+							</div>
+						</div>
+					</section>
+				</div>
+				<div class="site-footer-bottom">
+					<div class="container">
+						<div class="site-footer-inner">
+							<div class="brand footer-brand">
+								<a href="https://github.com/th-ch/youtube-music">
+									<img src="./img/youtube-music.svg" alt="YouTube Music logo" />
+								</a>
+							</div>
+							<ul class="footer-links list-reset">
+								<li>
+									<a href="https://github.com/th-ch/youtube-music">Main page</a>
+								</li>
+								<li>
+									<a href="https://github.com/th-ch/youtube-music/issues"
+										>Issues</a
+									>
+								</li>
+								<li>
+									<a href="https://github.com/th-ch/youtube-music/pulls"
+										>Pull requests</a
+									>
+								</li>
+							</ul>
+							<ul class="footer-social-links list-reset">
+								<li>
+									<a href="https://github.com/th-ch/youtube-music">
+										<span class="screen-reader-text">GitHub</span>
+										<svg
+											xmlns="http://www.w3.org/2000/svg"
+											width="16"
+											height="16"
+											viewBox="0 0 1792 1792"
+										>
+											<path
+												d="M896 128q209 0 385.5 103t279.5 279.5 103 385.5q0 251-146.5 451.5t-378.5 277.5q-27 5-40-7t-13-30q0-3 .5-76.5t.5-134.5q0-97-52-142 57-6 102.5-18t94-39 81-66.5 53-105 20.5-150.5q0-119-79-206 37-91-8-204-28-9-81 11t-92 44l-38 24q-93-26-192-26t-192 26q-16-11-42.5-27t-83.5-38.5-85-13.5q-45 113-8 204-79 87-79 206 0 85 20.5 150t52.5 105 80.5 67 94 39 102.5 18q-39 36-49 103-21 10-45 15t-57 5-65.5-21.5-55.5-62.5q-19-32-48.5-52t-49.5-24l-20-3q-21 0-29 4.5t-5 11.5 9 14 13 12l7 5q22 10 43.5 38t31.5 51l10 23q13 38 44 61.5t67 30 69.5 7 55.5-3.5l23-4q0 38 .5 88.5t.5 54.5q0 18-13 30t-40 7q-232-77-378.5-277.5t-146.5-451.5q0-209 103-385.5t279.5-279.5 385.5-103zm-477 1103q3-7-7-12-10-3-13 2-3 7 7 12 9 6 13-2zm31 34q7-5-2-16-10-9-16-3-7 5 2 16 10 10 16 3zm30 45q9-7 0-19-8-13-17-6-9 5 0 18t17 7zm42 42q8-8-4-19-12-12-20-3-9 8 4 19 12 12 20 3zm57 25q3-11-13-16-15-4-19 7t13 15q15 6 19-6zm63 5q0-13-17-11-16 0-16 11 0 13 17 11 16 0 16-11zm58-10q-2-11-18-9-16 3-14 15t18 8 14-14z"
+												fill="#fff"
+											/>
+										</svg>
+									</a>
+								</li>
+							</ul>
+							<div class="footer-copyright">© 2021 th-ch</div>
+						</div>
+					</div>
+				</div>
+			</footer>
+		</div>
+
+		<script src="./js/main.js"></script>
+	</body>
+</html>

docs/js/main.js

@@ -0,0 +1,262 @@
+// Constants
+const element = document.documentElement,
+  body = document.body,
+  revealOnScroll = (window.sr = ScrollReveal({ mobile: false }));
+
+// Load animations
+element.classList.remove("no-js");
+element.classList.add("js");
+window.addEventListener("load", function () {
+  body.classList.add("is-loaded");
+});
+
+if (body.classList.contains("has-animations")) {
+  window.addEventListener("load", function () {
+    revealOnScroll.reveal(".feature-extended .device-mockup", {
+      duration: 600,
+      distance: "100px",
+      easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+      origin: "bottom",
+      viewFactor: 0.6,
+    });
+    revealOnScroll.reveal(".feature-extended .feature-extended-body", {
+      duration: 600,
+      distance: "40px",
+      easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+      origin: "top",
+      viewFactor: 0.6,
+    });
+  });
+}
+
+// Bubble canvas
+let bubbleCanvas = function (t) {
+  let e = this;
+  e.parentNode = t;
+  e.setCanvasSize();
+  window.addEventListener("resize", function () {
+    e.setCanvasSize();
+  });
+  e.mouseX = 0;
+  e.mouseY = 0;
+  window.addEventListener("mousemove", function (t) {
+    (e.mouseX = t.clientX), (e.mouseY = t.clientY);
+  });
+  e.randomise();
+};
+
+bubbleCanvas.prototype.setCanvasSize = function () {
+  this.canvasWidth = this.parentNode.clientWidth;
+  this.canvasHeight = this.parentNode.clientHeight;
+};
+
+bubbleCanvas.prototype.generateDecimalBetween = function (start, end) {
+  return (Math.random() * (start - end) + end).toFixed(2);
+};
+
+bubbleCanvas.prototype.update = function () {
+  let t = this;
+  t.translateX = t.translateX - t.movementX;
+  t.translateY = t.translateY - t.movementY;
+  t.posX += (t.mouseX / (t.staticity / t.magnetism) - t.posX) / t.smoothFactor;
+  t.posY += (t.mouseY / (t.staticity / t.magnetism) - t.posY) / t.smoothFactor;
+  if (
+    t.translateY + t.posY < 0 ||
+    t.translateX + t.posX < 0 ||
+    t.translateX + t.posX > t.canvasWidth
+  ) {
+    t.randomise();
+    t.translateY = t.canvasHeight;
+  }
+};
+
+bubbleCanvas.prototype.randomise = function () {
+  this.colors = ["195,53,46", "172,54,46"];
+
+  this.velocity = 20;
+  this.smoothFactor = 50;
+  this.staticity = 30;
+  this.magnetism = 0.1 + 4 * Math.random();
+  this.color = this.colors[Math.floor(Math.random() * this.colors.length)];
+  this.alpha = this.generateDecimalBetween(5, 10) / 10;
+  this.size = this.generateDecimalBetween(1, 4);
+  this.posX = 0;
+  this.posY = 0;
+  this.movementX = this.generateDecimalBetween(-2, 2) / this.velocity;
+  this.movementY = this.generateDecimalBetween(1, 20) / this.velocity;
+  this.translateX = this.generateDecimalBetween(0, this.canvasWidth);
+  this.translateY = this.generateDecimalBetween(0, this.canvasHeight);
+};
+
+let drawBubbleCanvas = function (t) {
+  this.canvas = document.getElementById(t);
+  this.ctx = this.canvas.getContext("2d");
+  this.dpr = window.devicePixelRatio;
+};
+
+drawBubbleCanvas.prototype.start = function (bubbleDensity) {
+  let t = this;
+  t.bubbleDensity = bubbleDensity;
+  t.setCanvasSize();
+  window.addEventListener("resize", function () {
+    t.setCanvasSize();
+  });
+  t.bubblesList = [];
+  t.generateBubbles();
+  t.animate();
+};
+
+drawBubbleCanvas.prototype.setCanvasSize = function () {
+  this.container = this.canvas.parentNode;
+  this.w = this.container.offsetWidth;
+  this.h = this.container.offsetHeight;
+  this.wdpi = this.w * this.dpr;
+  this.hdpi = this.h * this.dpr;
+  this.canvas.width = this.wdpi;
+  this.canvas.height = this.hdpi;
+  this.canvas.style.width = this.w + "px";
+  this.canvas.style.height = this.h + "px";
+  this.ctx.scale(this.dpr, this.dpr);
+};
+
+drawBubbleCanvas.prototype.animate = function () {
+  let t = this;
+  t.ctx.clearRect(0, 0, t.canvas.clientWidth, t.canvas.clientHeight);
+  t.bubblesList.forEach(function (e) {
+    e.update();
+    t.ctx.translate(e.translateX, e.translateY);
+    t.ctx.beginPath();
+    t.ctx.arc(e.posX, e.posY, e.size, 0, 2 * Math.PI);
+    t.ctx.fillStyle = "rgba(" + e.color + "," + e.alpha + ")";
+    t.ctx.fill();
+    t.ctx.setTransform(t.dpr, 0, 0, t.dpr, 0, 0);
+  });
+  requestAnimationFrame(this.animate.bind(this));
+};
+
+drawBubbleCanvas.prototype.addBubble = function (t) {
+  return this.bubblesList.push(t);
+};
+
+drawBubbleCanvas.prototype.generateBubbles = function () {
+  let t = this;
+  for (let e = 0; e < t.bubbleDensity; e++)
+    t.addBubble(new bubbleCanvas(t.canvas.parentNode));
+};
+
+// Night sky with stars canvas
+let starCanvas = function (t) {
+  this.canvas = document.getElementById(t);
+  this.ctx = this.canvas.getContext("2d");
+  this.dpr = window.devicePixelRatio;
+};
+
+starCanvas.prototype.start = function () {
+  let w;
+  let h;
+
+  const setCanvasExtents = () => {
+	w = this.canvas.parentNode.clientWidth;
+	h = this.canvas.parentNode.clientHeight;
+    this.canvas.width = w;
+    this.canvas.height = h;
+  };
+
+  setCanvasExtents();
+
+  window.onresize = () => {
+    setCanvasExtents();
+  };
+
+  const makeStars = (count) => {
+    const out = [];
+    for (let i = 0; i < count; i++) {
+      const s = {
+        x: Math.random() * w - w / 2,
+        y: Math.random() * h - h / 2,
+        z: Math.random() * 1000,
+      };
+      out.push(s);
+    }
+    return out;
+  };
+
+  let stars = makeStars(10000);
+
+  const clear = () => {
+    this.ctx.fillStyle = "#212121";
+    this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
+  };
+
+  const putPixel = (x, y, brightness) => {
+    const intensity = brightness * 255;
+    const rgb = "rgb(" + intensity + "," + intensity + "," + intensity + ")";
+    this.ctx.beginPath();
+    this.ctx.arc(x, y, 0.9, 0, 2 * Math.PI);
+    this.ctx.fillStyle = rgb;
+    this.ctx.fill();
+  };
+
+  const moveStars = (distance) => {
+    const count = stars.length;
+    for (var i = 0; i < count; i++) {
+      const s = stars[i];
+      s.z -= distance;
+      while (s.z <= 1) {
+        s.z += 1000;
+      }
+    }
+  };
+
+  let prevTime;
+  const init = (time) => {
+    prevTime = time;
+    requestAnimationFrame(tick);
+  };
+
+  const tick = (time) => {
+    let elapsed = time - prevTime;
+    prevTime = time;
+
+    moveStars(elapsed * 0.1);
+
+    clear();
+
+    const cx = w / 2;
+    const cy = h / 2;
+
+    const count = stars.length;
+    for (var i = 0; i < count; i++) {
+      const star = stars[i];
+
+      const x = cx + star.x / (star.z * 0.001);
+      const y = cy + star.y / (star.z * 0.001);
+
+      if (x < 0 || x >= w || y < 0 || y >= h) {
+        continue;
+      }
+
+      const d = star.z / 1000.0;
+      const b = 1 - d * d;
+
+      putPixel(x, y, b);
+    }
+
+    requestAnimationFrame(tick);
+  };
+
+  requestAnimationFrame(init);
+};
+
+// Start canvas animations
+window.addEventListener("load", function () {
+  // Stars
+  const headCanvas = new starCanvas("hero-particles");
+  // Bubbles
+  const footerCanvas = new drawBubbleCanvas("footer-particles");
+  const mainCanvas = new drawBubbleCanvas("main-particles");
+
+  headCanvas.start();
+  footerCanvas.start(30);
+  mainCanvas.start(200);
+});

docs/style/fonts.css

@@ -0,0 +1,48 @@
+/* hebrew */
+@font-face {
+  font-family: 'Heebo';
+  font-style: normal;
+  font-weight: 400;
+  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H0TbFhsqMA6aw.woff2) format('woff2');
+  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
+}
+/* latin */
+@font-face {
+  font-family: 'Heebo';
+  font-style: normal;
+  font-weight: 400;
+  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H2TbFhsqMA.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* hebrew */
+@font-face {
+  font-family: 'Heebo';
+  font-style: normal;
+  font-weight: 700;
+  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H0TbFhsqMA6aw.woff2) format('woff2');
+  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
+}
+/* latin */
+@font-face {
+  font-family: 'Heebo';
+  font-style: normal;
+  font-weight: 700;
+  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H2TbFhsqMA.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Oxygen';
+  font-style: normal;
+  font-weight: 700;
+  src: url(https://fonts.gstatic.com/s/oxygen/v10/2sDcZG1Wl4LcnbuCNWgzZmW5Kb8VZBHR.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Oxygen';
+  font-style: normal;
+  font-weight: 700;
+  src: url(https://fonts.gstatic.com/s/oxygen/v10/2sDcZG1Wl4LcnbuCNWgzaGW5Kb8VZA.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

index.js

@@ -2,7 +2,9 @@
 const path = require("path");
 
 const electron = require("electron");
+const enhanceWebRequest = require("electron-better-web-request").default;
 const is = require("electron-is");
+const unhandled = require("electron-unhandled");
 const { autoUpdater } = require("electron-updater");
 
 const config = require("./config");
@@ -10,13 +12,29 @@ const { setApplicationMenu } = require("./menu");
 const { fileExists, injectCSS } = require("./plugins/utils");
 const { isTesting } = require("./utils/testing");
 const { setUpTray } = require("./tray");
+const { setupSongInfo } = require("./providers/song-info");
+const { setupAppControls, restart } = require("./providers/app-controls");
+const { APP_PROTOCOL, setupProtocolHandler, handleProtocol } = require("./providers/protocol-handler");
+
+// Catch errors and log them
+unhandled({
+	logger: console.error,
+	showDialog: false,
+});
+
+// Disable Node options if the env var is set
+process.env.NODE_OPTIONS = "";
 
 const app = electron.app;
-app.commandLine.appendSwitch(
-	"js-flags",
-	// WebAssembly flags
-	"--experimental-wasm-threads --experimental-wasm-bulk-memory"
-);
+// Prevent window being garbage collected
+let mainWindow;
+autoUpdater.autoDownload = false;
+
+
+const gotTheLock = app.requestSingleInstanceLock();
+if (!gotTheLock) app.exit();
+
+app.commandLine.appendSwitch("enable-features", "SharedArrayBuffer"); // Required for downloader
 app.allowRendererProcessReuse = true; // https://github.com/electron/electron/issues/18397
 if (config.get("options.disableHardwareAcceleration")) {
 	if (is.dev()) {
@@ -25,12 +43,19 @@ if (config.get("options.disableHardwareAcceleration")) {
 	app.disableHardwareAcceleration();
 }
 
-// Adds debug features like hotkeys for triggering dev tools and reload
-require("electron-debug")();
+if (is.linux() && config.plugins.isEnabled("shortcuts")) {
+	//stops chromium from launching it's own mpris service
+	app.commandLine.appendSwitch('disable-features', 'MediaSessionService');
+}
 
-// Prevent window being garbage collected
-let mainWindow;
-autoUpdater.autoDownload = false;
+if (config.get("options.proxy")) {
+	app.commandLine.appendSwitch("proxy-server", config.get("options.proxy"));
+}
+
+// Adds debug features like hotkeys for triggering dev tools and reload
+require("electron-debug")({
+	showDevTools: false //disable automatic devTools on new window
+});
 
 let icon = "assets/youtube-music.png";
 if (process.platform == "win32") {
@@ -45,9 +70,26 @@ function onClosed() {
 	mainWindow = null;
 }
 
+/** @param {Electron.BrowserWindow} win */
 function loadPlugins(win) {
 	injectCSS(win.webContents, path.join(__dirname, "youtube-music.css"));
-	win.webContents.on("did-finish-load", () => {
+	// Load user CSS
+	const themes = config.get("options.themes");
+	if (Array.isArray(themes)) {
+		themes.forEach((cssFile) => {
+			fileExists(
+				cssFile,
+				() => {
+					injectCSS(win.webContents, cssFile);
+				},
+				() => {
+					console.warn(`CSS file "${cssFile}" does not exist, ignoring`);
+				}
+			);
+		});
+	}
+
+	win.webContents.once("did-finish-load", () => {
 		if (is.dev()) {
 			console.log("did finish load");
 			win.webContents.openDevTools();
@@ -67,6 +109,8 @@ function loadPlugins(win) {
 function createMainWindow() {
 	const windowSize = config.get("window-size");
 	const windowMaximized = config.get("window-maximized");
+	const windowPosition = config.get("window-position");
+	const useInlineMenu = config.plugins.isEnabled("in-app-menu");
 
 	const win = new electron.BrowserWindow({
 		icon: icon,
@@ -75,96 +119,193 @@ function createMainWindow() {
 		backgroundColor: "#000",
 		show: false,
 		webPreferences: {
-			nodeIntegration: isTesting(), // Only necessary when testing with Spectron
+			// TODO: re-enable contextIsolation once it can work with ffmepg.wasm
+			// Possible bundling? https://github.com/ffmpegwasm/ffmpeg.wasm/issues/126
+			contextIsolation: false,
 			preload: path.join(__dirname, "preload.js"),
 			nodeIntegrationInSubFrames: true,
-			nativeWindowOpen: true, // window.open return Window object(like in regular browsers), not BrowserWindowProxy
-			enableRemoteModule: true,
 			affinity: "main-window", // main window, and addition windows should work in one process
+			...(!isTesting()
+				? {
+						// Sandbox is only enabled in tests for now
+						// See https://www.electronjs.org/docs/latest/tutorial/sandbox#preload-scripts
+						sandbox: false,
+				  }
+				: undefined),
 		},
-		frame: !is.macOS(),
-		titleBarStyle: is.macOS() ? "hiddenInset" : "default",
+		frame: !is.macOS() && !useInlineMenu,
+		titleBarStyle: useInlineMenu
+			? "hidden"
+			: is.macOS()
+			? "hiddenInset"
+			: "default",
 		autoHideMenuBar: config.get("options.hideMenu"),
 	});
+	loadPlugins(win);
+
+	if (windowPosition) {
+		const { x, y } = windowPosition;
+		const winSize = win.getSize();
+		const displaySize =
+			electron.screen.getDisplayNearestPoint(windowPosition).bounds;
+		if (
+			x + winSize[0] < displaySize.x - 8 ||
+			x - winSize[0] > displaySize.x + displaySize.width ||
+			y < displaySize.y - 8 ||
+			y > displaySize.y + displaySize.height
+		) {
+			//Window is offscreen
+			if (is.dev()) {
+				console.log(
+					`Window tried to render offscreen, windowSize=${winSize}, displaySize=${displaySize}, position=${windowPosition}`
+				);
+			}
+		} else {
+			win.setPosition(x, y);
+		}
+	}
 	if (windowMaximized) {
 		win.maximize();
 	}
 
-	win.webContents.loadURL(config.get("url"));
+	if(config.get("options.alwaysOnTop")){
+		win.setAlwaysOnTop(true);
+	}
+
+	const urlToLoad = config.get("options.resumeOnStart")
+		? config.get("url")
+		: config.defaultConfig.url;
+	win.webContents.loadURL(urlToLoad);
 	win.on("closed", onClosed);
 
+	const setPiPOptions = config.plugins.isEnabled("picture-in-picture")
+		? (key, value) => require("./plugins/picture-in-picture/back").setOptions({ [key]: value })
+		: () => {};
+
 	win.on("move", () => {
+		if (win.isMaximized()) return;
 		let position = win.getPosition();
-		config.set("window-position", { x: position[0], y: position[1] });
+		const isPiPEnabled =
+			config.plugins.isEnabled("picture-in-picture") &&
+			config.plugins.getOptions("picture-in-picture")["isInPiP"];
+		if (!isPiPEnabled) {
+			lateSave("window-position", { x: position[0], y: position[1] });
+		} else if(config.plugins.getOptions("picture-in-picture")["savePosition"]) {
+			lateSave("pip-position", position, setPiPOptions);
+		}
 	});
 
+	let winWasMaximized;
+
 	win.on("resize", () => {
 		const windowSize = win.getSize();
+		const isMaximized = win.isMaximized();
 
-		config.set("window-maximized", win.isMaximized());
-		if (!win.isMaximized()) {
-			config.set("window-size", {
+		const isPiPEnabled =
+			config.plugins.isEnabled("picture-in-picture") &&
+			config.plugins.getOptions("picture-in-picture")["isInPiP"];
+
+		if (!isPiPEnabled && winWasMaximized !== isMaximized) {
+			winWasMaximized = isMaximized;
+			config.set("window-maximized", isMaximized);
+		}
+		if (isMaximized) return;
+
+		if (!isPiPEnabled) {
+			lateSave("window-size", {
 				width: windowSize[0],
 				height: windowSize[1],
 			});
+		} else if(config.plugins.getOptions("picture-in-picture")["saveSize"]) {
+			lateSave("pip-size", windowSize, setPiPOptions);
 		}
 	});
 
+	let savedTimeouts = {};
+	function lateSave(key, value, fn = config.set) {
+		if (savedTimeouts[key]) clearTimeout(savedTimeouts[key]);
+
+		savedTimeouts[key] = setTimeout(() => {
+			fn(key, value);
+			savedTimeouts[key] = undefined;
+		}, 600);
+	}
+
+	win.webContents.on("render-process-gone", (event, webContents, details) => {
+		showUnresponsiveDialog(win, details);
+	});
+
 	win.once("ready-to-show", () => {
 		if (config.get("options.appVisible")) {
 			win.show();
 		}
 	});
 
+	removeContentSecurityPolicy();
+
 	return win;
 }
 
-app.on("browser-window-created", (event, win) => {
-	loadPlugins(win);
-
-	win.webContents.on("did-fail-load", () => {
-		if (is.dev()) {
-			console.log("did fail load");
+app.once("browser-window-created", (event, win) => {
+	if (config.get("options.overrideUserAgent")) {
+		// User agents are from https://developers.whatismybrowser.com/useragents/explore/
+		const originalUserAgent = win.webContents.userAgent;
+		const userAgents = {
+			mac: "Mozilla/5.0 (Macintosh; Intel Mac OS X 12.1; rv:95.0) Gecko/20100101 Firefox/95.0",
+			windows: "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:95.0) Gecko/20100101 Firefox/95.0",
+			linux: "Mozilla/5.0 (Linux x86_64; rv:95.0) Gecko/20100101 Firefox/95.0",
+		}
+
+		const updatedUserAgent =
+			is.macOS() ? userAgents.mac :
+				is.windows() ? userAgents.windows :
+					userAgents.linux;
+
+		win.webContents.userAgent = updatedUserAgent;
+		app.userAgentFallback = updatedUserAgent;
+
+		win.webContents.session.webRequest.onBeforeSendHeaders((details, cb) => {
+			// this will only happen if login failed, and "retry" was pressed
+			if (win.webContents.getURL().startsWith("https://accounts.google.com") && details.url.startsWith("https://accounts.google.com")) {
+				details.requestHeaders["User-Agent"] = originalUserAgent;
+			}
+			cb({ requestHeaders: details.requestHeaders });
+		});
+	}
+
+	setupSongInfo(win);
+	setupAppControls();
+
+	win.webContents.on("did-fail-load", (
+		_event,
+		errorCode,
+		errorDescription,
+		validatedURL,
+		isMainFrame,
+		frameProcessId,
+		frameRoutingId,
+	) => {
+		const log = JSON.stringify({
+			error: "did-fail-load",
+			errorCode,
+			errorDescription,
+			validatedURL,
+			isMainFrame,
+			frameProcessId,
+			frameRoutingId,
+		}, null, "\t");
+		if (is.dev()) {
+			console.log(log);
+		}
+		if( !(config.plugins.isEnabled("in-app-menu") && errorCode === -3)) { // -3 is a false positive with in-app-menu
+			win.webContents.send("log", log);
+			win.webContents.loadFile(path.join(__dirname, "error.html"));
 		}
-		win.webContents.loadFile(path.join(__dirname, "error.html"));
 	});
 
 	win.webContents.on("will-prevent-unload", (event) => {
 		event.preventDefault();
 	});
-
-	win.webContents.on("did-navigate-in-page", () => {
-		const url = win.webContents.getURL();
-		if (url.startsWith("https://music.youtube.com")) {
-			config.set("url", url);
-		}
-	});
-
-	win.webContents.on("will-navigate", (_, url) => {
-		if (url.startsWith("https://accounts.google.com")) {
-			// Force user-agent "Firefox Windows" for Google OAuth to work
-			// From https://github.com/firebase/firebase-js-sdk/issues/2478#issuecomment-571356751
-			// Only set on accounts.google.com, otherwise querySelectors in preload scripts fail (?)
-			const userAgent =
-				"Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:70.0) Gecko/20100101 Firefox/70.0";
-
-			win.webContents.session.webRequest.onBeforeSendHeaders((details, cb) => {
-				details.requestHeaders["User-Agent"] = userAgent;
-				cb({ requestHeaders: details.requestHeaders });
-			});
-		}
-	});
-
-	win.webContents.on(
-		"new-window",
-		(e, url, frameName, disposition, options) => {
-			// hook on new opened window
-
-			// at now new window in mainWindow renderer process.
-			// Also, this will automatically get an option `nodeIntegration=false`(not override to true, like in iframe's) - like in regular browsers
-			options.webPreferences.affinity = "main-window";
-		}
-	);
 });
 
 app.on("window-all-closed", () => {
@@ -187,20 +328,81 @@ app.on("activate", () => {
 });
 
 app.on("ready", () => {
+	if (config.get("options.autoResetAppCache")) {
+		// Clear cache after 20s
+		const clearCacheTimeout = setTimeout(() => {
+			if (is.dev()) {
+				console.log("Clearing app cache.");
+			}
+			electron.session.defaultSession.clearCache();
+			clearTimeout(clearCacheTimeout);
+		}, 20000);
+	}
+
+	// Register appID on windows
+	if (is.windows()) {
+		const appID = "com.github.th-ch.youtube-music";
+		app.setAppUserModelId(appID);
+		const appLocation = process.execPath;
+		const appData = app.getPath("appData");
+		// check shortcut validity if not in dev mode / running portable app
+		if (!is.dev() && !appLocation.startsWith(path.join(appData, "..", "Local", "Temp"))) {
+			const shortcutPath = path.join(appData, "Microsoft", "Windows", "Start Menu", "Programs", "YouTube Music.lnk");
+			try { // check if shortcut is registered and valid
+				const shortcutDetails = electron.shell.readShortcutLink(shortcutPath); // throw error if doesn't exist yet
+				if (
+					shortcutDetails.target !== appLocation ||
+					shortcutDetails.appUserModelId !== appID
+				) {
+					throw "needUpdate";
+				}
+			} catch (error) { // if not valid -> Register shortcut
+				electron.shell.writeShortcutLink(
+					shortcutPath,
+					error === "needUpdate" ? "update" : "create",
+					{
+						target: appLocation,
+						cwd: path.dirname(appLocation),
+						description: "YouTube Music Desktop App - including custom plugins",
+						appUserModelId: appID,
+					}
+				);
+			}
+		}
+	}
+
 	mainWindow = createMainWindow();
 	setApplicationMenu(mainWindow);
-	config.watch(() => {
-		setApplicationMenu(mainWindow);
-	});
 	setUpTray(app, mainWindow);
 
+	setupProtocolHandler(mainWindow);
+
+	app.on('second-instance', (_event, commandLine, _workingDirectory) => {
+		const uri = `${APP_PROTOCOL}://`;
+		const protocolArgv = commandLine.find(arg => arg.startsWith(uri));
+		if (protocolArgv) {
+			const lastIndex = protocolArgv.endsWith("/") ? -1 : undefined;
+			const command = protocolArgv.slice(uri.length, lastIndex);
+			if (is.dev()) console.debug(`Received command over protocol: "${command}"`);
+			handleProtocol(command);
+			return;
+		}
+		if (!mainWindow) return;
+		if (mainWindow.isMinimized()) mainWindow.restore();
+		if (!mainWindow.isVisible()) mainWindow.show();
+		mainWindow.focus();
+	});
+
 	// Autostart at login
 	app.setLoginItemSettings({
 		openAtLogin: config.get("options.startAtLogin"),
 	});
 
 	if (!is.dev() && config.get("options.autoUpdates")) {
-		autoUpdater.checkForUpdatesAndNotify();
+		const updateTimeout = setTimeout(() => {
+			autoUpdater.checkForUpdatesAndNotify();
+			clearTimeout(updateTimeout);
+		}, 2000);
 		autoUpdater.on("update-available", () => {
 			const downloadLink =
 				"https://github.com/th-ch/youtube-music/releases/latest";
@@ -228,14 +430,20 @@ app.on("ready", () => {
 		});
 	}
 
-	// Optimized for Mac OS X
-	if (is.macOS()) {
-		if (!config.get("options.appVisible")) {
-			app.dock.hide();
-		}
+	if (config.get("options.hideMenu") && !config.get("options.hideMenuWarned")) {
+		electron.dialog.showMessageBox(mainWindow, {
+			type: 'info', title: 'Hide Menu Enabled',
+			message: "Menu is hidden, use 'Alt' to show it (or 'Escape' if using in-app-menu)"
+		});
+		config.set("options.hideMenuWarned", true);
 	}
 
-	var forceQuit = false;
+	// Optimized for Mac OS X
+	if (is.macOS() && !config.get("options.appVisible")) {
+		app.dock.hide();
+	}
+
+	let forceQuit = false;
 	app.on("before-quit", () => {
 		forceQuit = true;
 	});
@@ -250,3 +458,59 @@ app.on("ready", () => {
 		});
 	}
 });
+
+function showUnresponsiveDialog(win, details) {
+	if (!!details) {
+		console.log("Unresponsive Error!\n"+JSON.stringify(details, null, "\t"))
+	}
+	electron.dialog.showMessageBox(win, {
+		type: "error",
+		title: "Window Unresponsive",
+		message: "The Application is Unresponsive",
+		details: "We are sorry for the inconvenience! please choose what to do:",
+		buttons: ["Wait", "Relaunch", "Quit"],
+		cancelId: 0
+	}).then( result => {
+		switch (result.response) {
+			case 1: restart(); break;
+			case 2: app.quit(); break;
+		}
+	});
+}
+
+function removeContentSecurityPolicy(
+	session = electron.session.defaultSession
+) {
+	// Allows defining multiple "onHeadersReceived" listeners
+	// by enhancing the session.
+	// Some plugins (e.g. adblocker) also define a "onHeadersReceived" listener
+	enhanceWebRequest(session);
+
+	// Custom listener to tweak the content security policy
+	session.webRequest.onHeadersReceived(function (details, callback) {
+		details.responseHeaders ??= {}
+
+		// Remove the content security policy
+		delete details.responseHeaders["content-security-policy-report-only"];
+		delete details.responseHeaders["content-security-policy"];
+
+		callback({ cancel: false, responseHeaders: details.responseHeaders });
+	});
+
+	// When multiple listeners are defined, apply them all
+	session.webRequest.setResolver("onHeadersReceived", (listeners) => {
+		const response = listeners.reduce(
+			async (accumulator, listener) => {
+				if (accumulator.cancel) {
+					return accumulator;
+				}
+
+				const result = await listener.apply();
+				return { ...accumulator, ...result };
+			},
+			{ cancel: false }
+		);
+
+		return response;
+	});
+}

jest.config.js

@@ -1,7 +0,0 @@
-module.exports = {
-	globals: {
-		__APP__: undefined, // A different app will be launched in each test environment
-	},
-	testEnvironment: "./tests/environment",
-	testTimeout: 30000, // 30s
-};

menu.js

@@ -1,138 +1,384 @@
-const { app, Menu } = require("electron");
+const { existsSync } = require("fs");
+const path = require("path");
+
+const { app, clipboard, Menu, dialog } = require("electron");
 const is = require("electron-is");
+const { restart } = require("./providers/app-controls");
 
 const { getAllPlugins } = require("./plugins/utils");
 const config = require("./config");
+const { startingPages } = require("./providers/extracted-data");
 
-const mainMenuTemplate = (win) => [
-	{
-		label: "Plugins",
-		submenu: [
-			...getAllPlugins().map((plugin) => {
-				return {
-					label: plugin,
-					type: "checkbox",
-					checked: config.plugins.isEnabled(plugin),
-					click: (item) => {
-						if (item.checked) {
-							config.plugins.enable(plugin);
-						} else {
-							config.plugins.disable(plugin);
-						}
-					},
-				};
-			}),
-			{ type: "separator" },
-			{
-				label: "Advanced options",
-				click: () => {
-					config.edit();
-				},
-			},
-		],
+const prompt = require("custom-electron-prompt");
+const promptOptions = require("./providers/prompt-options");
+
+// true only if in-app-menu was loaded on launch
+const inAppMenuActive = config.plugins.isEnabled("in-app-menu");
+
+const pluginEnabledMenu = (plugin, label = "", hasSubmenu = false, refreshMenu = undefined) => ({
+	label: label || plugin,
+	type: "checkbox",
+	checked: config.plugins.isEnabled(plugin),
+	click: (item) => {
+		if (item.checked) {
+			config.plugins.enable(plugin);
+		} else {
+			config.plugins.disable(plugin);
+		}
+		if (hasSubmenu) {
+			refreshMenu();
+		}
 	},
-	{
-		label: "Options",
-		submenu: [
-			{
-				label: "Auto-update",
-				type: "checkbox",
-				checked: config.get("options.autoUpdates"),
-				click: (item) => {
-					config.set("options.autoUpdates", item.checked);
+});
+
+const mainMenuTemplate = (win) => {
+	const refreshMenu = () => {
+		this.setApplicationMenu(win);
+		if (inAppMenuActive) {
+			win.webContents.send("refreshMenu");
+		}
+	}
+	return [
+		{
+			label: "Plugins",
+			submenu: [
+				...getAllPlugins().map((plugin) => {
+					const pluginPath = path.join(__dirname, "plugins", plugin, "menu.js")
+					if (existsSync(pluginPath)) {
+						let pluginLabel = plugin;
+						if (pluginLabel === "crossfade") {
+							pluginLabel = "crossfade [beta]";
+						}
+						if (!config.plugins.isEnabled(plugin)) {
+							return pluginEnabledMenu(plugin, pluginLabel, true, refreshMenu);
+						}
+						const getPluginMenu = require(pluginPath);
+						return {
+							label: pluginLabel,
+							submenu: [
+								pluginEnabledMenu(plugin, "Enabled", true, refreshMenu),
+								{ type: "separator" },
+								...getPluginMenu(win, config.plugins.getOptions(plugin), refreshMenu),
+							],
+						};
+					}
+					return pluginEnabledMenu(plugin);
+				}),
+			],
+		},
+		{
+			label: "Options",
+			submenu: [
+				{
+					label: "Auto-update",
+					type: "checkbox",
+					checked: config.get("options.autoUpdates"),
+					click: (item) => {
+						config.setMenuOption("options.autoUpdates", item.checked);
+					},
 				},
-			},
-			{
-				label: "Disable hardware acceleration",
-				type: "checkbox",
-				checked: config.get("options.disableHardwareAcceleration"),
-				click: (item) => {
-					config.set("options.disableHardwareAcceleration", item.checked);
+				{
+					label: "Resume last song when app starts",
+					type: "checkbox",
+					checked: config.get("options.resumeOnStart"),
+					click: (item) => {
+						config.setMenuOption("options.resumeOnStart", item.checked);
+					},
 				},
-			},
-			...(is.windows() || is.linux()
-				? [
+				{
+					label: 'Starting page',
+					submenu: Object.keys(startingPages).map((name) => ({
+						label: name,
+						type: 'radio',
+						checked: config.get('options.startingPage') === name,
+						click: () => {
+							config.set('options.startingPage', name);
+						},
+					}))
+				},
+				{
+					label: "Visual Tweaks",
+					submenu: [
+						{
+							label: "Remove upgrade button",
+							type: "checkbox",
+							checked: config.get("options.removeUpgradeButton"),
+							click: (item) => {
+								config.setMenuOption("options.removeUpgradeButton", item.checked);
+							},
+						},
+						{
+							label: "Like buttons",
+							submenu: [
+								{
+									label: "Default",
+									type: "radio",
+									checked: !config.get("options.likeButtons"),
+									click: () => {
+										config.set("options.likeButtons", '');
+									},
+								},
+								{
+									label: "Force show",
+									type: "radio",
+									checked: config.get("options.likeButtons") === 'force',
+									click: () => {
+										config.set("options.likeButtons", 'force');
+									}
+								},
+								{
+									label: "Hide",
+									type: "radio",
+									checked: config.get("options.likeButtons") === 'hide',
+									click: () => {
+										config.set("options.likeButtons", 'hide');
+									}
+								},
+							],
+						},
+						{
+							label: "Theme",
+							submenu: [
+								{
+									label: "No theme",
+									type: "radio",
+									checked: !config.get("options.themes"), // todo rename "themes"
+									click: () => {
+										config.set("options.themes", []);
+									},
+								},
+								{ type: "separator" },
+								{
+									label: "Import custom CSS file",
+									type: "radio",
+									checked: false,
+									click: async () => {
+										const { filePaths } = await dialog.showOpenDialog({
+											filters: [{ name: "CSS Files", extensions: ["css"] }],
+											properties: ["openFile", "multiSelections"],
+										});
+										if (filePaths) {
+											config.set("options.themes", filePaths);
+										}
+									},
+								},
+							],
+						},
+					],
+				},
+				{
+					label: "Single instance lock",
+					type: "checkbox",
+					checked: true,
+					click: (item) => {
+						if (!item.checked && app.hasSingleInstanceLock())
+							app.releaseSingleInstanceLock();
+						else if (item.checked && !app.hasSingleInstanceLock())
+							app.requestSingleInstanceLock();
+					},
+				},
+				{
+					label: "Always on top",
+					type: "checkbox",
+					checked: config.get("options.alwaysOnTop"),
+					click: (item) => {
+						config.setMenuOption("options.alwaysOnTop", item.checked);
+						win.setAlwaysOnTop(item.checked);
+					},
+				},
+				...(is.windows() || is.linux()
+					? [
 						{
 							label: "Hide menu",
 							type: "checkbox",
 							checked: config.get("options.hideMenu"),
 							click: (item) => {
-								config.set("options.hideMenu", item.checked);
+								config.setMenuOption("options.hideMenu", item.checked);
+								if (item.checked && !config.get("options.hideMenuWarned")) {
+									dialog.showMessageBox(win, {
+										type: 'info', title: 'Hide Menu Enabled',
+										message: "Menu will be hidden on next launch, use [Alt] to show it (or backtick [`] if using in-app-menu)"
+									});
+								}
 							},
 						},
-				  ]
-				: []),
-			...(is.windows() || is.macOS()
-				? // Only works on Win/Mac
-				  // https://www.electronjs.org/docs/api/app#appsetloginitemsettingssettings-macos-windows
-				  [
+					]
+					: []),
+				...(is.windows() || is.macOS()
+					? // Only works on Win/Mac
+					// https://www.electronjs.org/docs/api/app#appsetloginitemsettingssettings-macos-windows
+					[
 						{
 							label: "Start at login",
 							type: "checkbox",
 							checked: config.get("options.startAtLogin"),
 							click: (item) => {
-								config.set("options.startAtLogin", item.checked);
+								config.setMenuOption("options.startAtLogin", item.checked);
 							},
 						},
-				  ]
-				: []),
-			{
-				label: "Tray",
-				submenu: [
-					{
-						label: "Disabled",
-						type: "radio",
-						checked: !config.get("options.tray"),
-						click: () => {
-							config.set("options.tray", false);
-							config.set("options.appVisible", true);
+					]
+					: []),
+				{
+					label: "Tray",
+					submenu: [
+						{
+							label: "Disabled",
+							type: "radio",
+							checked: !config.get("options.tray"),
+							click: () => {
+								config.setMenuOption("options.tray", false);
+								config.setMenuOption("options.appVisible", true);
+							},
 						},
-					},
-					{
-						label: "Enabled + app visible",
-						type: "radio",
-						checked:
-							config.get("options.tray") && config.get("options.appVisible"),
-						click: () => {
-							config.set("options.tray", true);
-							config.set("options.appVisible", true);
+						{
+							label: "Enabled + app visible",
+							type: "radio",
+							checked:
+								config.get("options.tray") && config.get("options.appVisible"),
+							click: () => {
+								config.setMenuOption("options.tray", true);
+								config.setMenuOption("options.appVisible", true);
+							},
 						},
-					},
-					{
-						label: "Enabled + app hidden",
-						type: "radio",
-						checked:
-							config.get("options.tray") && !config.get("options.appVisible"),
-						click: () => {
-							config.set("options.tray", true);
-							config.set("options.appVisible", false);
+						{
+							label: "Enabled + app hidden",
+							type: "radio",
+							checked:
+								config.get("options.tray") && !config.get("options.appVisible"),
+							click: () => {
+								config.setMenuOption("options.tray", true);
+								config.setMenuOption("options.appVisible", false);
+							},
 						},
-					},
-				],
-			},
-			{ type: "separator" },
-			{
-				label: "Toggle DevTools",
-				// Cannot use "toggleDevTools" role in MacOS
-				click: () => {
-					const { webContents } = win;
-					if (webContents.isDevToolsOpened()) {
-						webContents.closeDevTools();
-					} else {
-						const devToolsOptions = {};
-						webContents.openDevTools(devToolsOptions);
-					}
+						{ type: "separator" },
+						{
+							label: "Play/Pause on click",
+							type: "checkbox",
+							checked: config.get("options.trayClickPlayPause"),
+							click: (item) => {
+								config.setMenuOption("options.trayClickPlayPause", item.checked);
+							},
+						},
+					],
 				},
-			},
-			{
-				label: "Advanced options",
-				click: () => {
-					config.edit();
+				{ type: "separator" },
+				{
+					label: "Advanced options",
+					submenu: [
+						{
+							label: "Proxy",
+							type: "checkbox",
+							checked: !!config.get("options.proxy"),
+							click: (item) => {
+								setProxy(item, win);
+							},
+						},
+						{
+							label: "Override useragent",
+							type: "checkbox",
+							checked: config.get("options.overrideUserAgent"),
+							click: (item) => {
+								config.setMenuOption("options.overrideUserAgent", item.checked);
+							}
+						},
+						{
+							label: "Disable hardware acceleration",
+							type: "checkbox",
+							checked: config.get("options.disableHardwareAcceleration"),
+							click: (item) => {
+								config.setMenuOption("options.disableHardwareAcceleration", item.checked);
+							},
+						},
+						{
+							label: "Restart on config changes",
+							type: "checkbox",
+							checked: config.get("options.restartOnConfigChanges"),
+							click: (item) => {
+								config.setMenuOption("options.restartOnConfigChanges", item.checked);
+							},
+						},
+						{
+							label: "Reset App cache when app starts",
+							type: "checkbox",
+							checked: config.get("options.autoResetAppCache"),
+							click: (item) => {
+								config.setMenuOption("options.autoResetAppCache", item.checked);
+							},
+						},
+						{ type: "separator" },
+						is.macOS() ?
+							{
+								label: "Toggle DevTools",
+								// Cannot use "toggleDevTools" role in MacOS
+								click: () => {
+									const { webContents } = win;
+									if (webContents.isDevToolsOpened()) {
+										webContents.closeDevTools();
+									} else {
+										const devToolsOptions = {};
+										webContents.openDevTools(devToolsOptions);
+									}
+								},
+							} :
+							{ role: "toggleDevTools" },
+						{
+							label: "Edit config.json",
+							click: () => {
+								config.edit();
+							},
+						},
+					]
 				},
-			},
-		],
-	},
-];
+			],
+		},
+		{
+			label: "View",
+			submenu: [
+				{ role: "reload" },
+				{ role: "forceReload" },
+				{ type: "separator" },
+				{ role: "zoomIn" },
+				{ role: "zoomOut" },
+				{ role: "resetZoom" },
+				{ type: "separator" },
+				{ role: "togglefullscreen" },
+			],
+		},
+		{
+			label: "Navigation",
+			submenu: [
+				{
+					label: "Go back",
+					click: () => {
+						if (win.webContents.canGoBack()) {
+							win.webContents.goBack();
+						}
+					},
+				},
+				{
+					label: "Go forward",
+					click: () => {
+						if (win.webContents.canGoForward()) {
+							win.webContents.goForward();
+						}
+					},
+				},
+				{
+					label: "Copy current URL",
+					click: () => {
+						const currentURL = win.webContents.getURL();
+						clipboard.writeText(currentURL);
+					},
+				},
+				{
+					label: "Restart App",
+					click: restart
+				},
+				{ role: "quit" },
+			],
+		},
+	];
+}
 
 module.exports.mainMenuTemplate = mainMenuTemplate;
 module.exports.setApplicationMenu = (win) => {
@@ -167,3 +413,25 @@ module.exports.setApplicationMenu = (win) => {
 	const menu = Menu.buildFromTemplate(menuTemplate);
 	Menu.setApplicationMenu(menu);
 };
+
+async function setProxy(item, win) {
+	const output = await prompt({
+		title: 'Set Proxy',
+		label: 'Enter Proxy Address: (leave empty to disable)',
+		value: config.get("options.proxy"),
+		type: 'input',
+		inputAttrs: {
+			type: 'url',
+			placeholder: "Example: 'socks5://127.0.0.1:9999"
+		},
+		width: 450,
+		...promptOptions()
+	}, win);
+
+	if (typeof output === "string") {
+		config.setMenuOption("options.proxy", output);
+		item.checked = output !== "";
+	} else { //user pressed cancel
+		item.checked = !item.checked; //reset checkbox
+	}
+}

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "youtube-music",
 	"productName": "YouTube Music",
-	"version": "1.7.0",
+	"version": "1.20.0",
 	"description": "YouTube Music Desktop App - including custom plugins",
 	"license": "MIT",
 	"repository": "th-ch/youtube-music",
@@ -15,71 +15,164 @@
 		"productName": "YouTube Music",
 		"mac": {
 			"identity": null,
+			"files": [
+				"!plugins/taskbar-mediacontrol${/*}"
+			],
+			"target": [
+				{
+					"target": "dmg",
+					"arch": [
+						"x64",
+						"arm64"
+					]
+				}
+			],
 			"icon": "assets/generated/icons/mac/icon.icns"
 		},
 		"win": {
-			"icon": "assets/generated/icons/win/icon.ico"
+			"icon": "assets/generated/icons/win/icon.ico",
+			"files": [
+				"!plugins/touchbar${/*}"
+			],
+			"target": [
+				{
+					"target": "nsis",
+					"arch": [
+						"x64",
+						"arm64"
+					]
+				},
+				{
+					"target": "portable",
+					"arch": [
+						"x64",
+						"arm64"
+					]
+				}
+			]
+		},
+		"nsis": {
+			"runAfterFinish": false
 		},
 		"linux": {
 			"icon": "assets/generated/icons/png",
-			"category": "AudioVideo"
+			"files": [
+				"!plugins/{touchbar,taskbar-mediacontrol}${/*}"
+			],
+			"category": "AudioVideo",
+			"target": [
+				"AppImage",
+				"snap",
+				"freebsd",
+				"deb",
+				"rpm"
+			]
+		},
+		"snap": {
+			"slots": [
+				{
+					"mpris": {
+						"interface": "mpris"
+					}
+				}
+			]
 		}
 	},
 	"scripts": {
-		"test": "jest",
+		"test": "playwright test",
+		"test:debug": "DEBUG=pw:browser* playwright test",
 		"start": "electron .",
-		"icon": "rimraf assets/generated && electron-icon-maker --input=assets/youtube-music.png --output=assets/generated",
+		"start:debug": "ELECTRON_ENABLE_LOGGING=1 electron .",
 		"generate:package": "node utils/generate-package-json.js",
-		"postinstall": "yarn run icon && yarn run plugins",
-		"clean": "rimraf dist",
-		"build": "yarn run clean && electron-builder --win --mac --linux",
-		"build:linux": "yarn run clean && electron-builder --linux",
-		"build:mac": "yarn run clean && electron-builder --mac",
-		"build:win": "yarn run clean && electron-builder --win",
-		"plugins": "yarn run plugin:adblocker && yarn run plugin:autoconfirm",
-		"plugin:adblocker": "rimraf plugins/adblocker/ad-blocker-engine.bin && node plugins/adblocker/blocker.js",
-		"plugin:autoconfirm": "yarn run generate:package YoutubeNonStop",
+		"postinstall": "yarn run plugins",
+		"clean": "del-cli dist",
+		"build": "yarn run clean && electron-builder --win --mac --linux -p never",
+		"build:linux": "yarn run clean && electron-builder --linux -p never",
+		"build:mac": "yarn run clean && electron-builder --mac dmg:x64 -p never",
+		"build:mac:arm64": "yarn run clean && electron-builder --mac dmg:arm64 -p never",
+		"build:win": "yarn run clean && electron-builder --win -p never",
+		"lint": "xo",
+		"changelog": "auto-changelog",
+		"plugins": "yarn run plugin:adblocker && yarn run plugin:bypass-age-restrictions",
+		"plugin:adblocker": "del-cli plugins/adblocker/ad-blocker-engine.bin && node plugins/adblocker/blocker.js",
+		"plugin:bypass-age-restrictions": "del-cli node_modules/simple-youtube-age-restriction-bypass/package.json && yarn run generate:package simple-youtube-age-restriction-bypass",
 		"release:linux": "yarn run clean && electron-builder --linux -p always -c.snap.publish=github",
 		"release:mac": "yarn run clean && electron-builder --mac -p always",
 		"release:win": "yarn run clean && electron-builder --win -p always"
 	},
 	"engines": {
-		"node": ">=12.16.1",
-		"npm": "Please use yarn and not npm"
+		"node": ">=16.0.0",
+		"npm": "Please use yarn instead"
 	},
 	"dependencies": {
-		"@cliqz/adblocker-electron": "^1.18.6",
-		"@ffmpeg/core": "^0.8.4",
-		"@ffmpeg/ffmpeg": "^0.9.5",
-		"YoutubeNonStop": "git://github.com/lawfx/YoutubeNonStop.git#v0.8.0",
-		"downloads-folder": "^3.0.1",
-		"electron-debug": "^3.1.0",
+		"@cliqz/adblocker-electron": "^1.26.5",
+		"@ffmpeg/core": "^0.11.0",
+		"@ffmpeg/ffmpeg": "^0.11.6",
+		"@foobar404/wave": "^2.0.4",
+		"@xhayper/discord-rpc": "^1.0.16",
+		"async-mutex": "^0.4.0",
+		"browser-id3-writer": "^5.0.0",
+		"butterchurn": "^2.6.7",
+		"butterchurn-presets": "^2.4.7",
+		"custom-electron-prompt": "^1.5.7",
+		"custom-electron-titlebar": "^4.1.6",
+		"electron-better-web-request": "^1.0.1",
+		"electron-debug": "^3.2.0",
 		"electron-is": "^3.0.0",
 		"electron-localshortcut": "^3.2.1",
-		"electron-store": "^6.0.1",
-		"electron-updater": "^4.3.5",
-		"filenamify": "^4.2.0",
-		"node-fetch": "^2.6.1",
-		"ytdl-core": "^4.1.1"
-	},
-	"devDependencies": {
-		"electron": "^10.1.3",
-		"electron-builder": "^22.8.1",
-		"electron-devtools-installer": "^3.1.1",
-		"electron-icon-maker": "0.0.5",
-		"get-port": "^5.1.1",
-		"jest": "^26.4.2",
-		"rimraf": "^3.0.2",
-		"spectron": "^12.0.0",
-		"xo": "^0.33.1"
+		"electron-store": "^8.1.0",
+		"electron-unhandled": "^4.0.1",
+		"electron-updater": "^5.3.0",
+		"filenamify": "^4.3.0",
+		"howler": "^2.2.3",
+		"html-to-text": "^9.0.5",
+		"keyboardevent-from-electron-accelerator": "^2.0.0",
+		"keyboardevents-areequal": "^0.2.2",
+		"md5": "^2.3.0",
+		"mpris-service": "^2.1.2",
+		"node-fetch": "^2.6.9",
+		"simple-youtube-age-restriction-bypass": "https://gitpkg.now.sh/api/pkg.tgz?url=zerodytrash/Simple-YouTube-Age-Restriction-Bypass&commit=v2.5.4",
+		"vudio": "^2.1.1",
+		"youtubei.js": "^4.3.0",
+		"ytpl": "^2.3.0"
 	},
 	"resolutions": {
-		"yargs-parser": "18.1.3"
+		"xml2js": "^0.5.0",
+		"@electron/universal": "^1.3.4",
+		"electron-is-dev": "patch:electron-is-dev@npm%3A2.0.0#./.yarn/patches/electron-is-dev-npm-2.0.0-9d41637d91.patch"
+	},
+	"devDependencies": {
+		"@playwright/test": "^1.29.2",
+		"auto-changelog": "^2.4.0",
+		"del-cli": "^5.0.0",
+		"electron": "^22.3.6",
+		"electron-builder": "^23.6.0",
+		"electron-devtools-installer": "^3.2.0",
+		"node-gyp": "^9.3.1",
+		"playwright": "^1.29.2",
+		"xo": "^0.53.1"
+	},
+	"auto-changelog": {
+		"hideCredit": true,
+		"package": true,
+		"unreleased": true,
+		"output": "changelog.md"
 	},
 	"xo": {
 		"envs": [
 			"node",
 			"browser"
-		]
-	}
+		],
+		"rules": {
+			"quotes": [
+				"error",
+				"double",
+				{
+					"avoidEscape": true,
+					"allowTemplateLiterals": true
+				}
+			]
+		}
+	},
+	"packageManager": "yarn@3.4.1"
 }

plugins/adblocker/back.js

@@ -1,7 +1,13 @@
 const { loadAdBlockerEngine } = require("./blocker");
-module.exports = (win, options) =>
-	loadAdBlockerEngine(
-		win.webContents.session,
-		options.cache,
-		options.additionalBlockLists
-	);
+const config = require("./config");
+
+module.exports = async (win, options) => {
+	if (await config.shouldUseBlocklists()) {
+		loadAdBlockerEngine(
+			win.webContents.session,
+			options.cache,
+			options.additionalBlockLists,
+			options.disableDefaultLists,
+		);
+	}
+};

plugins/adblocker/blocker.js

@@ -1,4 +1,4 @@
-const { existsSync, promises, unlinkSync } = require("fs"); // used for caching
+const { promises } = require("fs"); // used for caching
 const path = require("path");
 
 const { ElectronBlocker } = require("@cliqz/adblocker-electron");
@@ -6,29 +6,42 @@ const fetch = require("node-fetch");
 
 const SOURCES = [
 	"https://raw.githubusercontent.com/kbinani/adblock-youtube-ads/master/signed.txt",
+	// uBlock Origin
+	"https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters.txt",
+	"https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters-2021.txt",
+	// Fanboy Annoyances
+	"https://secure.fanboy.co.nz/fanboy-annoyance_ubo.txt",
 ];
 
 const loadAdBlockerEngine = (
 	session = undefined,
 	cache = true,
-	additionalBlockLists = []
+	additionalBlockLists = [],
+	disableDefaultLists = false
 ) => {
-	const adBlockerCache = path.resolve(__dirname, "ad-blocker-engine.bin");
-	if (!cache && existsSync(adBlockerCache)) {
-		unlinkSync(adBlockerCache);
-	}
-	const cachingOptions = cache
-		? {
-				path: adBlockerCache,
-				read: promises.readFile,
-				write: promises.writeFile,
-		  }
-		: undefined;
+	// Only use cache if no additional blocklists are passed
+	const cachingOptions =
+		cache && additionalBlockLists.length === 0
+			? {
+					path: path.resolve(__dirname, "ad-blocker-engine.bin"),
+					read: promises.readFile,
+					write: promises.writeFile,
+			  }
+			: undefined;
+	const lists = [
+		...(disableDefaultLists ? [] : SOURCES),
+		...additionalBlockLists,
+	];
 
 	ElectronBlocker.fromLists(
 		fetch,
-		[...SOURCES, ...additionalBlockLists],
-		{},
+		lists,
+		{
+			// when generating the engine for caching, do not load network filters
+			// So that enhancing the session works as expected
+			// Allowing to define multiple webRequest listeners
+			loadNetworkFilters: session !== undefined,
+		},
 		cachingOptions
 	)
 		.then((blocker) => {

plugins/adblocker/config.js

@@ -0,0 +1,13 @@
+const { PluginConfig } = require("../../config/dynamic");
+
+const config = new PluginConfig("adblocker", { enableFront: true });
+
+const blockers = {
+	WithBlocklists: "With blocklists",
+	InPlayer: "In player",
+};
+
+const shouldUseBlocklists = async () =>
+	(await config.get("blocker")) !== blockers.InPlayer;
+
+module.exports = { shouldUseBlocklists, blockers, ...config };

plugins/adblocker/inject.js

@@ -0,0 +1,289 @@
+// Source: https://addons.mozilla.org/en-US/firefox/addon/adblock-for-youtube/
+// https://robwu.nl/crxviewer/?crx=https%3A%2F%2Faddons.mozilla.org%2Fen-US%2Ffirefox%2Faddon%2Fadblock-for-youtube%2F
+
+/*
+	Parts of this code is derived from set-constant.js:
+	https://github.com/gorhill/uBlock/blob/5de0ce975753b7565759ac40983d31978d1f84ca/assets/resources/scriptlets.js#L704
+	*/
+
+{
+	let pruner = function (o) {
+		delete o.playerAds;
+		delete o.adPlacements;
+		//
+		if (o.playerResponse) {
+			delete o.playerResponse.playerAds;
+			delete o.playerResponse.adPlacements;
+		}
+		//
+		return o;
+	};
+
+	JSON.parse = new Proxy(JSON.parse, {
+		apply: function () {
+			return pruner(Reflect.apply(...arguments));
+		},
+	});
+
+	Response.prototype.json = new Proxy(Response.prototype.json, {
+		apply: function () {
+			return Reflect.apply(...arguments).then((o) => pruner(o));
+		},
+	});
+}
+
+(function () {
+	let cValue = "undefined";
+	const chain = "playerResponse.adPlacements";
+	const thisScript = document.currentScript;
+	//
+	if (cValue === "null") cValue = null;
+	else if (cValue === "''") cValue = "";
+	else if (cValue === "true") cValue = true;
+	else if (cValue === "false") cValue = false;
+	else if (cValue === "undefined") cValue = undefined;
+	else if (cValue === "noopFunc") cValue = function () {};
+	else if (cValue === "trueFunc")
+		cValue = function () {
+			return true;
+		};
+	else if (cValue === "falseFunc")
+		cValue = function () {
+			return false;
+		};
+	else if (/^\d+$/.test(cValue)) {
+		cValue = parseFloat(cValue);
+		//
+		if (isNaN(cValue)) return;
+		if (Math.abs(cValue) > 0x7fff) return;
+	} else {
+		return;
+	}
+	//
+	let aborted = false;
+	const mustAbort = function (v) {
+		if (aborted) return true;
+		aborted =
+			v !== undefined &&
+			v !== null &&
+			cValue !== undefined &&
+			cValue !== null &&
+			typeof v !== typeof cValue;
+		return aborted;
+	};
+
+	/*
+	Support multiple trappers for the same property:
+	https://github.com/uBlockOrigin/uBlock-issues/issues/156
+  */
+
+	const trapProp = function (owner, prop, configurable, handler) {
+		if (handler.init(owner[prop]) === false) {
+			return;
+		}
+		//
+		const odesc = Object.getOwnPropertyDescriptor(owner, prop);
+		let prevGetter, prevSetter;
+		if (odesc instanceof Object) {
+			if (odesc.configurable === false) return;
+			if (odesc.get instanceof Function) prevGetter = odesc.get;
+			if (odesc.set instanceof Function) prevSetter = odesc.set;
+		}
+		//
+		Object.defineProperty(owner, prop, {
+			configurable,
+			get() {
+				if (prevGetter !== undefined) {
+					prevGetter();
+				}
+				//
+				return handler.getter();
+			},
+			set(a) {
+				if (prevSetter !== undefined) {
+					prevSetter(a);
+				}
+				//
+				handler.setter(a);
+			},
+		});
+	};
+
+	const trapChain = function (owner, chain) {
+		const pos = chain.indexOf(".");
+		if (pos === -1) {
+			trapProp(owner, chain, false, {
+				v: undefined,
+				getter: function () {
+					return document.currentScript === thisScript ? this.v : cValue;
+				},
+				setter: function (a) {
+					if (mustAbort(a) === false) return;
+					cValue = a;
+				},
+				init: function (v) {
+					if (mustAbort(v)) return false;
+					//
+					this.v = v;
+					return true;
+				},
+			});
+			//
+			return;
+		}
+		//
+		const prop = chain.slice(0, pos);
+		const v = owner[prop];
+		//
+		chain = chain.slice(pos + 1);
+		if (v instanceof Object || (typeof v === "object" && v !== null)) {
+			trapChain(v, chain);
+			return;
+		}
+		//
+		trapProp(owner, prop, true, {
+			v: undefined,
+			getter: function () {
+				return this.v;
+			},
+			setter: function (a) {
+				this.v = a;
+				if (a instanceof Object) trapChain(a, chain);
+			},
+			init: function (v) {
+				this.v = v;
+				return true;
+			},
+		});
+	};
+	//
+	trapChain(window, chain);
+})();
+
+(function () {
+	let cValue = "undefined";
+	const thisScript = document.currentScript;
+	const chain = "ytInitialPlayerResponse.adPlacements";
+	//
+	if (cValue === "null") cValue = null;
+	else if (cValue === "''") cValue = "";
+	else if (cValue === "true") cValue = true;
+	else if (cValue === "false") cValue = false;
+	else if (cValue === "undefined") cValue = undefined;
+	else if (cValue === "noopFunc") cValue = function () {};
+	else if (cValue === "trueFunc")
+		cValue = function () {
+			return true;
+		};
+	else if (cValue === "falseFunc")
+		cValue = function () {
+			return false;
+		};
+	else if (/^\d+$/.test(cValue)) {
+		cValue = parseFloat(cValue);
+		//
+		if (isNaN(cValue)) return;
+		if (Math.abs(cValue) > 0x7fff) return;
+	} else {
+		return;
+	}
+	//
+	let aborted = false;
+	const mustAbort = function (v) {
+		if (aborted) return true;
+		aborted =
+			v !== undefined &&
+			v !== null &&
+			cValue !== undefined &&
+			cValue !== null &&
+			typeof v !== typeof cValue;
+		return aborted;
+	};
+
+	/*
+	Support multiple trappers for the same property:
+	https://github.com/uBlockOrigin/uBlock-issues/issues/156
+  */
+
+	const trapProp = function (owner, prop, configurable, handler) {
+		if (handler.init(owner[prop]) === false) {
+			return;
+		}
+		//
+		const odesc = Object.getOwnPropertyDescriptor(owner, prop);
+		let prevGetter, prevSetter;
+		if (odesc instanceof Object) {
+			if (odesc.configurable === false) return;
+			if (odesc.get instanceof Function) prevGetter = odesc.get;
+			if (odesc.set instanceof Function) prevSetter = odesc.set;
+		}
+		//
+		Object.defineProperty(owner, prop, {
+			configurable,
+			get() {
+				if (prevGetter !== undefined) {
+					prevGetter();
+				}
+				//
+				return handler.getter();
+			},
+			set(a) {
+				if (prevSetter !== undefined) {
+					prevSetter(a);
+				}
+				//
+				handler.setter(a);
+			},
+		});
+	};
+
+	const trapChain = function (owner, chain) {
+		const pos = chain.indexOf(".");
+		if (pos === -1) {
+			trapProp(owner, chain, false, {
+				v: undefined,
+				getter: function () {
+					return document.currentScript === thisScript ? this.v : cValue;
+				},
+				setter: function (a) {
+					if (mustAbort(a) === false) return;
+					cValue = a;
+				},
+				init: function (v) {
+					if (mustAbort(v)) return false;
+					//
+					this.v = v;
+					return true;
+				},
+			});
+			//
+			return;
+		}
+		//
+		const prop = chain.slice(0, pos);
+		const v = owner[prop];
+		//
+		chain = chain.slice(pos + 1);
+		if (v instanceof Object || (typeof v === "object" && v !== null)) {
+			trapChain(v, chain);
+			return;
+		}
+		//
+		trapProp(owner, prop, true, {
+			v: undefined,
+			getter: function () {
+				return this.v;
+			},
+			setter: function (a) {
+				this.v = a;
+				if (a instanceof Object) trapChain(a, chain);
+			},
+			init: function (v) {
+				this.v = v;
+				return true;
+			},
+		});
+	};
+	//
+	trapChain(window, chain);
+})();

plugins/adblocker/menu.js

@@ -0,0 +1,15 @@
+const config = require("./config");
+
+module.exports = () => [
+	{
+		label: "Blocker",
+		submenu: Object.values(config.blockers).map((blocker) => ({
+			label: blocker,
+			type: "radio",
+			checked: (config.get("blocker") || config.blockers.WithBlocklists) === blocker,
+			click: () => {
+				config.set("blocker", blocker);
+			},
+		})),
+	},
+];

plugins/adblocker/preload.js

@@ -0,0 +1,10 @@
+const config = require("./config");
+
+module.exports = async () => {
+	if (await config.shouldUseBlocklists()) {
+		// Preload adblocker to inject scripts/styles
+		require("@cliqz/adblocker-electron-preload");
+	} else if ((await config.get("blocker")) === config.blockers.InPlayer) {
+		require("./inject");
+	}
+};

plugins/audio-compressor/front.js

@@ -0,0 +1,19 @@
+const applyCompressor = (e) => {
+	const audioContext = e.detail.audioContext;
+
+	const compressor = audioContext.createDynamicsCompressor();
+	compressor.threshold.value = -50;
+	compressor.ratio.value = 12;
+	compressor.knee.value = 40;
+	compressor.attack.value = 0;
+	compressor.release.value = 0.25;
+
+	e.detail.audioSource.connect(compressor);
+	compressor.connect(audioContext.destination);
+};
+
+module.exports = () =>
+	document.addEventListener("audioCanPlay", applyCompressor, {
+		once: true, // Only create the audio compressor once, not on each video
+		passive: true,
+	});

plugins/auto-confirm-when-paused/front.js

@@ -1,12 +0,0 @@
-// Define global chrome object to be compliant with the extension code
-global.chrome = {
-	runtime: {
-		getManifest: () => ({
-			version: 1
-		})
-	}
-};
-
-module.exports = () => {
-	require("YoutubeNonStop/autoconfirm.js");
-};

plugins/blur-nav-bar/back.js

@@ -1,5 +1,5 @@
-const { injectCSS } = require("../utils");
 const path = require("path");
+const { injectCSS } = require("../utils");
 
 module.exports = win => {
 	injectCSS(win.webContents, path.join(__dirname, "style.css"));

plugins/blur-nav-bar/style.css

@@ -0,0 +1,10 @@
+#nav-bar-background,
+#header.ytmusic-item-section-renderer,
+ytmusic-tabs {
+	background: rgba(0, 0, 0, 0.3) !important;
+	backdrop-filter: blur(8px) !important;
+}
+
+#nav-bar-divider {
+	display: none !important;
+}

plugins/bypass-age-restrictions/front.js

@@ -0,0 +1,4 @@
+module.exports = () => {
+	// See https://github.com/zerodytrash/Simple-YouTube-Age-Restriction-Bypass#userscript
+	require("simple-youtube-age-restriction-bypass/dist/Simple-YouTube-Age-Restriction-Bypass.user.js");
+};

plugins/captions-selector/back.js

@@ -0,0 +1,21 @@
+const { ipcMain } = require("electron");
+
+const prompt = require("custom-electron-prompt");
+const promptOptions = require("../../providers/prompt-options");
+
+module.exports = (win) => {
+	ipcMain.handle("captionsSelector", async (_, captionLabels, currentIndex) => {
+		return await prompt(
+			{
+				title: "Choose Caption",
+				label: `Current Caption: ${captionLabels[currentIndex] || "None"}`,
+				type: "select",
+				value: currentIndex,
+				selectOptions: captionLabels,
+				resizable: true,
+				...promptOptions(),
+			},
+			win
+		);
+	});
+};

plugins/captions-selector/config.js

@@ -0,0 +1,3 @@
+const { PluginConfig } = require("../../config/dynamic");
+const config = new PluginConfig("captions-selector", { enableFront: true });
+module.exports = { ...config };

plugins/captions-selector/front.js

@@ -0,0 +1,77 @@
+const { ElementFromFile, templatePath } = require("../utils");
+const { ipcRenderer } = require("electron");
+
+const configProvider = require("./config");
+let config;
+
+function $(selector) { return document.querySelector(selector); }
+
+const captionsSettingsButton = ElementFromFile(
+    templatePath(__dirname, "captions-settings-template.html")
+);
+
+module.exports = async () => {
+	config = await configProvider.getAll();
+
+	configProvider.subscribeAll((newConfig) => {
+		config = newConfig;
+	});
+    document.addEventListener('apiLoaded', (event) => setup(event.detail), { once: true, passive: true });
+}
+
+function setup(api) {
+    $(".right-controls-buttons").append(captionsSettingsButton);
+
+    let captionTrackList = api.getOption("captions", "tracklist");
+
+	$("video").addEventListener("srcChanged", async () => {
+		if (config.disableCaptions) {
+			setTimeout(() => api.unloadModule("captions"), 100);
+			captionsSettingsButton.style.display = "none";
+			return;
+		}
+
+		api.loadModule("captions");
+
+		setTimeout(async () => {
+			captionTrackList = api.getOption("captions", "tracklist");
+
+			if (config.autoload && config.lastCaptionsCode) {
+				api.setOption("captions", "track", {
+					languageCode: config.lastCaptionsCode,
+				});
+			}
+
+			captionsSettingsButton.style.display = captionTrackList?.length
+				? "inline-block"
+				: "none";
+		}, 250);
+	});
+
+    captionsSettingsButton.onclick = async () => {
+        if (captionTrackList?.length) {
+            const currentCaptionTrack = api.getOption("captions", "track");
+            let currentIndex = !currentCaptionTrack ?
+				null :
+				captionTrackList.indexOf(captionTrackList.find(track => track.languageCode === currentCaptionTrack.languageCode));
+
+            const captionLabels = [
+                ...captionTrackList.map(track => track.displayName),
+                'None'
+            ];
+
+            currentIndex = await ipcRenderer.invoke('captionsSelector', captionLabels, currentIndex)
+			if (currentIndex === null) return;
+
+			const newCaptions = captionTrackList[currentIndex];
+            configProvider.set('lastCaptionsCode', newCaptions?.languageCode);
+			if (newCaptions) {
+				api.setOption("captions", "track", { languageCode: newCaptions.languageCode });
+			} else {
+				api.setOption("captions", "track", {});
+			}
+
+			setTimeout(() => api.playVideo());
+        }
+    }
+}

plugins/captions-selector/menu.js

@@ -0,0 +1,20 @@
+const config = require("./config");
+
+module.exports = () => [
+    {
+        label: "Automatically select last used caption",
+        type: "checkbox",
+        checked: config.get("autoload"),
+        click: (item) => {
+            config.set('autoload', item.checked);
+        }
+    },
+    {
+        label: "No captions by default",
+        type: "checkbox",
+        checked: config.get("disabledCaptions"),
+        click: (item) => {
+            config.set('disableCaptions', item.checked);
+        },
+    }
+];

plugins/captions-selector/templates/captions-settings-template.html

@@ -0,0 +1,13 @@
+<tp-yt-paper-icon-button class="player-captions-button style-scope ytmusic-player" icon="yt-icons:subtitles"
+    title="Open captions selector" aria-label="Open captions selector" role="button" tabindex="0" aria-disabled="false">
+    <tp-yt-iron-icon id="icon" class="style-scope tp-yt-paper-icon-button"><svg viewBox="0 0 24 24"
+            preserveAspectRatio="xMidYMid meet" focusable="false" class="style-scope yt-icon"
+            style="pointer-events: none; display: block; width: 100%; height: 100%;">
+            <g class="style-scope yt-icon">
+                <path
+					d="M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zm-9 6H8v4h3v2H8c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3v2zm7 0h-3v4h3v2h-3c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3v2z"
+					class="style-scope tp-yt-iron-icon"></path>
+            </g>
+        </svg>
+    </tp-yt-iron-icon>
+</tp-yt-paper-icon-button>

plugins/crossfade/back.js

@@ -0,0 +1,15 @@
+const { ipcMain } = require("electron");
+const { Innertube } = require("youtubei.js");
+
+require("./config");
+
+module.exports = async () => {
+	const yt = await Innertube.create();
+
+	ipcMain.handle("audio-url", async (_, videoID) => {
+		const info = await yt.getBasicInfo(videoID);
+		const url = info.streaming_data?.formats[0].decipher(yt.session.player);
+
+		return url;
+	});
+};

plugins/crossfade/config.js

@@ -0,0 +1,3 @@
+const { PluginConfig } = require("../../config/dynamic");
+const config = new PluginConfig("crossfade", { enableFront: true });
+module.exports = { ...config };

plugins/crossfade/fader.js

@@ -0,0 +1,360 @@
+/**
+ * VolumeFader
+ * Sophisticated Media Volume Fading
+ *
+ * Requires browser support for:
+ * - HTMLMediaElement
+ * - requestAnimationFrame()
+ * - ES6
+ *
+ * Does not depend on any third-party library.
+ *
+ * License: MIT
+ *
+ * Nick Schwarzenberg
+ * v0.2.0, 07/2016
+ */
+
+(function (root) {
+	"use strict";
+
+	// internal utility: check if value is a valid volume level and throw if not
+	let validateVolumeLevel = (value) => {
+		// number between 0 and 1?
+		if (!Number.isNaN(value) && value >= 0 && value <= 1) {
+			// yup, that's fine
+			return;
+		} else {
+			// abort and throw an exception
+			throw new TypeError("Number between 0 and 1 expected as volume!");
+		}
+	};
+
+	// main class
+	class VolumeFader {
+		/**
+		 * VolumeFader Constructor
+		 *
+		 * @param media {HTMLMediaElement} - audio or video element to be controlled
+		 * @param options {Object} - an object with optional settings
+		 * @throws {TypeError} if options.initialVolume or options.fadeDuration are invalid
+		 *
+		 * options:
+		 * .logger: {Function} logging `function(stuff, …)` for execution information (default: no logging)
+		 * .fadeScaling: {Mixed} either 'linear', 'logarithmic' or a positive number in dB (default: logarithmic)
+		 * .initialVolume: {Number} media volume 0…1 to apply during setup (volume not touched by default)
+		 * .fadeDuration: {Number} time in milliseconds to complete a fade (default: 1000 ms)
+		 */
+		constructor(media, options) {
+			// passed media element of correct type?
+			if (media instanceof HTMLMediaElement) {
+				// save reference to media element
+				this.media = media;
+			} else {
+				// abort and throw an exception
+				throw new TypeError("Media element expected!");
+			}
+
+			// make sure options is an object
+			options = options || {};
+
+			// log function passed?
+			if (typeof options.logger == "function") {
+				// set log function to the one specified
+				this.logger = options.logger;
+			} else {
+				// set log function explicitly to false
+				this.logger = false;
+			}
+
+			// linear volume fading?
+			if (options.fadeScaling == "linear") {
+				// pass levels unchanged
+				this.scale = {
+					internalToVolume: (level) => level,
+					volumeToInternal: (level) => level,
+				};
+
+				// log setting
+				this.logger && this.logger("Using linear fading.");
+			}
+			// no linear, but logarithmic fading…
+			else {
+				let dynamicRange;
+
+				// default dynamic range?
+				if (
+					options.fadeScaling === undefined ||
+					options.fadeScaling == "logarithmic"
+				) {
+					// set default of 60 dB
+					dynamicRange = 3;
+				}
+				// custom dynamic range?
+				else if (
+					!Number.isNaN(options.fadeScaling) &&
+					options.fadeScaling > 0
+				) {
+					// turn amplitude dB into a multiple of 10 power dB
+					dynamicRange = options.fadeScaling / 2 / 10;
+				}
+				// unsupported value
+				else {
+					// abort and throw exception
+					throw new TypeError(
+						"Expected 'linear', 'logarithmic' or a positive number as fade scaling preference!"
+					);
+				}
+
+				// use exponential/logarithmic scaler for expansion/compression
+				this.scale = {
+					internalToVolume: (level) =>
+						this.exponentialScaler(level, dynamicRange),
+					volumeToInternal: (level) =>
+						this.logarithmicScaler(level, dynamicRange),
+				};
+
+				// log setting if not default
+				options.fadeScaling &&
+					this.logger &&
+					this.logger(
+						"Using logarithmic fading with " +
+							String(10 * dynamicRange) +
+							" dB dynamic range."
+					);
+			}
+
+			// set initial volume?
+			if (options.initialVolume !== undefined) {
+				// validate volume level and throw if invalid
+				validateVolumeLevel(options.initialVolume);
+
+				// set initial volume
+				this.media.volume = options.initialVolume;
+
+				// log setting
+				this.logger &&
+					this.logger(
+						"Set initial volume to " + String(this.media.volume) + "."
+					);
+			}
+
+			// fade duration given?
+			if (options.fadeDuration !== undefined) {
+				// try to set given fade duration (will log if successful and throw if not)
+				this.setFadeDuration(options.fadeDuration);
+			} else {
+				// set default fade duration (1000 ms)
+				this.fadeDuration = 1000;
+			}
+
+			// indicate that fader is not active yet
+			this.active = false;
+
+			// initialization done
+			this.logger && this.logger("Initialized for", this.media);
+		}
+
+		/**
+		 * Re(start) the update cycle.
+		 * (this.active must be truthy for volume updates to take effect)
+		 *
+		 * @return {Object} VolumeFader instance for chaining
+		 */
+		start() {
+			// set fader to be active
+			this.active = true;
+
+			// start by running the update method
+			this.updateVolume();
+
+			// return instance for chaining
+			return this;
+		}
+
+		/**
+		 * Stop the update cycle.
+		 * (interrupting any fade)
+		 *
+		 * @return {Object} VolumeFader instance for chaining
+		 */
+		stop() {
+			// set fader to be inactive
+			this.active = false;
+
+			// return instance for chaining
+			return this;
+		}
+
+		/**
+		 * Set fade duration.
+		 * (used for future calls to fadeTo)
+		 *
+		 * @param {Number} fadeDuration - fading length in milliseconds
+		 * @throws {TypeError} if fadeDuration is not a number greater than zero
+		 * @return {Object} VolumeFader instance for chaining
+		 */
+		setFadeDuration(fadeDuration) {
+			// if duration is a valid number > 0…
+			if (!Number.isNaN(fadeDuration) && fadeDuration > 0) {
+				// set fade duration
+				this.fadeDuration = fadeDuration;
+
+				// log setting
+				this.logger &&
+					this.logger("Set fade duration to " + String(fadeDuration) + " ms.");
+			} else {
+				// abort and throw an exception
+				throw new TypeError("Positive number expected as fade duration!");
+			}
+
+			// return instance for chaining
+			return this;
+		}
+
+		/**
+		 * Define a new fade and start fading.
+		 *
+		 * @param {Number} targetVolume - level to fade to in the range 0…1
+		 * @param {Function} callback - (optional) function to be called when fade is complete
+		 * @throws {TypeError} if targetVolume is not in the range 0…1
+		 * @return {Object} VolumeFader instance for chaining
+		 */
+		fadeTo(targetVolume, callback) {
+			// validate volume and throw if invalid
+			validateVolumeLevel(targetVolume);
+
+			// define new fade
+			this.fade = {
+				// volume start and end point on internal fading scale
+				volume: {
+					start: this.scale.volumeToInternal(this.media.volume),
+					end: this.scale.volumeToInternal(targetVolume),
+				},
+				// time start and end point
+				time: {
+					start: Date.now(),
+					end: Date.now() + this.fadeDuration,
+				},
+				// optional callback function
+				callback: callback,
+			};
+
+			// start fading
+			this.start();
+
+			// log new fade
+			this.logger && this.logger("New fade started:", this.fade);
+
+			// return instance for chaining
+			return this;
+		}
+
+		// convenience shorthand methods for common fades
+		fadeIn(callback) {
+			this.fadeTo(1, callback);
+		}
+		fadeOut(callback) {
+			this.fadeTo(0, callback);
+		}
+
+		/**
+		 * Internal: Update media volume.
+		 * (calls itself through requestAnimationFrame)
+		 *
+		 * @param {Number} targetVolume - linear level to fade to (0…1)
+		 * @param {Function} callback - (optional) function to be called when fade is complete
+		 */
+		updateVolume() {
+			// fader active and fade available to process?
+			if (this.active && this.fade) {
+				// get current time
+				let now = Date.now();
+
+				// time left for fading?
+				if (now < this.fade.time.end) {
+					// compute current fade progress
+					let progress =
+						(now - this.fade.time.start) /
+						(this.fade.time.end - this.fade.time.start);
+
+					// compute current level on internal scale
+					let level =
+						progress * (this.fade.volume.end - this.fade.volume.start) +
+						this.fade.volume.start;
+
+					// map fade level to volume level and apply it to media element
+					this.media.volume = this.scale.internalToVolume(level);
+
+					// schedule next update
+					root.requestAnimationFrame(this.updateVolume.bind(this));
+				} else {
+					// log end of fade
+					this.logger &&
+						this.logger(
+							"Fade to " + String(this.fade.volume.end) + " complete."
+						);
+
+					// time is up, jump to target volume
+					this.media.volume = this.scale.internalToVolume(this.fade.volume.end);
+
+					// set fader to be inactive
+					this.active = false;
+
+					// done, call back (if callable)
+					typeof this.fade.callback == "function" && this.fade.callback();
+
+					// clear fade
+					this.fade = undefined;
+				}
+			}
+		}
+
+		/**
+		 * Internal: Exponential scaler with dynamic range limit.
+		 *
+		 * @param {Number} input - logarithmic input level to be expanded (float, 0…1)
+		 * @param {Number} dynamicRange - expanded output range, in multiples of 10 dB (float, 0…∞)
+		 * @return {Number} - expanded level (float, 0…1)
+		 */
+		exponentialScaler(input, dynamicRange) {
+			// special case: make zero (or any falsy input) return zero
+			if (input == 0) {
+				// since the dynamic range is limited,
+				// allow a zero to produce a plain zero instead of a small faction
+				// (audio would not be recognized as silent otherwise)
+				return 0;
+			} else {
+				// scale 0…1 to minus something × 10 dB
+				input = (input - 1) * dynamicRange;
+
+				// compute power of 10
+				return Math.pow(10, input);
+			}
+		}
+
+		/**
+		 * Internal: Logarithmic scaler with dynamic range limit.
+		 *
+		 * @param {Number} input - exponential input level to be compressed (float, 0…1)
+		 * @param {Number} dynamicRange - coerced input range, in multiples of 10 dB (float, 0…∞)
+		 * @return {Number} - compressed level (float, 0…1)
+		 */
+		logarithmicScaler(input, dynamicRange) {
+			// special case: make zero (or any falsy input) return zero
+			if (input == 0) {
+				// logarithm of zero would be -∞, which would map to zero anyway
+				return 0;
+			} else {
+				// compute base-10 logarithm
+				input = Math.log10(input);
+
+				// scale minus something × 10 dB to 0…1 (clipping at 0)
+				return Math.max(1 + input / dynamicRange, 0);
+			}
+		}
+	}
+
+	// export class to root scope
+	root.VolumeFader = VolumeFader;
+})(window);

plugins/crossfade/front.js

@@ -0,0 +1,158 @@
+const { ipcRenderer } = require("electron");
+const { Howl } = require("howler");
+
+// Extracted from https://github.com/bitfasching/VolumeFader
+require("./fader");
+
+let transitionAudio; // Howler audio used to fade out the current music
+let firstVideo = true;
+let waitForTransition;
+
+const defaultConfig = require("../../config/defaults").plugins.crossfade;
+
+const configProvider = require("./config");
+let config;
+
+const configGetNum = (key) => Number(config[key]) || defaultConfig[key];
+
+const getStreamURL = async (videoID) => {
+	const url = await ipcRenderer.invoke("audio-url", videoID);
+	return url;
+};
+
+const getVideoIDFromURL = (url) => {
+	return new URLSearchParams(url.split("?")?.at(-1)).get("v");
+};
+
+const isReadyToCrossfade = () => {
+	return transitionAudio && transitionAudio.state() === "loaded";
+};
+
+const watchVideoIDChanges = (cb) => {
+	navigation.addEventListener("navigate", (event) => {
+		const currentVideoID = getVideoIDFromURL(
+			event.currentTarget.currentEntry.url,
+		);
+		const nextVideoID = getVideoIDFromURL(event.destination.url);
+
+		if (
+			nextVideoID &&
+			currentVideoID &&
+			(firstVideo || nextVideoID !== currentVideoID)
+		) {
+			if (isReadyToCrossfade()) {
+				crossfade(() => {
+					cb(nextVideoID);
+				});
+			} else {
+				cb(nextVideoID);
+				firstVideo = false;
+			}
+		}
+	});
+};
+
+const createAudioForCrossfade = async (url) => {
+	if (transitionAudio) {
+		transitionAudio.unload();
+	}
+	transitionAudio = new Howl({
+		src: url,
+		html5: true,
+		volume: 0,
+	});
+	await syncVideoWithTransitionAudio();
+};
+
+const syncVideoWithTransitionAudio = async () => {
+	const video = document.querySelector("video");
+
+	const videoFader = new VolumeFader(video, {
+		fadeScaling: configGetNum("fadeScaling"),
+		fadeDuration: configGetNum("fadeInDuration"),
+	});
+
+	await transitionAudio.play();
+	await transitionAudio.seek(video.currentTime);
+
+	video.onseeking = () => {
+		transitionAudio.seek(video.currentTime);
+	};
+	video.onpause = () => {
+		transitionAudio.pause();
+	};
+	video.onplay = async () => {
+		await transitionAudio.play();
+		await transitionAudio.seek(video.currentTime);
+
+		// Fade in
+		const videoVolume = video.volume;
+		video.volume = 0;
+		videoFader.fadeTo(videoVolume);
+	};
+
+	// Exit just before the end for the transition
+	const transitionBeforeEnd = () => {
+		if (
+			video.currentTime >= video.duration - configGetNum("secondsBeforeEnd") &&
+			isReadyToCrossfade()
+		) {
+			video.removeEventListener("timeupdate", transitionBeforeEnd);
+
+			// Go to next video - XXX: does not support "repeat 1" mode
+			document.querySelector(".next-button").click();
+		}
+	};
+	video.ontimeupdate = transitionBeforeEnd;
+};
+
+const onApiLoaded = () => {
+	watchVideoIDChanges(async (videoID) => {
+		await waitForTransition;
+		const url = await getStreamURL(videoID);
+		if (!url) {
+			return;
+		}
+		await createAudioForCrossfade(url);
+	});
+};
+
+const crossfade = async (cb) => {
+	if (!isReadyToCrossfade()) {
+		cb();
+		return;
+	}
+
+	let resolveTransition;
+	waitForTransition = new Promise(function (resolve, reject) {
+		resolveTransition = resolve;
+	});
+
+	const video = document.querySelector("video");
+
+	const fader = new VolumeFader(transitionAudio._sounds[0]._node, {
+		initialVolume: video.volume,
+		fadeScaling: configGetNum("fadeScaling"),
+		fadeDuration: configGetNum("fadeOutDuration"),
+	});
+
+	// Fade out the music
+	video.volume = 0;
+	fader.fadeOut(() => {
+		resolveTransition();
+		cb();
+	});
+};
+
+module.exports = async () => {
+	config = await configProvider.getAll();
+
+	configProvider.subscribeAll((newConfig) => {
+		config = newConfig;
+	});
+
+	document.addEventListener("apiLoaded", onApiLoaded, {
+		once: true,
+		passive: true,
+	});
+};

plugins/crossfade/menu.js

@@ -0,0 +1,72 @@
+const config = require("./config");
+const defaultOptions = require("../../config/defaults").plugins.crossfade;
+
+const prompt = require("custom-electron-prompt");
+const promptOptions = require("../../providers/prompt-options");
+
+module.exports = (win) => [
+	{
+		label: "Advanced",
+		click: async () => {
+			const newOptions = await promptCrossfadeValues(win, config.getAll());
+			if (newOptions) config.setAll(newOptions);
+		},
+	},
+];
+
+async function promptCrossfadeValues(win, options) {
+	const res = await prompt(
+		{
+			title: "Crossfade Options",
+			type: "multiInput",
+			multiInputOptions: [
+				{
+					label: "Fade in duration (ms)",
+					value: options.fadeInDuration || defaultOptions.fadeInDuration,
+					inputAttrs: {
+						type: "number",
+						required: true,
+						min: 0,
+						step: 100,
+					},
+				},
+				{
+					label: "Fade out duration (ms)",
+					value: options.fadeOutDuration || defaultOptions.fadeOutDuration,
+					inputAttrs: {
+						type: "number",
+						required: true,
+						min: 0,
+						step: 100,
+					},
+				},
+				{
+					label: "Crossfade x seconds before end",
+					value:
+						options.secondsBeforeEnd || defaultOptions.secondsBeforeEnd,
+					inputAttrs: {
+						type: "number",
+						required: true,
+						min: 0,
+					},
+				},
+				{
+					label: "Fade scaling",
+					selectOptions: { linear: "Linear", logarithmic: "Logarithmic" },
+					value: options.fadeScaling || defaultOptions.fadeScaling,
+				},
+			],
+			resizable: true,
+			height: 360,
+			...promptOptions(),
+		},
+		win,
+	).catch(console.error);
+	if (!res) return undefined;
+	return {
+		fadeInDuration: Number(res[0]),
+		fadeOutDuration: Number(res[1]),
+		secondsBeforeEnd: Number(res[2]),
+		fadeScaling: res[3],
+	};
+}

plugins/disable-autoplay/front.js

@@ -0,0 +1,14 @@
+module.exports = () => {
+	document.addEventListener('apiLoaded', apiEvent => {
+		apiEvent.detail.addEventListener('videodatachange', name => {
+			if (name === 'dataloaded') {
+				apiEvent.detail.pauseVideo();
+				document.querySelector('video').ontimeupdate = e => {
+					e.target.pause();
+				}
+			} else {
+				document.querySelector('video').ontimeupdate = null;
+		   }
+		})
+	}, { once: true, passive: true })
+};

plugins/discord/back.js

@@ -0,0 +1,171 @@
+"use strict";
+const Discord = require("@xhayper/discord-rpc");
+const { dev } = require("electron-is");
+const { dialog, app } = require("electron");
+
+const registerCallback = require("../../providers/song-info");
+
+// Application ID registered by @Zo-Bro-23
+const clientId = "1043858434585526382";
+
+/**
+ * @typedef {Object} Info
+ * @property {import('@xhayper/discord-rpc').Client} rpc
+ * @property {boolean} ready
+ * @property {boolean} autoReconnect
+ * @property {import('../../providers/song-info').SongInfo} lastSongInfo
+ */
+/**
+ * @type {Info}
+ */
+const info = {
+	rpc: new Discord.Client({
+		clientId
+	}),
+	ready: false,
+	autoReconnect: true,
+	lastSongInfo: null,
+};
+
+/**
+ * @type {(() => void)[]}
+ */
+const refreshCallbacks = [];
+
+const resetInfo = () => {
+	info.ready = false;
+	clearTimeout(clearActivity);
+	if (dev()) console.log("discord disconnected");
+	refreshCallbacks.forEach(cb => cb());
+};
+
+info.rpc.on("connected", () => {
+	if (dev()) console.log("discord connected");
+	refreshCallbacks.forEach(cb => cb());
+});
+
+info.rpc.on("ready", () => {
+	info.ready = true;
+	if (info.lastSongInfo) updateActivity(info.lastSongInfo)
+});
+
+info.rpc.on("disconnected", () => {
+	resetInfo();
+
+	if (info.autoReconnect) {
+		connectTimeout();
+	}
+});
+
+const connectTimeout = () => new Promise((resolve, reject) => setTimeout(() => {
+	if (!info.autoReconnect || info.rpc.isConnected) return;
+	info.rpc.login().then(resolve).catch(reject);
+}, 5000));
+
+const connectRecursive = () => {
+	if (!info.autoReconnect || info.rpc.isConnected) return;
+	connectTimeout().catch(connectRecursive);
+}
+
+let window;
+const connect = (showErr = false) => {
+	if (info.rpc.isConnected) {
+		if (dev())
+			console.log('Attempted to connect with active connection');
+		return;
+	}
+
+	info.ready = false;
+
+	// Startup the rpc client
+	info.rpc.login({ clientId }).catch(err => {
+		resetInfo();
+		if (dev()) console.error(err);
+		if (info.autoReconnect) {
+			connectRecursive();
+		}
+		else if (showErr) dialog.showMessageBox(window, { title: 'Connection failed', message: err.message || String(err), type: 'error' });
+	});
+};
+
+let clearActivity;
+/**
+ * @type {import('../../providers/song-info').songInfoCallback}
+ */
+let updateActivity;
+
+module.exports = (win, { autoReconnect, activityTimoutEnabled, activityTimoutTime, listenAlong, hideDurationLeft }) => {
+	info.autoReconnect = autoReconnect;
+
+	window = win;
+	// We get multiple events
+	// Next song: PAUSE(n), PAUSE(n+1), PLAY(n+1)
+	// Skip time: PAUSE(N), PLAY(N)
+	updateActivity = songInfo => {
+		if (songInfo.title.length === 0 && songInfo.artist.length === 0) {
+			return;
+		}
+		info.lastSongInfo = songInfo;
+
+		// stop the clear activity timout
+		clearTimeout(clearActivity);
+
+		// stop early if discord connection is not ready
+		// do this after clearTimeout to avoid unexpected clears
+		if (!info.rpc || !info.ready) {
+			return;
+		}
+
+		// clear directly if timeout is 0
+		if (songInfo.isPaused && activityTimoutEnabled && activityTimoutTime === 0) {
+			info.rpc.user?.clearActivity().catch(console.error);
+			return;
+		}
+
+		// Song information changed, so lets update the rich presence
+		// @see https://discord.com/developers/docs/topics/gateway#activity-object
+		// not all options are transfered through https://github.com/discordjs/RPC/blob/6f83d8d812c87cb7ae22064acd132600407d7d05/src/client.js#L518-530
+		const activityInfo = {
+			details: songInfo.title,
+			state: songInfo.artist,
+			largeImageKey: songInfo.imageSrc,
+			largeImageText: songInfo.album,
+				buttons: listenAlong ? [
+				{ label: "Listen Along", url: songInfo.url },
+			] : undefined,
+		};
+
+		if (songInfo.isPaused) {
+			// Add a paused icon to show that the song is paused
+			activityInfo.smallImageKey = "paused";
+			activityInfo.smallImageText = "Paused";
+			// Set start the timer so the activity gets cleared after a while if enabled
+			if (activityTimoutEnabled)
+				clearActivity = setTimeout(() => info.rpc.user?.clearActivity().catch(console.error), activityTimoutTime ?? 10000);
+		} else if (!hideDurationLeft) {
+			// Add the start and end time of the song
+			const songStartTime = Date.now() - songInfo.elapsedSeconds * 1000;
+			activityInfo.startTimestamp = songStartTime;
+			activityInfo.endTimestamp =
+				songStartTime + songInfo.songDuration * 1000;
+		}
+
+		info.rpc.user?.setActivity(activityInfo).catch(console.error);
+	};
+
+	// If the page is ready, register the callback
+	win.once("ready-to-show", () => {
+		registerCallback(updateActivity);
+		connect();
+	});
+	app.on('window-all-closed', module.exports.clear)
+};
+
+module.exports.clear = () => {
+	if (info.rpc) info.rpc.user?.clearActivity();
+	clearTimeout(clearActivity);
+};
+
+module.exports.connect = connect;
+module.exports.registerRefresh = (cb) => refreshCallbacks.push(cb);
+module.exports.isConnected = () => info.rpc !== null;

plugins/discord/menu.js

@@ -0,0 +1,84 @@
+const prompt = require("custom-electron-prompt");
+
+const { setMenuOptions } = require("../../config/plugins");
+const promptOptions = require("../../providers/prompt-options");
+const { clear, connect, registerRefresh, isConnected } = require("./back");
+
+const { singleton } = require("../../providers/decorators")
+
+const registerRefreshOnce = singleton((refreshMenu) => {
+	registerRefresh(refreshMenu);
+});
+
+module.exports = (win, options, refreshMenu) => {
+	registerRefreshOnce(refreshMenu);
+
+	return [
+		{
+			label: isConnected() ? "Connected" : "Reconnect",
+			enabled: !isConnected(),
+			click: connect,
+		},
+		{
+			label: "Auto reconnect",
+			type: "checkbox",
+			checked: options.autoReconnect,
+			click: (item) => {
+				options.autoReconnect = item.checked;
+				setMenuOptions('discord', options);
+			},
+		},
+		{
+			label: "Clear activity",
+			click: clear,
+		},
+		{
+			label: "Clear activity after timeout",
+			type: "checkbox",
+			checked: options.activityTimoutEnabled,
+			click: (item) => {
+				options.activityTimoutEnabled = item.checked;
+				setMenuOptions('discord', options);
+			},
+		},
+		{
+			label: "Listen Along",
+			type: "checkbox",
+			checked: options.listenAlong,
+			click: (item) => {
+				options.listenAlong = item.checked;
+				setMenuOptions('discord', options);
+			},
+		},
+		{
+			label: "Hide duration left",
+			type: "checkbox",
+			checked: options.hideDurationLeft,
+			click: (item) => {
+				options.hideDurationLeft = item.checked;
+				setMenuOptions('discord', options);
+			}
+		},
+		{
+			label: "Set inactivity timeout",
+			click: () => setInactivityTimeout(win, options),
+		},
+	];
+};
+
+async function setInactivityTimeout(win, options) {
+	let output = await prompt({
+		title: 'Set Inactivity Timeout',
+		label: 'Enter inactivity timeout in seconds:',
+		value: Math.round((options.activityTimoutTime ?? 0) / 1e3),
+		type: "counter",
+		counterOptions: { minimum: 0, multiFire: true },
+		width: 450,
+		...promptOptions()
+	}, win)
+
+	if (output) {
+		options.activityTimoutTime = Math.round(output * 1e3);
+		setMenuOptions("discord", options);
+	}
+}

plugins/downloader/actions.js

@@ -1,9 +0,0 @@
-const CHANNEL = "downloader";
-const ACTIONS = {
-	ERROR: "error",
-};
-
-module.exports = {
-	CHANNEL: CHANNEL,
-	ACTIONS: ACTIONS,
-};

plugins/downloader/back.js

@@ -1,33 +1,519 @@
-const { join } = require("path");
+const {
+  existsSync,
+  mkdirSync,
+  createWriteStream,
+  writeFileSync,
+} = require('fs');
+const { join } = require('path');
 
-const { dialog } = require("electron");
+const { fetchFromGenius } = require('../lyrics-genius/back');
+const { isEnabled } = require('../../config/plugins');
+const { getImage, cleanupName } = require('../../providers/song-info');
+const { injectCSS } = require('../utils');
+const { cache } = require("../../providers/decorators")
+const {
+  presets,
+  cropMaxWidth,
+  getFolder,
+  setBadge,
+  sendFeedback: sendFeedback_,
+} = require('./utils');
 
-const { injectCSS, listenAction } = require("../utils");
-const { ACTIONS, CHANNEL } = require("./actions.js");
+const { ipcMain, app, dialog } = require('electron');
+const is = require('electron-is');
+const { Innertube, UniversalCache, Utils, ClientType } = require('youtubei.js');
+const ytpl = require('ytpl'); // REPLACE with youtubei getplaylist https://github.com/LuanRT/YouTube.js#getplaylistid
 
-const sendError = (win, err) => {
-	const dialogOpts = {
-		type: "info",
-		buttons: ["OK"],
-		title: "Error in download!",
-		message: "Argh! Apologies, download failed…",
-		detail: err.toString(),
-	};
-	dialog.showMessageBox(dialogOpts);
+const filenamify = require('filenamify');
+const ID3Writer = require('browser-id3-writer');
+const { randomBytes } = require('crypto');
+const Mutex = require('async-mutex').Mutex;
+const ffmpeg = require('@ffmpeg/ffmpeg').createFFmpeg({
+  log: false,
+  logger: () => {}, // console.log,
+  progress: () => {}, // console.log,
+});
+const ffmpegMutex = new Mutex();
+
+const config = require('./config');
+
+/** @type {Innertube} */
+let yt;
+let win;
+let playingUrl = undefined;
+
+const sendError = (error, source) => {
+  win.setProgressBar(-1); // close progress bar
+  setBadge(0); // close badge
+  sendFeedback_(win); // reset feedback
+
+  const songNameMessage = source ? `\nin ${source}` : '';
+  const cause = error.cause ? `\n\n${error.cause.toString()}` : '';
+  const message = `${error.toString()}${songNameMessage}${cause}`;
+
+  console.error(message);
+  dialog.showMessageBox({
+    type: 'info',
+    buttons: ['OK'],
+    title: 'Error in download!',
+    message: 'Argh! Apologies, download failed…',
+    detail: message,
+  });
 };
 
-function handle(win) {
-	injectCSS(win.webContents, join(__dirname, "style.css"));
+module.exports = async (win_) => {
+  win = win_;
+  injectCSS(win.webContents, join(__dirname, 'style.css'));
 
-	listenAction(CHANNEL, (event, action, error) => {
-		switch (action) {
-			case ACTIONS.ERROR:
-				sendError(win, error);
-				break;
-			default:
-				console.log("Unknown action: " + action);
-		}
-	});
+  yt = await Innertube.create({
+    cache: new UniversalCache(false),
+    generate_session_locally: true,
+  });
+  ipcMain.on('download-song', (_, url) => downloadSong(url));
+  ipcMain.on('video-src-changed', async (_, data) => {
+    playingUrl =
+      JSON.parse(data)?.microformat?.microformatDataRenderer?.urlCanonical;
+  });
+  ipcMain.on('download-playlist-request', async (_event, url) =>
+    downloadPlaylist(url),
+  );
+};
+
+module.exports.downloadSong = downloadSong;
+module.exports.downloadPlaylist = downloadPlaylist;
+
+async function downloadSong(
+  url,
+  playlistFolder = undefined,
+  trackId = undefined,
+  increasePlaylistProgress = () => {},
+) {
+  let resolvedName = undefined;
+  try {
+    await downloadSongUnsafe(
+      url,
+      name=>resolvedName=name,
+      playlistFolder,
+      trackId,
+      increasePlaylistProgress,
+    );
+  } catch (error) {
+    sendError(error, resolvedName || url);
+  }
 }
 
-module.exports = handle;
+async function downloadSongUnsafe(
+  url,
+  setName,
+  playlistFolder = undefined,
+  trackId = undefined,
+  increasePlaylistProgress = () => {},
+) {
+  const sendFeedback = (message, progress) => {
+    if (!playlistFolder) {
+      sendFeedback_(win, message);
+      if (!isNaN(progress)) {
+        win.setProgressBar(progress);
+      }
+    }
+  };
+
+  sendFeedback('Downloading...', 2);
+
+  const id = getVideoId(url);
+  let info = await yt.music.getInfo(id);
+
+  if (!info) {
+    throw new Error('Video not found');
+  }
+
+  const metadata = getMetadata(info);
+  if (metadata.album === 'N/A') metadata.album = '';
+  metadata.trackId = trackId;
+
+  const dir =
+    playlistFolder || config.get('downloadFolder') || app.getPath('downloads');
+  const name = `${metadata.artist ? `${metadata.artist} - ` : ''}${
+    metadata.title
+  }`;
+  setName(name);
+
+	let playabilityStatus = info.playability_status;
+	let bypassedResult = null;
+	if (playabilityStatus.status === "LOGIN_REQUIRED") {
+		// try to bypass the age restriction
+		bypassedResult = await getAndroidTvInfo(id);
+		playabilityStatus = bypassedResult.playability_status;
+
+		if (playabilityStatus.status === "LOGIN_REQUIRED") {
+			throw new Error(
+				`[${playabilityStatus.status}] ${playabilityStatus.reason}`,
+			);
+		}
+
+		info = bypassedResult;
+	}
+
+	if (playabilityStatus.status === "UNPLAYABLE") {
+		/**
+		 * @typedef {import('youtubei.js/dist/src/parser/classes/PlayerErrorMessage').default} PlayerErrorMessage
+		 * @type {PlayerErrorMessage}
+		 */
+		const errorScreen = playabilityStatus.error_screen;
+		throw new Error(
+			`[${playabilityStatus.status}] ${errorScreen.reason.text}: ${errorScreen.subreason.text}`,
+		);
+	}
+
+  const extension = presets[config.get('preset')]?.extension || 'mp3';
+
+  const filename = filenamify(`${name}.${extension}`, {
+    replacement: '_',
+    maxLength: 255,
+  });
+  const filePath = join(dir, filename);
+
+  if (config.get('skipExisting') && existsSync(filePath)) {
+    sendFeedback(null, -1);
+    return;
+  }
+
+  const download_options = {
+    type: 'audio', // audio, video or video+audio
+    quality: 'best', // best, bestefficiency, 144p, 240p, 480p, 720p and so on.
+    format: 'any', // media container format
+  };
+
+  const format = info.chooseFormat(download_options);
+  const stream = await info.download(download_options);
+
+  console.info(
+    `Downloading ${metadata.artist} - ${metadata.title} [${metadata.id}]`,
+  );
+
+  const iterableStream = Utils.streamToIterable(stream);
+
+  if (!existsSync(dir)) {
+    mkdirSync(dir);
+  }
+
+  if (!presets[config.get('preset')]) {
+    const fileBuffer = await iterableStreamToMP3(
+      iterableStream,
+      metadata,
+      format.content_length,
+      sendFeedback,
+      increasePlaylistProgress,
+    );
+    writeFileSync(filePath, await writeID3(fileBuffer, metadata, sendFeedback));
+  } else {
+    const file = createWriteStream(filePath);
+    let downloaded = 0;
+    const total = format.content_length;
+
+    for await (const chunk of iterableStream) {
+      downloaded += chunk.length;
+      const ratio = downloaded / total;
+      const progress = Math.floor(ratio * 100);
+      sendFeedback(`Download: ${progress}%`, ratio);
+      increasePlaylistProgress(ratio);
+      file.write(chunk);
+    }
+    await ffmpegWriteTags(
+      filePath,
+      metadata,
+      presets[config.get('preset')]?.ffmpegArgs,
+    );
+    sendFeedback(null, -1);
+  }
+
+  sendFeedback(null, -1);
+  console.info(`Done: "${filePath}"`);
+}
+
+async function iterableStreamToMP3(
+  stream,
+  metadata,
+  content_length,
+  sendFeedback,
+  increasePlaylistProgress = () => {},
+) {
+  const chunks = [];
+  let downloaded = 0;
+  const total = content_length;
+  for await (const chunk of stream) {
+    downloaded += chunk.length;
+    chunks.push(chunk);
+    const ratio = downloaded / total;
+    const progress = Math.floor(ratio * 100);
+    sendFeedback(`Download: ${progress}%`, ratio);
+    // 15% for download, 85% for conversion
+    // This is a very rough estimate, trying to make the progress bar look nice
+    increasePlaylistProgress(ratio * 0.15);
+  }
+  sendFeedback('Loading…', 2); // indefinite progress bar after download
+
+  const buffer = Buffer.concat(chunks);
+  const safeVideoName = randomBytes(32).toString('hex');
+  const releaseFFmpegMutex = await ffmpegMutex.acquire();
+
+  try {
+    if (!ffmpeg.isLoaded()) {
+      await ffmpeg.load();
+    }
+
+    sendFeedback('Preparing file…');
+    ffmpeg.FS('writeFile', safeVideoName, buffer);
+
+    sendFeedback('Converting…');
+
+    ffmpeg.setProgress(({ ratio }) => {
+      sendFeedback(`Converting: ${Math.floor(ratio * 100)}%`, ratio);
+      increasePlaylistProgress(0.15 + ratio * 0.85);
+    });
+
+    await ffmpeg.run(
+      '-i',
+      safeVideoName,
+      ...getFFmpegMetadataArgs(metadata),
+      `${safeVideoName}.mp3`,
+    );
+
+    sendFeedback('Saving…');
+
+    return ffmpeg.FS('readFile', `${safeVideoName}.mp3`);
+  } catch (e) {
+    sendError(e, safeVideoName);
+  } finally {
+    releaseFFmpegMutex();
+  }
+}
+
+const getCoverBuffer = cache(async (url) => {
+  const nativeImage = cropMaxWidth(await getImage(url));
+  return nativeImage && !nativeImage.isEmpty() ? nativeImage.toPNG() : null;
+});
+
+async function writeID3(buffer, metadata, sendFeedback) {
+  try {
+    sendFeedback('Writing ID3 tags...');
+
+    const coverBuffer = await getCoverBuffer(metadata.image);
+
+    const writer = new ID3Writer(buffer);
+
+    // Create the metadata tags
+    writer.setFrame('TIT2', metadata.title).setFrame('TPE1', [metadata.artist]);
+    if (metadata.album) {
+      writer.setFrame('TALB', metadata.album);
+    }
+    if (coverBuffer) {
+      writer.setFrame('APIC', {
+        type: 3,
+        data: coverBuffer,
+        description: '',
+      });
+    }
+    if (isEnabled('lyrics-genius')) {
+      const lyrics = await fetchFromGenius(metadata);
+      if (lyrics) {
+        writer.setFrame('USLT', {
+          description: '',
+          lyrics: lyrics,
+        });
+      }
+    }
+    if (metadata.trackId) {
+      writer.setFrame('TRCK', metadata.trackId);
+    }
+    writer.addTag();
+    return Buffer.from(writer.arrayBuffer);
+  } catch (e) {
+    sendError(e, `${metadata.artist} - ${metadata.title}`);
+  }
+}
+
+async function downloadPlaylist(givenUrl) {
+  try {
+    givenUrl = new URL(givenUrl);
+  } catch {
+    givenUrl = undefined;
+  }
+  const playlistId =
+    getPlaylistID(givenUrl) ||
+    getPlaylistID(new URL(win.webContents.getURL())) ||
+    getPlaylistID(new URL(playingUrl));
+
+  if (!playlistId) {
+    sendError(new Error('No playlist ID found'));
+    return;
+  }
+
+  const sendFeedback = (message) => sendFeedback_(win, message);
+
+  console.log(`trying to get playlist ID: '${playlistId}'`);
+  sendFeedback('Getting playlist info…');
+  let playlist;
+  try {
+    playlist = await ytpl(playlistId, {
+      limit: config.get('playlistMaxItems') || Infinity,
+    });
+  } catch (e) {
+    sendError(
+      `Error getting playlist info: make sure it isn\'t a private or "Mixed for you" playlist\n\n${e}`,
+    );
+    return;
+  }
+  if (playlist.items.length === 0) sendError(new Error('Playlist is empty'));
+  if (playlist.items.length === 1) {
+    sendFeedback('Playlist has only one item, downloading it directly');
+    await downloadSong(playlist.items[0].url);
+    return;
+  }
+  const isAlbum = playlist.title.startsWith('Album - ');
+  if (isAlbum) {
+    playlist.title = playlist.title.slice(8);
+  }
+  const safePlaylistTitle = filenamify(playlist.title, { replacement: ' ' });
+
+  const folder = getFolder(config.get('downloadFolder'));
+  const playlistFolder = join(folder, safePlaylistTitle);
+  if (existsSync(playlistFolder)) {
+    if (!config.get('skipExisting')) {
+      sendError(new Error(`The folder ${playlistFolder} already exists`));
+      return;
+    }
+  } else {
+    mkdirSync(playlistFolder, { recursive: true });
+  }
+
+  dialog.showMessageBox({
+    type: 'info',
+    buttons: ['OK'],
+    title: 'Started Download',
+    message: `Downloading Playlist "${playlist.title}"`,
+    detail: `(${playlist.items.length} songs)`,
+  });
+
+  if (is.dev()) {
+    console.log(
+      `Downloading playlist "${playlist.title}" - ${playlist.items.length} songs (${playlistId})`,
+    );
+  }
+
+  win.setProgressBar(2); // starts with indefinite bar
+
+  setBadge(playlist.items.length);
+
+  let counter = 1;
+
+  const progressStep = 1 / playlist.items.length;
+
+  const increaseProgress = (itemPercentage) => {
+    const currentProgress = (counter - 1) / playlist.items.length;
+    const newProgress = currentProgress + progressStep * itemPercentage;
+    win.setProgressBar(newProgress);
+  };
+
+  try {
+    for (const song of playlist.items) {
+      sendFeedback(`Downloading ${counter}/${playlist.items.length}...`);
+      const trackId = isAlbum ? counter : undefined;
+      await downloadSong(
+        song.url,
+        playlistFolder,
+        trackId,
+        increaseProgress,
+      ).catch((e) =>
+        sendError(
+          `Error downloading "${song.author.name} - ${song.title}":\n  ${e}`,
+        ),
+      );
+
+      win.setProgressBar(counter / playlist.items.length);
+      setBadge(playlist.items.length - counter);
+      counter++;
+    }
+  } catch (e) {
+    sendError(e);
+  } finally {
+    win.setProgressBar(-1); // close progress bar
+    setBadge(0); // close badge counter
+    sendFeedback(); // clear feedback
+  }
+}
+
+async function ffmpegWriteTags(filePath, metadata, ffmpegArgs = []) {
+  const releaseFFmpegMutex = await ffmpegMutex.acquire();
+
+  try {
+    if (!ffmpeg.isLoaded()) {
+      await ffmpeg.load();
+    }
+
+    await ffmpeg.run(
+      '-i',
+      filePath,
+      ...getFFmpegMetadataArgs(metadata),
+      ...ffmpegArgs,
+      filePath,
+    );
+  } catch (e) {
+    sendError(e);
+  } finally {
+    releaseFFmpegMutex();
+  }
+}
+
+function getFFmpegMetadataArgs(metadata) {
+  if (!metadata) {
+    return;
+  }
+
+  return [
+    ...(metadata.title ? ['-metadata', `title=${metadata.title}`] : []),
+    ...(metadata.artist ? ['-metadata', `artist=${metadata.artist}`] : []),
+    ...(metadata.album ? ['-metadata', `album=${metadata.album}`] : []),
+    ...(metadata.trackId ? ['-metadata', `track=${metadata.trackId}`] : []),
+  ];
+}
+
+// Playlist radio modifier needs to be cut from playlist ID
+const INVALID_PLAYLIST_MODIFIER = 'RDAMPL';
+
+const getPlaylistID = (aURL) => {
+  const result =
+    aURL?.searchParams.get('list') || aURL?.searchParams.get('playlist');
+  if (result?.startsWith(INVALID_PLAYLIST_MODIFIER)) {
+    return result.slice(INVALID_PLAYLIST_MODIFIER.length);
+  }
+  return result;
+};
+
+const getVideoId = (url) => {
+  if (typeof url === 'string') {
+    url = new URL(url);
+  }
+  return url.searchParams.get('v');
+};
+
+const getMetadata = (info) => ({
+  id: info.basic_info.id,
+  title: cleanupName(info.basic_info.title),
+  artist: cleanupName(info.basic_info.author),
+  album: info.player_overlays?.browser_media_session?.album?.text,
+  image: info.basic_info.thumbnail?.find((t) => !t.url.endsWith('.webp'))?.url,
+});
+
+// This is used to bypass age restrictions
+const getAndroidTvInfo = async (id) => {
+  const innertube = await Innertube.create({
+    clientType: ClientType.TV_EMBEDDED,
+    generate_session_locally: true,
+    retrieve_player: true,
+  });
+  const info = await innertube.getBasicInfo(id, 'TV_EMBEDDED');
+  // getInfo 404s with the bypass, so we use getBasicInfo instead
+  // that's fine as we only need the streaming data
+  return info;
+}

plugins/downloader/config.js

@@ -0,0 +1,3 @@
+const { PluginConfig } = require('../../config/dynamic');
+const config = new PluginConfig('downloader');
+module.exports = { ...config };

plugins/downloader/front.js

@@ -1,60 +1,69 @@
-const { ElementFromFile, templatePath, triggerAction } = require("../utils");
-const { ACTIONS, CHANNEL } = require("./actions.js");
-const { downloadVideoToMP3 } = require("./youtube-dl");
+const { ipcRenderer } = require("electron");
+
+const { defaultConfig } = require("../../config");
+const { getSongMenu } = require("../../providers/dom-elements");
+const { ElementFromFile, templatePath } = require("../utils");
 
 let menu = null;
 let progress = null;
 const downloadButton = ElementFromFile(
 	templatePath(__dirname, "download.html")
 );
-let pluginOptions = {};
 
-const observer = new MutationObserver((mutations, observer) => {
+let doneFirstLoad = false;
+
+const menuObserver = new MutationObserver(() => {
 	if (!menu) {
-		menu = document.querySelector("ytmusic-menu-popup-renderer paper-listbox");
+		menu = getSongMenu();
+		if (!menu) return;
 	}
+	if (menu.contains(downloadButton)) return;
+	const menuUrl = document.querySelector('tp-yt-paper-listbox [tabindex="0"] #navigation-endpoint')?.href;
+	if (!menuUrl?.includes('watch?') && doneFirstLoad) return;
 
-	if (menu && !menu.contains(downloadButton)) {
-		menu.prepend(downloadButton);
-		progress = document.querySelector("#ytmcustom-download");
-	}
+	menu.prepend(downloadButton);
+	progress = document.querySelector("#ytmcustom-download");
+
+	if (doneFirstLoad) return;
+	setTimeout(() => doneFirstLoad ||= true, 500);
 });
 
-const reinit = () => {
-	if (!progress) {
-		console.warn("Cannot update progress");
-	} else {
-		progress.innerHTML = "Download";
-	}
-};
-
+// TODO: re-enable once contextIsolation is set to true
+// contextBridge.exposeInMainWorld("downloader", {
+// 	download: () => {
 global.download = () => {
-	const videoUrl = window.location.href;
+	let videoUrl = getSongMenu()
+		// selector of first button which is always "Start Radio"
+		?.querySelector('ytmusic-menu-navigation-item-renderer[tabindex="0"] #navigation-endpoint')
+		?.getAttribute("href");
+	if (videoUrl) {
+		if (videoUrl.startsWith('watch?')) {
+			videoUrl = defaultConfig.url + "/" + videoUrl;
+		}
+		if (videoUrl.includes('?playlist=')) {
+			ipcRenderer.send('download-playlist-request', videoUrl);
+			return;
+		}
+	} else {
+		videoUrl = global.songInfo.url || window.location.href;
+	}
 
-	downloadVideoToMP3(
-		videoUrl,
-		(feedback) => {
-			if (!progress) {
-				console.warn("Cannot update progress");
-			} else {
-				progress.innerHTML = feedback;
-			}
-		},
-		(error) => {
-			triggerAction(CHANNEL, ACTIONS.ERROR, error);
-			reinit();
-		},
-		reinit,
-		pluginOptions
-	);
+	ipcRenderer.send('download-song', videoUrl);
 };
 
-function observeMenu(options) {
-	pluginOptions = { ...pluginOptions, ...options };
-	observer.observe(document, {
-		childList: true,
-		subtree: true,
-	});
-}
+module.exports = () => {
+	document.addEventListener('apiLoaded', () => {
+		menuObserver.observe(document.querySelector('ytmusic-popup-container'), {
+			childList: true,
+			subtree: true,
+		});
+	}, { once: true, passive: true })
 
-module.exports = observeMenu;
+	ipcRenderer.on('downloader-feedback', (_, feedback) => {
+		if (!progress) {
+			console.warn("Cannot update progress");
+		} else {
+			progress.innerHTML = feedback || "Download";
+		}
+	});
+};

plugins/downloader/menu.js

@@ -0,0 +1,45 @@
+const { dialog } = require("electron");
+
+const { downloadPlaylist } = require("./back");
+const { defaultMenuDownloadLabel, getFolder, presets } = require("./utils");
+const config = require("./config");
+
+module.exports = () => {
+	return [
+		{
+			label: defaultMenuDownloadLabel,
+			click: () => downloadPlaylist(),
+		},
+		{
+			label: "Choose download folder",
+			click: () => {
+				const result = dialog.showOpenDialogSync({
+					properties: ["openDirectory", "createDirectory"],
+					defaultPath: getFolder(config.get("downloadFolder")),
+				});
+				if (result) {
+					config.set("downloadFolder", result[0]);
+				} // else = user pressed cancel
+			},
+		},
+		{
+			label: "Presets",
+			submenu: Object.keys(presets).map((preset) => ({
+				label: preset,
+				type: "radio",
+				checked: config.get("preset") === preset,
+				click: () => {
+					config.set("preset", preset);
+				},
+			})),
+		},
+		{
+			label: "Skip existing files",
+			type: "checkbox",
+			checked: config.get("skipExisting"),
+			click: (item) => {
+				config.set("skipExisting", item.checked);
+			},
+		},
+	];
+};

plugins/downloader/style.css

@@ -6,8 +6,16 @@
 	cursor: pointer;
 }
 
+.menu-item > .yt-simple-endpoint:hover {
+	background-color: var(--ytmusic-menu-item-hover-background-color);
+}
+
 .menu-icon {
 	flex: var(--ytmusic-menu-item-icon_-_flex);
 	margin: var(--ytmusic-menu-item-icon_-_margin);
 	fill: var(--ytmusic-menu-item-icon_-_fill);
+	stroke: var(--iron-icon-stroke-color, none);
+	width: var(--iron-icon-width, 24px);
+	height: var(--iron-icon-height, 24px);
+	animation: var(--iron-icon_-_animation);
 }

plugins/downloader/templates/download.html

@@ -1,5 +1,5 @@
 <div
-	class="menu-item ytmusic-menu-popup-renderer"
+	class="style-scope menu-item ytmusic-menu-popup-renderer"
 	role="option"
 	tabindex="-1"
 	aria-disabled="false"
@@ -7,31 +7,39 @@
 	onclick="download()"
 >
 	<div
-		class="menu-icon yt-icon-container yt-icon ytmusic-toggle-menu-service-item-renderer"
+		id="navigation-endpoint"
+		class="yt-simple-endpoint style-scope ytmusic-menu-navigation-item-renderer"
+		tabindex="-1"
 	>
-		<svg
-			viewBox="0 0 24 24"
-			preserveAspectRatio="xMidYMid meet"
-			focusable="false"
-			class="style-scope yt-icon"
-			style="pointer-events: none; display: block; width: 100%; height: 100%;"
+		<div
+			class="icon menu-icon style-scope ytmusic-menu-navigation-item-renderer"
 		>
-			<g class="style-scope yt-icon">
-				<path
-					d="M25.462,19.105v6.848H4.515v-6.848H0.489v8.861c0,1.111,0.9,2.012,2.016,2.012h24.967c1.115,0,2.016-0.9,2.016-2.012v-8.861H25.462z"
-					class="style-scope yt-icon"
-				/>
-				<path
-					d="M14.62,18.426l-5.764-6.965c0,0-0.877-0.828,0.074-0.828s3.248,0,3.248,0s0-0.557,0-1.416c0-2.449,0-6.906,0-8.723c0,0-0.129-0.494,0.615-0.494c0.75,0,4.035,0,4.572,0c0.536,0,0.524,0.416,0.524,0.416c0,1.762,0,6.373,0,8.742c0,0.768,0,1.266,0,1.266s1.842,0,2.998,0c1.154,0,0.285,0.867,0.285,0.867s-4.904,6.51-5.588,7.193C15.092,18.979,14.62,18.426,14.62,18.426z"
-					class="style-scope yt-icon"
-				/>
-			</g>
-		</svg>
-	</div>
-	<div
-		class="text style-scope ytmusic-toggle-menu-service-item-renderer"
-		id="ytmcustom-download"
-	>
-		Download
+			<svg
+				viewBox="0 0 24 24"
+				preserveAspectRatio="xMidYMid meet"
+				focusable="false"
+				class="style-scope yt-icon"
+				style="pointer-events: none; display: block; width: 100%; height: 100%"
+			>
+				<g class="style-scope yt-icon">
+					<path
+						d="M25.462,19.105v6.848H4.515v-6.848H0.489v8.861c0,1.111,0.9,2.012,2.016,2.012h24.967c1.115,0,2.016-0.9,2.016-2.012v-8.861H25.462z"
+						class="style-scope yt-icon"
+						fill="#aaaaaa"
+					/>
+					<path
+						d="M14.62,18.426l-5.764-6.965c0,0-0.877-0.828,0.074-0.828s3.248,0,3.248,0s0-0.557,0-1.416c0-2.449,0-6.906,0-8.723c0,0-0.129-0.494,0.615-0.494c0.75,0,4.035,0,4.572,0c0.536,0,0.524,0.416,0.524,0.416c0,1.762,0,6.373,0,8.742c0,0.768,0,1.266,0,1.266s1.842,0,2.998,0c1.154,0,0.285,0.867,0.285,0.867s-4.904,6.51-5.588,7.193C15.092,18.979,14.62,18.426,14.62,18.426z"
+						class="style-scope yt-icon"
+						fill="#aaaaaa"
+					/>
+				</g>
+			</svg>
+		</div>
+		<div
+			class="text style-scope ytmusic-menu-navigation-item-renderer"
+			id="ytmcustom-download"
+		>
+			Download
+		</div>
 	</div>
 </div>

plugins/downloader/utils.js

@@ -0,0 +1,38 @@
+const { app } = require("electron");
+const is = require('electron-is');
+
+module.exports.getFolder = customFolder => customFolder || app.getPath("downloads");
+module.exports.defaultMenuDownloadLabel = "Download playlist";
+
+module.exports.sendFeedback = (win, message) => {
+	win.webContents.send("downloader-feedback", message);
+};
+
+module.exports.cropMaxWidth = (image) => {
+	const imageSize = image.getSize();
+	// standart youtube artwork width with margins from both sides is 280 + 720 + 280
+	if (imageSize.width === 1280 && imageSize.height === 720) {
+		return image.crop({
+			x: 280,
+			y: 0,
+			width: 720,
+			height: 720
+		});
+	}
+	return image;
+}
+
+// Presets for FFmpeg
+module.exports.presets = {
+	"None (defaults to mp3)": undefined,
+	opus: {
+		extension: "opus",
+		ffmpegArgs: ["-acodec", "libopus"],
+	},
+};
+
+module.exports.setBadge = n => {
+	if (is.linux() || is.macOS()) {
+		app.setBadgeCount(n);
+	}
+}

plugins/downloader/youtube-dl.js

@@ -1,109 +0,0 @@
-const { randomBytes } = require("crypto");
-const { writeFileSync } = require("fs");
-const { join } = require("path");
-
-const downloadsFolder = require("downloads-folder");
-const is = require("electron-is");
-const filenamify = require("filenamify");
-
-// Browser version of FFmpeg (in renderer process) instead of loading @ffmpeg/ffmpeg
-// because --js-flags cannot be passed in the main process when the app is packaged
-// See https://github.com/electron/electron/issues/22705
-const FFmpeg = require("@ffmpeg/ffmpeg/dist/ffmpeg.min");
-const ytdl = require("ytdl-core");
-
-const { createFFmpeg } = FFmpeg;
-const ffmpeg = createFFmpeg({
-	log: false,
-	logger: () => {}, // console.log,
-	progress: () => {}, // console.log,
-});
-
-const downloadVideoToMP3 = (
-	videoUrl,
-	sendFeedback,
-	sendError,
-	reinit,
-	options
-) => {
-	sendFeedback("Downloading…");
-
-	let videoName = "YouTube Music - Unknown title";
-	let videoReadableStream;
-	try {
-		videoReadableStream = ytdl(videoUrl, {
-			filter: "audioonly",
-			quality: "highestaudio",
-			highWaterMark: 32 * 1024 * 1024, // 32 MB
-			requestOptions: { maxRetries: 3 },
-		});
-	} catch (err) {
-		sendError(err);
-		return;
-	}
-
-	const chunks = [];
-	videoReadableStream
-		.on("data", (chunk) => {
-			chunks.push(chunk);
-		})
-		.on("progress", (chunkLength, downloaded, total) => {
-			const progress = Math.floor((downloaded / total) * 100);
-			sendFeedback("Download: " + progress + "%");
-		})
-		.on("info", (info, format) => {
-			videoName = info.videoDetails.title.replace("|", "").toString("ascii");
-			if (is.dev()) {
-				console.log("Downloading video - name:", videoName);
-			}
-		})
-		.on("error", sendError)
-		.on("end", () => {
-			const buffer = Buffer.concat(chunks);
-			toMP3(videoName, buffer, sendFeedback, sendError, reinit, options);
-		});
-};
-
-const toMP3 = async (
-	videoName,
-	buffer,
-	sendFeedback,
-	sendError,
-	reinit,
-	options
-) => {
-	const safeVideoName = randomBytes(32).toString("hex");
-
-	try {
-		if (!ffmpeg.isLoaded()) {
-			sendFeedback("Loading…");
-			await ffmpeg.load();
-		}
-
-		sendFeedback("Preparing file…");
-		ffmpeg.FS("writeFile", safeVideoName, buffer);
-
-		sendFeedback("Converting…");
-		await ffmpeg.run(
-			"-i",
-			safeVideoName,
-			...options.ffmpegArgs,
-			safeVideoName + ".mp3"
-		);
-
-		const folder = options.downloadFolder || downloadsFolder();
-		const filename = filenamify(videoName + ".mp3", { replacement: "_" });
-		writeFileSync(
-			join(folder, filename),
-			ffmpeg.FS("readFile", safeVideoName + ".mp3")
-		);
-
-		reinit();
-	} catch (e) {
-		sendError(e);
-	}
-};
-
-module.exports = {
-	downloadVideoToMP3,
-};

plugins/exponential-volume/front.js

@@ -0,0 +1,47 @@
+// "Youtube Music fix volume ratio 0.4" by Marco Pfeiffer
+// https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/
+
+const exponentialVolume = () => {
+	// manipulation exponent, higher value = lower volume
+	// 3 is the value used by pulseaudio, which Barteks2x figured out this gist here: https://gist.github.com/Barteks2x/a4e189a36a10c159bb1644ffca21c02a
+	// 0.05 (or 5%) is the lowest you can select in the UI which with an exponent of 3 becomes 0.000125 or 0.0125%
+	const EXPONENT = 3;
+
+	const storedOriginalVolumes = new WeakMap();
+	const { get, set } = Object.getOwnPropertyDescriptor(
+		HTMLMediaElement.prototype,
+		"volume"
+	);
+	Object.defineProperty(HTMLMediaElement.prototype, "volume", {
+		get() {
+			const lowVolume = get.call(this);
+			const calculatedOriginalVolume = lowVolume ** (1 / EXPONENT);
+
+			// The calculated value has some accuracy issues which can lead to problems for implementations that expect exact values.
+			// To avoid this, I'll store the unmodified volume to return it when read here.
+			// This mostly solves the issue, but the initial read has no stored value and the volume can also change though external influences.
+			// To avoid ill effects, I check if the stored volume is somewhere in the same range as the calculated volume.
+			const storedOriginalVolume = storedOriginalVolumes.get(this);
+			const storedDeviation = Math.abs(
+				storedOriginalVolume - calculatedOriginalVolume
+			);
+
+			const originalVolume =
+				storedDeviation < 0.01
+					? storedOriginalVolume
+					: calculatedOriginalVolume;
+			return originalVolume;
+		},
+		set(originalVolume) {
+			const lowVolume = originalVolume ** EXPONENT;
+			storedOriginalVolumes.set(this, originalVolume);
+			set.call(this, lowVolume);
+		},
+	});
+};
+
+module.exports = () =>
+	document.addEventListener("apiLoaded", exponentialVolume, {
+		once: true,
+		passive: true,
+	});

plugins/in-app-menu/back.js

@@ -0,0 +1,23 @@
+const path = require("path");
+
+const electronLocalshortcut = require("electron-localshortcut");
+
+const { injectCSS } = require("../utils");
+
+const { setupTitlebar, attachTitlebarToWindow } = require('custom-electron-titlebar/main');
+setupTitlebar();
+
+//tracks menu visibility
+
+module.exports = (win) => {
+	// css for custom scrollbar + disable drag area(was causing bugs)
+	injectCSS(win.webContents, path.join(__dirname, "style.css"));
+
+	win.once("ready-to-show", () => {
+		attachTitlebarToWindow(win);
+
+		electronLocalshortcut.register(win, "`", () => {
+			win.webContents.send("toggleMenu");
+		});
+	});
+};

plugins/in-app-menu/front.js

@@ -0,0 +1,74 @@
+const { ipcRenderer } = require("electron");
+const config = require("../../config");
+const { Titlebar, Color } = require("custom-electron-titlebar");
+const { isEnabled } = require("../../config/plugins");
+function $(selector) { return document.querySelector(selector); }
+
+module.exports = (options) => {
+	let visible = () => !!$('.cet-menubar').firstChild;
+	const bar = new Titlebar({
+		icon: "https://cdn-icons-png.flaticon.com/512/5358/5358672.png",
+		backgroundColor: Color.fromHex("#050505"),
+		itemBackgroundColor: Color.fromHex("#1d1d1d"),
+		svgColor: Color.WHITE,
+		menu: config.get("options.hideMenu") ? null : undefined
+	});
+	bar.updateTitle(" ");
+	document.title = "Youtube Music";
+
+	const toggleMenu = () => {
+		if (visible()) {
+			bar.updateMenu(null);
+		} else {
+			bar.refreshMenu();
+		}
+	};
+
+	$('.cet-window-icon').addEventListener('click', toggleMenu);
+	ipcRenderer.on("toggleMenu", toggleMenu);
+
+	ipcRenderer.on("refreshMenu", () => {
+		if (visible()) {
+			bar.refreshMenu();
+		}
+	});
+
+	if (isEnabled("picture-in-picture")) {
+		ipcRenderer.on("pip-toggle", (_, pipEnabled) => {
+			bar.refreshMenu();
+		});
+	}
+
+	// Increases the right margin of Navbar background when the scrollbar is visible to avoid blocking it (z-index doesn't affect it)
+	document.addEventListener('apiLoaded', () => {
+		setNavbarMargin();
+		const playPageObserver = new MutationObserver(setNavbarMargin);
+		playPageObserver.observe($('ytmusic-app-layout'), { attributeFilter: ['player-page-open_', 'playerPageOpen_'] })
+		setupSearchOpenObserver();
+		setupMenuOpenObserver();
+	}, { once: true, passive: true })
+};
+
+function setupSearchOpenObserver() {
+	const searchOpenObserver = new MutationObserver(mutations => {
+		$('#nav-bar-background').style.webkitAppRegion =
+			mutations[0].target.opened ? 'no-drag' : 'drag';
+	});
+	searchOpenObserver.observe($('ytmusic-search-box'), { attributeFilter: ["opened"] })
+}
+
+function setupMenuOpenObserver() {
+	const menuOpenObserver = new MutationObserver(mutations => {
+		$('#nav-bar-background').style.webkitAppRegion =
+			Array.from($('.cet-menubar').childNodes).some(c => c.classList.contains('open')) ?
+				'no-drag' : 'drag';
+	});
+	menuOpenObserver.observe($('.cet-menubar'), { subtree: true, attributeFilter: ["class"] })
+}
+
+function setNavbarMargin() {
+	$('#nav-bar-background').style.right =
+		$('ytmusic-app-layout').playerPageOpen_ ?
+			'0px' :
+			'12px';
+}

plugins/in-app-menu/style.css

@@ -0,0 +1,111 @@
+/* increase font size for menu and menuItems */
+.titlebar,
+.menubar-menu-container .action-label {
+	font-size: 14px !important;
+}
+
+/* fixes nav-bar-background opacity bug, reposition it, and allows clicking scrollbar through it */
+#nav-bar-background {
+	opacity: 1 !important;
+	pointer-events: none !important;
+	top: 30px !important;
+	height: 75px !important;
+}
+
+/* fix top gap between nav-bar and browse-page */
+#browse-page {
+	padding-top: 0 !important;
+}
+
+/* fix navbar hiding library items */
+ytmusic-section-list-renderer[page-type="MUSIC_PAGE_TYPE_LIBRARY_CONTENT_LANDING_PAGE"],
+ytmusic-section-list-renderer[page-type="MUSIC_PAGE_TYPE_PRIVATELY_OWNED_CONTENT_LANDING_PAGE"] {
+	top: 50px;
+    position: relative;
+}
+
+/* remove window dragging for nav bar (conflict with titlebar drag) */
+ytmusic-nav-bar,
+.tab-titleiron-icon,
+ytmusic-pivot-bar-item-renderer {
+	-webkit-app-region: unset !important;
+}
+
+/* move up item selection renderers */
+ytmusic-item-section-renderer.stuck #header.ytmusic-item-section-renderer,
+ytmusic-tabs.stuck {
+	top: calc(var(--ytmusic-nav-bar-height) - 15px) !important;
+}
+
+/* fix weird positioning in search screen*/
+ytmusic-header-renderer.ytmusic-search-page {
+	position: unset !important;
+}
+
+/* Move navBar downwards */
+ytmusic-nav-bar[slot="nav-bar"] {
+	top: 17px !important;
+}
+
+/* fix page progress bar position*/
+yt-page-navigation-progress,
+#progress.yt-page-navigation-progress {
+	top: 30px !important;
+}
+
+/* custom scrollbar */
+::-webkit-scrollbar {
+	width: 12px;
+	background-color: #030303;
+	border-radius: 100px;
+	-moz-border-radius: 100px;
+	-webkit-border-radius: 100px;
+}
+/* hover effect for both scrollbar area, and scrollbar 'thumb' */
+::-webkit-scrollbar:hover {
+	background-color: rgba(15, 15, 15, 0.699);
+}
+
+/* the scrollbar 'thumb' ...that marque oval shape in a scrollbar */
+::-webkit-scrollbar-thumb:vertical {
+	border: 2px solid rgba(0, 0, 0, 0);
+
+	background: #3a3a3a;
+	background-clip: padding-box;
+	border-radius: 100px;
+	-moz-border-radius: 100px;
+	-webkit-border-radius: 100px;
+}
+::-webkit-scrollbar-thumb:vertical:active {
+	background: #4d4c4c; /* some darker color when you click it */
+	border-radius: 100px;
+	-moz-border-radius: 100px;
+	-webkit-border-radius: 100px;
+}
+
+.cet-menubar-menu-container .cet-action-item {
+	background-color: inherit
+}
+
+/** hideMenu toggler **/
+.cet-window-icon {
+	-webkit-app-region: no-drag;
+}
+
+.cet-window-icon img {
+	-webkit-user-drag: none;
+    filter: invert(50%);
+}
+
+/** make navbar draggable **/
+#nav-bar-background {
+    -webkit-app-region: drag;
+}
+
+ytmusic-nav-bar input,
+ytmusic-nav-bar span,
+ytmusic-nav-bar [role="button"],
+ytmusic-nav-bar yt-icon,
+tp-yt-iron-dropdown {
+    -webkit-app-region: no-drag;
+}

plugins/last-fm/back.js

@@ -0,0 +1,161 @@
+const fetch = require('node-fetch');
+const md5 = require('md5');
+const { shell } = require('electron');
+const { setOptions } = require('../../config/plugins');
+const registerCallback = require('../../providers/song-info');
+const defaultConfig = require('../../config/defaults');
+
+const createFormData = params => {
+	// creates the body for in the post request
+	const formData = new URLSearchParams();
+	for (const key in params) {
+		formData.append(key, params[key]);
+	}
+	return formData;
+}
+const createQueryString = (params, api_sig) => {
+	// creates a querystring
+	const queryData = [];
+	params.api_sig = api_sig;
+	for (const key in params) {
+		queryData.push(`${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`);
+	}
+	return '?'+queryData.join('&');
+}
+
+const createApiSig = (params, secret) => { 
+	// this function creates the api signature, see: https://www.last.fm/api/authspec
+	const keys = [];
+	for (const key in params) {
+		keys.push(key);
+	}
+	keys.sort();
+	let sig = '';
+	for (const key of keys) {
+		if (String(key) === 'format')
+			continue
+		sig += `${key}${params[key]}`;
+	}
+	sig += secret;
+	sig = md5(sig);
+	return sig;
+}
+
+const createToken = async ({ api_key, api_root, secret }) => {
+	// creates and stores the auth token
+	const data = {
+		method: 'auth.gettoken',
+		api_key: api_key,
+		format: 'json'
+	};
+	const api_sig = createApiSig(data, secret);
+	let response = await fetch(`${api_root}${createQueryString(data, api_sig)}`);
+	response = await response.json();
+	return response?.token;
+}
+
+const authenticate = async config => {
+	// asks the user for authentication
+	config.token = await createToken(config);
+	setOptions('last-fm', config);
+	shell.openExternal(`https://www.last.fm/api/auth/?api_key=${config.api_key}&token=${config.token}`);
+	return config;
+}
+
+const getAndSetSessionKey = async config => {
+	// get and store the session key
+	const data = {
+		api_key: config.api_key,
+		format: 'json',
+		method: 'auth.getsession',
+		token: config.token,
+	};
+	const api_sig = createApiSig(data, config.secret);
+	let res = await fetch(`${config.api_root}${createQueryString(data, api_sig)}`);
+	res = await res.json();
+	if (res.error)
+		await authenticate(config);
+	config.session_key = res?.session?.key;
+	setOptions('last-fm', config);
+	return config;
+}
+
+const postSongDataToAPI = async (songInfo, config, data) => {
+	// this sends a post request to the api, and adds the common data
+	if (!config.session_key)
+		await getAndSetSessionKey(config);
+
+	const postData = {
+		track: songInfo.title,
+		duration: songInfo.songDuration,
+		artist: songInfo.artist,
+		...(songInfo.album ? { album: songInfo.album } : undefined), // will be undefined if current song is a video
+		api_key: config.api_key,
+		sk: config.session_key,
+		format: 'json',
+		...data,
+	};
+
+	postData.api_sig = createApiSig(postData, config.secret);
+	fetch('https://ws.audioscrobbler.com/2.0/', {method: 'POST', body: createFormData(postData)})
+		.catch(res => {
+			if (res.response.data.error == 9) {
+				// session key is invalid, so remove it from the config and reauthenticate
+				config.session_key = undefined;
+				setOptions('last-fm', config);
+				authenticate(config);
+			}
+		});
+}
+
+const addScrobble = (songInfo, config) => {
+	// this adds one scrobbled song to last.fm
+	const data = {
+		method: 'track.scrobble',
+		timestamp: ~~((Date.now() - songInfo.elapsedSeconds) / 1000),
+	};
+	postSongDataToAPI(songInfo, config, data);
+}
+
+const setNowPlaying = (songInfo, config) => {
+	// this sets the now playing status in last.fm
+	const data = {
+		method: 'track.updateNowPlaying',
+	};
+	postSongDataToAPI(songInfo, config, data);
+}
+
+
+// this will store the timeout that will trigger addScrobble
+let scrobbleTimer = undefined;
+
+const lastfm = async (_win, config) => {
+	if (!config.api_root) {
+		// settings are not present, creating them with the default values
+		config = defaultConfig.plugins['last-fm'];
+		config.enabled = true;
+		setOptions('last-fm', config);
+	}
+
+	if (!config.session_key) {
+		// not authenticated
+		config = await getAndSetSessionKey(config);
+	}
+
+	registerCallback( songInfo => {
+		// set remove the old scrobble timer
+		clearTimeout(scrobbleTimer);
+		if (!songInfo.isPaused) {
+			setNowPlaying(songInfo, config);
+			// scrobble when the song is half way through, or has passed the 4 minute mark
+			const scrobbleTime = Math.min(Math.ceil(songInfo.songDuration / 2), 4 * 60);
+			if (scrobbleTime > songInfo.elapsedSeconds) {
+				// scrobble still needs to happen
+				const timeToWait = (scrobbleTime - songInfo.elapsedSeconds) * 1000;
+				scrobbleTimer = setTimeout(addScrobble, timeToWait, songInfo, config);
+			}
+		}
+	});
+}
+
+module.exports = lastfm;

plugins/lyrics-genius/back.js

@@ -0,0 +1,117 @@
+const { join } = require("path");
+
+const { ipcMain } = require("electron");
+const is = require("electron-is");
+const { convert } = require("html-to-text");
+const fetch = require("node-fetch");
+
+const { cleanupName } = require("../../providers/song-info");
+const { injectCSS } = require("../utils");
+let eastAsianChars = /\p{Script=Han}|\p{Script=Katakana}|\p{Script=Hiragana}|\p{Script=Hangul}|\p{Script=Han}/u;
+let revRomanized = false; 
+
+module.exports = async (win, options) => {
+	if(options.romanizedLyrics) {
+		revRomanized = true;
+	}
+	injectCSS(win.webContents, join(__dirname, "style.css"));
+
+	ipcMain.on("search-genius-lyrics", async (event, extractedSongInfo) => {
+		const metadata = JSON.parse(extractedSongInfo);
+		event.returnValue = await fetchFromGenius(metadata);
+	});
+};
+
+const toggleRomanized = () => {
+	revRomanized = !revRomanized;
+};
+
+const fetchFromGenius = async (metadata) => {
+	const songTitle = `${cleanupName(metadata.title)}`;
+	const songArtist = `${cleanupName(metadata.artist)}`;
+	let lyrics;
+
+	/* Uses Regex to test the title and artist first for said characters if romanization is enabled. Otherwise normal
+	Genius Lyrics behavior is observed.
+	*/
+	let hasAsianChars = false;
+	if (revRomanized && (eastAsianChars.test(songTitle) || eastAsianChars.test(songArtist))) {
+		lyrics = await getLyricsList(`${songArtist} ${songTitle} Romanized`);
+		hasAsianChars = true;
+	} else {
+		lyrics = await getLyricsList(`${songArtist} ${songTitle}`);
+	}
+
+	/* If the romanization toggle is on, and we did not detect any characters in the title or artist, we do a check
+	for characters in the lyrics themselves. If this check proves true, we search for Romanized lyrics.
+	*/
+	if(revRomanized && !hasAsianChars && eastAsianChars.test(lyrics)) {
+		lyrics = await getLyricsList(`${songArtist} ${songTitle} Romanized`);
+	}
+	return lyrics;
+};
+
+/**
+ * Fetches a JSON of songs which is then parsed and passed into getLyrics to get the lyrical content of the first song 
+ * @param {*} queryString 
+ * @returns The lyrics of the first song found using the Genius-Lyrics API
+ */
+const getLyricsList = async (queryString) => {
+	let response = await fetch(
+		`https://genius.com/api/search/multi?per_page=5&q=${encodeURIComponent(queryString)}`
+	);
+	if (!response.ok) {
+		return null;
+	}
+
+	/* Fetch the first URL with the api, giving a collection of song results.
+	Pick the first song, parsing the json given by the API.
+	*/
+	const info = await response.json();
+	let url = "";
+	try {
+		url = info.response.sections.filter((section) => section.type === "song")[0]
+			.hits[0].result.url;
+	} catch {
+		return null;
+	}
+	let lyrics = await getLyrics(url);
+	return lyrics;
+}
+
+/**
+ *  
+ * @param {*} url 
+ * @returns The lyrics of the song URL provided, null if none
+ */
+const getLyrics = async (url) => {
+	response = await fetch(url);
+	if (!response.ok) {
+		return null;
+	}
+	if (is.dev()) {
+		console.log("Fetching lyrics from Genius:", url);
+	}
+	const html = await response.text();
+	const lyrics = convert(html, {
+		baseElements: {
+			selectors: ['[class^="Lyrics__Container"]', ".lyrics"],
+		},
+		selectors: [
+			{
+				selector: "a",
+				format: "linkFormatter",
+			},
+		],
+		formatters: {
+			// Remove links by keeping only the content
+			linkFormatter: (elem, walk, builder) => {
+				walk(elem.children, builder);
+			},
+		},
+	});
+	return lyrics;
+};
+
+module.exports.toggleRomanized = toggleRomanized;
+module.exports.fetchFromGenius = fetchFromGenius;

plugins/lyrics-genius/front.js

@@ -0,0 +1,94 @@
+const { ipcRenderer } = require("electron");
+const is = require("electron-is");
+
+module.exports = () => {
+	ipcRenderer.on("update-song-info", (_, extractedSongInfo) => setTimeout(() => {
+		const tabList = document.querySelectorAll("tp-yt-paper-tab");
+		const tabs = {
+			upNext: tabList[0],
+			lyrics: tabList[1],
+			discover: tabList[2],
+		}
+
+		// Check if disabled
+		if (!tabs.lyrics?.hasAttribute("disabled")) {
+			return;
+		}
+
+		let hasLyrics = true;
+
+		const lyrics = ipcRenderer.sendSync(
+			"search-genius-lyrics",
+			extractedSongInfo
+		);
+		if (!lyrics) {
+			// Delete previous lyrics if tab is open and couldn't get new lyrics
+			checkLyricsContainer(() => {
+				hasLyrics = false;
+				setTabsOnclick(undefined);
+			});
+			return;
+		}
+
+		if (is.dev()) {
+			console.log("Fetched lyrics from Genius");
+		}
+
+		enableLyricsTab();
+
+		setTabsOnclick(enableLyricsTab);
+
+		checkLyricsContainer();
+
+		tabs.lyrics.onclick = () => {
+			const tabContainer = document.querySelector("ytmusic-tab-renderer");
+			const observer = new MutationObserver((_, observer) => {
+				checkLyricsContainer(() => observer.disconnect());
+			});
+			observer.observe(tabContainer, {
+				attributes: true,
+				childList: true,
+				subtree: true,
+			});
+		};
+
+		function checkLyricsContainer(callback = () => {}) {
+			const lyricsContainer = document.querySelector(
+				'[page-type="MUSIC_PAGE_TYPE_TRACK_LYRICS"] > ytmusic-message-renderer'
+			);
+			if (lyricsContainer) {
+				callback();
+				setLyrics(lyricsContainer)
+			}
+		}
+
+		function setLyrics(lyricsContainer) {
+			lyricsContainer.innerHTML = `<div id="contents" class="style-scope ytmusic-section-list-renderer description ytmusic-description-shelf-renderer genius-lyrics">
+			 		${
+						hasLyrics
+							? lyrics.replace(/(?:\r\n|\r|\n)/g, "<br/>")
+							: "Could not retrieve lyrics from genius"
+					}
+
+				</div>
+				<yt-formatted-string class="footer style-scope ytmusic-description-shelf-renderer" style="align-self: baseline"></yt-formatted-string>`;
+			if (hasLyrics) {
+				lyricsContainer.querySelector('.footer').textContent = 'Source: Genius';
+				enableLyricsTab();
+			}
+		}
+
+		function setTabsOnclick(callback) {
+			for (const tab of [tabs.upNext, tabs.discover]) {
+				if (tab) {
+					tab.onclick = callback;
+				}
+			}
+		}
+
+		function enableLyricsTab() {
+			tabs.lyrics.removeAttribute("disabled");
+			tabs.lyrics.removeAttribute("aria-disabled");
+		}
+	}, 500));
+};

plugins/lyrics-genius/menu.js

@@ -0,0 +1,17 @@
+const { setOptions } = require("../../config/plugins");
+const { toggleRomanized } = require("./back");
+
+module.exports = (win, options, refreshMenu) => {
+	return [
+		{
+			label: "Romanized Lyrics",
+			type: "checkbox",
+			checked: options.romanizedLyrics,
+			click: (item) => {
+				options.romanizedLyrics = item.checked;
+				setOptions('lyrics-genius', options);
+				toggleRomanized();
+			},
+		},
+	];
+};

plugins/lyrics-genius/style.css

@@ -0,0 +1,12 @@
+/* Disable links in Genius lyrics */
+.genius-lyrics a {
+	color: var(--ytmusic-text-primary);
+	display: inline-block;
+	pointer-events: none;
+	text-decoration: none;
+}
+
+.description {
+	font-size: clamp(1.4rem, 1.1vmax, 3rem) !important;
+	text-align: center !important;
+}

plugins/navigation/actions.js

@@ -1,24 +1,24 @@
-const { triggerAction } = require('../utils');
+const { triggerAction } = require("../utils");
 
 const CHANNEL = "navigation";
 const ACTIONS = {
-    NEXT: "next",
-    BACK: 'back',
-}
+	NEXT: "next",
+	BACK: "back",
+};
 
 function goToNextPage() {
-    triggerAction(CHANNEL, ACTIONS.NEXT);
+	triggerAction(CHANNEL, ACTIONS.NEXT);
 }
 
 function goToPreviousPage() {
-    triggerAction(CHANNEL, ACTIONS.BACK);
+	triggerAction(CHANNEL, ACTIONS.BACK);
 }
 
 module.exports = {
-    CHANNEL: CHANNEL,
-    ACTIONS: ACTIONS,
-    global: {
-        goToNextPage: goToNextPage,
-        goToPreviousPage: goToPreviousPage,
-    }
+	CHANNEL: CHANNEL,
+	ACTIONS: ACTIONS,
+	actions: {
+		goToNextPage: goToNextPage,
+		goToPreviousPage: goToPreviousPage,
+	},
 };

plugins/navigation/back.js

@@ -1,23 +1,26 @@
 const path = require("path");
 
 const { injectCSS, listenAction } = require("../utils");
-const { ACTIONS, CHANNEL }        = require("./actions.js");
+const { ACTIONS, CHANNEL } = require("./actions.js");
 
 function handle(win) {
-	injectCSS(win.webContents, path.join(__dirname, "style.css"));
+	injectCSS(win.webContents, path.join(__dirname, "style.css"), () => {
+		win.webContents.send("navigation-css-ready");
+	});
+
 	listenAction(CHANNEL, (event, action) => {
 		switch (action) {
-			case ACTIONS.NEXT: 
+			case ACTIONS.NEXT:
 				if (win.webContents.canGoForward()) {
 					win.webContents.goForward();
 				}
 				break;
-			case ACTIONS.BACK: 
+			case ACTIONS.BACK:
 				if (win.webContents.canGoBack()) {
 					win.webContents.goBack();
 				}
 				break;
-			default: 
+			default:
 				console.log("Unknown action: " + action);
 		}
 	});

plugins/navigation/front.js

@@ -1,15 +1,19 @@
+const { ipcRenderer } = require("electron");
+
 const { ElementFromFile, templatePath } = require("../utils");
 
 function run() {
-	const forwardButton = ElementFromFile(
-		templatePath(__dirname, "forward.html")
-	);
-	const backButton = ElementFromFile(templatePath(__dirname, "back.html"));
-	const menu       = document.querySelector("ytmusic-pivot-bar-renderer");
+	ipcRenderer.on("navigation-css-ready", () => {
+		const forwardButton = ElementFromFile(
+			templatePath(__dirname, "forward.html")
+		);
+		const backButton = ElementFromFile(templatePath(__dirname, "back.html"));
+		const menu = document.querySelector("ytmusic-pivot-bar-renderer");
 
-	if (menu) {
-		menu.prepend(backButton, forwardButton);
-	}
+		if (menu) {
+			menu.prepend(backButton, forwardButton);
+		}
+	});
 }
 
 module.exports = run;

plugins/navigation/style.css

@@ -3,7 +3,6 @@
 	font-size: 20px;
 	line-height: var(--ytmusic-title-1_-_line-height);
 	font-weight: 500;
-	color: #fff;
 	--yt-endpoint-color: #fff;
 	--yt-endpoint-hover-color: #fff;
 	--yt-endpoint-visited-color: #fff;

plugins/navigation/templates/back.html

@@ -20,7 +20,7 @@
 				preserveAspectRatio="xMidYMid meet"
 				focusable="false"
 				class="style-scope iron-icon"
-				style="pointer-events: none; display: block; width: 100%; height: 100%;"
+				style="pointer-events: none; display: block; width: 100%; height: 100%"
 			>
 				<g class="style-scope iron-icon">
 					<path