Formatted store and settings, added label elements to all inputs in settings, renamed keybinds to keybindings, optimised some code

This commit is contained in:
Core 2022-04-29 17:02:59 +01:00
parent 796a717dca
commit c9a5fc546f
No known key found for this signature in database
GPG key ID: FE9BF1B547F8F3C6
4 changed files with 1160 additions and 985 deletions

View file

@ -49,7 +49,7 @@ export class Store {
"tab": "home",
"dynamicData": ""
},
"keybind": {
"keybindings": {
"search": [
process.platform == "darwin" ? "Command" : "Control",
"S"

View file

@ -6,6 +6,7 @@ import {app, dialog, ipcMain, Notification, shell } from "electron";
import fetch from "electron-fetch";
import {AppImageUpdater, NsisUpdater} from "electron-updater";
import * as log from "electron-log";
import ElectronStore from "electron-store";
export class utils {
@ -79,6 +80,14 @@ export class utils {
return Store.cfg.store
}
/**
* Get the store instance
* @returns {Store}
*/
static getStoreInstance(): ElectronStore {
return Store.cfg
}
/**
* Sets a store value
* @param key

View file

@ -2,12 +2,6 @@ import {app, Menu, shell} from "electron";
import {utils} from "../base/utils";
export default class Thumbar {
/**
* Private variables for interaction in plugins
*/
private _win: any;
private _app: any;
private _store: any;
/**
* Base Plugin Details (Eventually implemented into a GUI in settings)
@ -15,52 +9,27 @@ export default class Thumbar {
public name: string = 'Menubar Plugin';
public description: string = 'Creates the menubar';
public version: string = '1.0.0';
public author: string = 'Core / Quacksire';
/**
* Thumbnail Toolbar Assets
* NATIVE-IMAGE DOESN'T SUPPORT SVG
private icons: { [key: string]: Electron.NativeImage } = {
remoteIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'views/svg/smartphone.svg')).toPNG(),
soundIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'views/svg/headphones.svg')).toPNG(),
aboutIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'views/svg/info.svg')).toPNG(),
settingsIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'views/svg/settings.svg')).toPNG(),
logoutIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'views/svg/log-out.svg')).toPNG(),
ciderIcon: nativeImage.createFromPath(join(utils.getPath('rendererPath'), 'assets/logocute.png')).toPNG(),
}
*/
public author: string = 'Core';
public contributors: string[] = ['Core', 'Qwack', 'Monochromish'];
/**
* Menubar Assets
* @private
*/
private isMac: boolean = process.platform === 'darwin';
private _menuTemplate: any;
/*******************************************************************************************
* Public Methods
* ****************************************************************************************/
/**
* Runs on plugin load (Currently run on application start)
*/
constructor(utils: { getApp: () => any; getStore: () => any; getWindow: () => any; }) {
this._app = utils.getApp();
this._store = utils.getStore();
this._menuTemplate = [
private _menuTemplate: any = [
{
label: app.getName(),
submenu: [
{
label: 'About',
click: () => this._win.webContents.executeJavaScript(`app.appRoute('about')`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('about')`)
},
{type: 'separator'},
{
label: 'Settings',
accelerator: this._store.general.keybind.settings.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.appRoute('settings')`)
accelerator: utils.getStoreValue("general.keybindings.settings").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('settings')`)
},
{type: 'separator'},
{role: 'services'},
@ -117,25 +86,25 @@ export default class Thumbar {
{type: 'separator'},
{
label: 'Toggle Private Session',
accelerator: this._store.general.keybind.togglePrivateSession.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.cfg.general.privateEnabled = !app.cfg.general.privateEnabled`)
accelerator: utils.getStoreValue("general.keybindings.togglePrivateSession").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.cfg.general.privateEnabled = !app.cfg.general.privateEnabled`)
},
{type: 'separator'},
{
label: 'Web Remote',
accelerator: this._store.general.keybind.webRemote.join('+'),
accelerator: utils.getStoreValue("general.keybindings.webRemote").join('+'),
sublabel: 'Opens in external window',
click: () => this._win.webContents.executeJavaScript(`app.appRoute('remote-pair')`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('remote-pair')`)
},
{
label: 'Audio Settings',
accelerator: this._store.general.keybind.audioSettings.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.modals.audioSettings = true`)
accelerator: utils.getStoreValue("general.keybindings.audioSettings").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.modals.audioSettings = true`)
},
{
label: 'Plug-in Menu',
accelerator: this._store.general.keybind.pluginMenu.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.modals.pluginMenu = true`)
accelerator: utils.getStoreValue("general.keybindings.pluginMenu").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.modals.pluginMenu = true`)
}
]
},
@ -145,56 +114,56 @@ export default class Thumbar {
{
label: 'Pause / Play',
accelerator: 'Space',
click: () => this._win.webContents.executeJavaScript(`app.SpacePause()`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.SpacePause()`)
},
{
label: 'Next',
accelerator: 'CommandOrControl+Right',
click: () => this._win.webContents.executeJavaScript(`MusicKitInterop.next()`)
click: () => utils.getWindow().webContents.executeJavaScript(`MusicKitInterop.next()`)
},
{
label: 'Previous',
accelerator: 'CommandOrControl+Left',
click: () => this._win.webContents.executeJavaScript(`MusicKitInterop.previous()`)
click: () => utils.getWindow().webContents.executeJavaScript(`MusicKitInterop.previous()`)
},
{type: 'separator'},
{
label: 'Volume Up',
accelerator: 'CommandOrControl+Up',
click: () => this._win.webContents.executeJavaScript(`app.volumeUp()`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.volumeUp()`)
},
{
label: 'Volume Down',
accelerator: 'CommandOrControl+Down',
click: () => this._win.webContents.executeJavaScript(`app.volumeDown()`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.volumeDown()`)
},
{
label: 'Browse',
accelerator: this._store.general.keybind.browse.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.appRoute('browse')`)
accelerator: utils.getStoreValue("general.keybindings.browse").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('browse')`)
},
{type: 'separator'},
{
label: 'Artists',
accelerator: this._store.general.keybind.artists.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.appRoute('library-artists')`)
accelerator: utils.getStoreValue("general.keybindings.artists").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('library-artists')`)
},
{
label: 'Search',
accelerator: this._store.general.keybind.search.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.appRoute('search')`)
accelerator: utils.getStoreValue("general.keybindings.search").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('search')`)
},
{type: 'separator'},
{
label: 'Album',
accelerator: this._store.general.keybind.albums.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.appRoute('library-albums')`)
accelerator: utils.getStoreValue("general.keybindings.albums").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('library-albums')`)
},
{type: 'separator'},
{
label: 'Cast To Devices',
accelerator: this._store.general.keybind.castToDevices.join('+'),
click: () => this._win.webContents.executeJavaScript(`app.modals.castMenu = true`)
accelerator: utils.getStoreValue("general.keybindings.castToDevices").join('+'),
click: () => utils.getWindow().webContents.executeJavaScript(`app.modals.castMenu = true`)
}
]
},
@ -203,11 +172,11 @@ export default class Thumbar {
submenu: [
{
label: 'Account Settings',
click: () => this._win.webContents.executeJavaScript(`app.appRoute('apple-account-settings')`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.appRoute('apple-account-settings')`)
},
{
label: 'Sign Out',
click: () => this._win.webContents.executeJavaScript(`app.unauthorize()`)
click: () => utils.getWindow().webContents.executeJavaScript(`app.unauthorize()`)
}
]
},
@ -249,25 +218,32 @@ export default class Thumbar {
{type: 'separator'},
{
label: 'Toggle Developer Tools',
accelerator: this._store.general.keybind.openDeveloperTools.join('+'),
click: () => this._win.webContents.openDevTools()
accelerator: utils.getStoreValue("general.keybindings.openDeveloperTools").join('+'),
click: () => utils.getWindow().webContents.openDevTools()
},
{
label: 'Open Configuration File in Editor',
click: () => this._store.openInEditor()
click: () => utils.getStoreInstance().openInEditor()
}
]
}
];
/*******************************************************************************************
* Public Methods
* ****************************************************************************************/
/**
* Runs on plugin load (Currently run on application start)
*/
constructor(_utils: utils) {
console.debug(`[Plugin][${this.name}] Loading Complete.`);
}
/**
* Runs on app ready
*/
onReady(win: Electron.BrowserWindow): void {
this._win = win;
onReady(_win: Electron.BrowserWindow): void {
const menu = Menu.buildFromTemplate(this._menuTemplate);
Menu.setApplicationMenu(menu)
}

View file

@ -23,7 +23,11 @@
{{$root.getLz('term.privateSession')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="$root.cfg.general.privateEnabled" v-on:change="$root.mk.privateEnabled = $root.cfg.general.privateEnabled" switch/>
<label>
<input type="checkbox" v-model="$root.cfg.general.privateEnabled"
v-on:change="$root.mk.privateEnabled = $root.cfg.general.privateEnabled"
switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.platform !== 'linux'">
@ -31,7 +35,9 @@
{{$root.getLz('settings.option.window.openOnStartup')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.onStartup.enabled" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.general.onStartup.enabled">
@ -39,7 +45,9 @@
{{$root.getLz('settings.option.window.openOnStartup.hidden')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.onStartup.hidden" switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -54,11 +62,18 @@
</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" style="width:180px;" v-model="$root.cfg.general.resumeOnStartupBehavior">
<label>
<select class="md-select" style="width:180px;"
v-model="$root.cfg.general.resumeOnStartupBehavior">
<option value="disabled">{{$root.getLz('term.disabled')}}</option>
<option value="local">{{$root.getLz('settings.option.general.resumebehavior.locally')}}</option>
<option value="history">{{$root.getLz('settings.option.general.resumebehavior.history')}}</option>
<option value="local">
{{$root.getLz('settings.option.general.resumebehavior.locally')}}
</option>
<option value="history">
{{$root.getLz('settings.option.general.resumebehavior.history')}}
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -71,7 +86,9 @@
</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" style="width:180px;" v-model="$root.cfg.general.resumeTabs.tab">
<label>
<select class="md-select" style="width:180px;"
v-model="$root.cfg.general.resumeTabs.tab">
<option value="home">{{$root.getLz('home.title')}}</option>
<option value="library-recentlyadded">{{$root.getLz('term.recentlyAdded')}}</option>
<option value="library-songs">{{$root.getLz('term.songs')}}</option>
@ -79,8 +96,11 @@
<option value="library-artists">{{$root.getLz('term.artists')}}</option>
<option value="library-videos">{{$root.getLz('term.videos')}}</option>
<option value="podcasts">{{$root.getLz('term.podcasts')}}</option>
<option value="dynamic">{{$root.getLz('settings.option.general.resumetabs.dynamic')}}</option>
<option value="dynamic">
{{$root.getLz('settings.option.general.resumetabs.dynamic')}}
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -92,14 +112,18 @@
{{$root.getLz('settings.option.general.customizeSidebar.customize')}}
</button>
</div>
<b-modal id="modal-1" centered size="lg" :title="$root.getLz('settings.option.general.customizeSidebar')">
<b-modal id="modal-1" centered size="lg"
:title="$root.getLz('settings.option.general.customizeSidebar')">
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
{{ $root.getLz('term.recentlyAdded') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.general.sidebarItems.recentlyAdded" switch/>
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.recentlyAdded"
switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -107,7 +131,9 @@
{{ $root.getLz('term.songs') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.songs" switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -115,7 +141,10 @@
{{ $root.getLz('term.albums') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.general.sidebarItems.albums" switch/>
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.albums"
switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -123,7 +152,10 @@
{{ $root.getLz('term.artists') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.general.sidebarItems.artists" switch/>
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.artists"
switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -131,7 +163,10 @@
{{ $root.getLz('term.videos') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.general.sidebarItems.videos" switch/>
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.videos"
switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -139,7 +174,10 @@
{{ $root.getLz('term.podcasts') }}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.general.sidebarItems.podcasts" switch/>
<label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.podcasts"
switch/>
</label>
</div>
</div>
</div>
@ -154,15 +192,17 @@
{{$root.getLz('settings.option.general.keybindings.open')}}
</button>
</div>
<b-modal id="modal-2" centered size="lg" :title="$root.getLz('settings.option.general.keybindings')" ok-only>
<b-modal id="modal-2" centered size="lg"
:title="$root.getLz('settings.option.general.keybindings')" ok-only>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
{{$root.getLz('settings.description.search')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('search')">
{{app.cfg.general.keybind.search.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('search')">
{{app.cfg.general.keybindings.search.join(' + ')}}
</button>
</div>
</div>
@ -171,8 +211,9 @@
{{$root.getLz('settings.description.albums')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('albums')">
{{app.cfg.general.keybind.albums.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('albums')">
{{app.cfg.general.keybindings.albums.join(' + ')}}
</button>
</div>
</div>
@ -181,8 +222,9 @@
{{$root.getLz('settings.description.artists')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('artists')">
{{app.cfg.general.keybind.artists.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('artists')">
{{app.cfg.general.keybindings.artists.join(' + ')}}
</button>
</div>
</div>
@ -191,8 +233,9 @@
{{$root.getLz('settings.description.browse')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('browse')">
{{app.cfg.general.keybind.browse.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('browse')">
{{app.cfg.general.keybindings.browse.join(' + ')}}
</button>
</div>
</div>
@ -201,8 +244,9 @@
{{$root.getLz('settings.description.private')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('togglePrivateSession')">
{{app.cfg.general.keybind.togglePrivateSession.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('togglePrivateSession')">
{{app.cfg.general.keybindings.togglePrivateSession.join(' + ')}}
</button>
</div>
</div>
@ -211,8 +255,9 @@
{{$root.getLz('settings.description.remote')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('webRemote')">
{{app.cfg.general.keybind.webRemote.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('webRemote')">
{{app.cfg.general.keybindings.webRemote.join(' + ')}}
</button>
</div>
</div>
@ -221,8 +266,9 @@
{{$root.getLz('settings.description.audio')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('audioSettings')">
{{app.cfg.general.keybind.audioSettings.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('audioSettings')">
{{app.cfg.general.keybindings.audioSettings.join(' + ')}}
</button>
</div>
</div>
@ -231,8 +277,9 @@
{{$root.getLz('settings.description.plugins')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('pluginMenu')">
{{app.cfg.general.keybind.pluginMenu.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('pluginMenu')">
{{app.cfg.general.keybindings.pluginMenu.join(' + ')}}
</button>
</div>
</div>
@ -241,8 +288,9 @@
{{$root.getLz('settings.description.cast')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('castToDevices')">
{{app.cfg.general.keybind.castToDevices.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('castToDevices')">
{{app.cfg.general.keybindings.castToDevices.join(' + ')}}
</button>
</div>
</div>
@ -251,8 +299,9 @@
{{$root.getLz('settings.description.settings')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('settings')">
{{app.cfg.general.keybind.settings.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('settings')">
{{app.cfg.general.keybindings.settings.join(' + ')}}
</button>
</div>
</div>
@ -261,8 +310,9 @@
{{$root.getLz('settings.description.developer')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn md-btn-small md-btn-block" @click="keyBindUpdate('openDeveloperTools')">
{{app.cfg.general.keybind.openDeveloperTools.join(' + ')}}
<button class="md-btn md-btn-small md-btn-block"
@click="keyBindUpdate('openDeveloperTools')">
{{app.cfg.general.keybindings.openDeveloperTools.join(' + ')}}
</button>
</div>
</div>
@ -287,13 +337,19 @@
{{$root.getLz('settings.option.audio.quality')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" style="width:180px;" v-model="app.cfg.audio.quality"
v-on:change="changeAudioQuality">
<!-- // <option value="">{{$root.getLz('settings.header.audio.quality.hireslossless')}}</option> -->
<!-- <option value="">{{$root.getLz('settings.header.audio.quality.lossless')}}</option> -->
<option value="HIGH">{{$root.getLz('settings.header.audio.quality.high')}} ({{$root.getLz('settings.header.audio.quality.high.description')}})</option>
<option value="STANDARD">{{$root.getLz('settings.header.audio.quality.standard')}} ({{$root.getLz('settings.header.audio.quality.standard.description')}})</option>
<option value="HIGH">{{$root.getLz('settings.header.audio.quality.high')}}
({{$root.getLz('settings.header.audio.quality.high.description')}})
</option>
<option value="STANDARD">{{$root.getLz('settings.header.audio.quality.standard')}}
({{$root.getLz('settings.header.audio.quality.standard.description')}})
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -321,7 +377,11 @@
{{$root.getLz('settings.option.audio.seamlessTransition')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.audio.seamless_audio" v-on:change="app.mk._bag.features['seamless-audio-transitions'] = app.cfg.audio.seamless_audio" switch/>
<label>
<input type="checkbox" v-model="app.cfg.audio.seamless_audio"
v-on:change="app.mk._bag.features['seamless-audio-transitions'] = app.cfg.audio.seamless_audio"
switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -331,8 +391,11 @@
<small>{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.advanced.AudioContext" v-on:change="toggleAudioContext"
<label>
<input type="checkbox" v-model="app.cfg.advanced.AudioContext"
v-on:change="toggleAudioContext"
switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
@ -360,11 +423,19 @@
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
<div class="md-option-segment" style="white-space: pre-line;">
{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization')}}
<small>{{app.cfg.audio.equalizer.vibrantBass != 0 || app.cfg.audio.maikiwiAudio.spatial === true || app.cfg.audio.maikiwiAudio.ciderPPE === true ? `${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}\n${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.disabled')}` : $root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}}</small>
<small>{{app.cfg.audio.equalizer.vibrantBass != 0 || app.cfg.audio.maikiwiAudio.spatial
=== true || app.cfg.audio.maikiwiAudio.ciderPPE === true ?
`${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}\n${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.disabled')}`
:
$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.audio.normalization" v-on:change="toggleNormalization"
:disabled="app.cfg.audio.spatial === true || app.cfg.audio.maikiwiAudio.spatial === true || app.cfg.audio.maikiwiAudio.ciderPPE === true || app.cfg.audio.maikiwiAudio.atmosphereRealizer === true" switch/>
<label>
<input type="checkbox" v-model="app.cfg.audio.normalization"
v-on:change="toggleNormalization"
:disabled="app.cfg.audio.spatial === true || app.cfg.audio.maikiwiAudio.spatial === true || app.cfg.audio.maikiwiAudio.ciderPPE === true || app.cfg.audio.maikiwiAudio.atmosphereRealizer === true"
switch/>
</label>
</div>
</div>
</div>
@ -382,12 +453,19 @@
{{$root.getLz('settings.header.visual.theme')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" @change="$root.setTheme($root.cfg.visual.theme)" v-model="$root.cfg.visual.theme">
<option value="default.less">{{$root.getLz('settings.option.visual.theme.default')}}</option>
<option value="dark.less">{{$root.getLz('settings.option.visual.theme.dark')}}</option>
<label>
<select class="md-select" @change="$root.setTheme($root.cfg.visual.theme)"
v-model="$root.cfg.visual.theme">
<option value="default.less">
{{$root.getLz('settings.option.visual.theme.default')}}
</option>
<option value="dark.less">{{$root.getLz('settings.option.visual.theme.dark')}}
</option>
<option v-for="theme in themes" :value="theme.file">{{ theme.name }}</option>
</select>
<button class="md-btn md-btn-small md-btn-block" @click="gitHubExplore()" style="margin-top: 8px">
</label>
<button class="md-btn md-btn-small md-btn-block" @click="gitHubExplore()"
style="margin-top: 8px">
{{$root.getLz('settings.option.visual.theme.github.explore')}}
</button>
</div>
@ -397,10 +475,12 @@
{{$root.getLz("settings.option.visual.windowStyle")}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="$root.cfg.visual.directives.windowLayout">
<option value="default">Cupertino</option>
<option value="twopanel">Redmond</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -408,9 +488,11 @@
{{$root.getLz('settings.option.visual.windowBackgroundStyle')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" @change="windowBgStyleChange"
v-model="app.cfg.visual.window_background_style">
<option value="none">{{$root.getLz('settings.header.visual.windowBackgroundStyle.none')}}
<option value="none">
{{$root.getLz('settings.header.visual.windowBackgroundStyle.none')}}
</option>
<option value="artwork">
{{$root.getLz('settings.header.visual.windowBackgroundStyle.artwork')}}
@ -422,6 +504,7 @@
Mica (Beta)
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -429,14 +512,19 @@
{{$root.getLz('settings.option.visual.animatedArtwork')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="app.cfg.visual.animated_artwork">
<option value="always">{{$root.getLz('settings.header.visual.animatedArtwork.always')}}
<option value="always">
{{$root.getLz('settings.header.visual.animatedArtwork.always')}}
</option>
<option value="limited">{{$root.getLz('settings.header.visual.animatedArtwork.limited')}}
<option value="limited">
{{$root.getLz('settings.header.visual.animatedArtwork.limited')}}
</option>
<option value="disabled">{{$root.getLz('settings.header.visual.animatedArtwork.disable')}}
<option value="disabled">
{{$root.getLz('settings.header.visual.animatedArtwork.disable')}}
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line"
@ -445,19 +533,25 @@
{{$root.getLz('settings.option.visual.animatedArtworkQuality')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="app.cfg.visual.animated_artwork_qualityLevel">
<option value="0">{{$root.getLz('settings.header.visual.animatedArtworkQuality.low')}}
<option value="0">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.low')}}
</option>
<option value="1">{{$root.getLz('settings.header.visual.animatedArtworkQuality.medium')}}
<option value="1">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.medium')}}
</option>
<option value="2">{{$root.getLz('settings.header.visual.animatedArtworkQuality.high')}}
<option value="2">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.high')}}
</option>
<option value="3">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.veryHigh')}}
</option>
<option value="4">{{$root.getLz('settings.header.visual.animatedArtworkQuality.extreme')}}
<option value="4">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.extreme')}}
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -465,7 +559,9 @@
{{$root.getLz('settings.option.visual.animatedWindowBackground')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" switch v-model="app.cfg.visual.bg_artwork_rotation"/>
</label>
</div>
</div>
<div class="md-option-line">
@ -473,7 +569,10 @@
{{$root.getLz('settings.option.visual.uiscale')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="number" min="0.5" max="4.0" step="0.25" @change="$root.getHTMLStyle()" v-model="app.cfg.visual.uiScale"/>
<label>
<input type="number" min="0.5" max="4.0" step="0.25" @change="$root.getHTMLStyle()"
v-model="app.cfg.visual.uiScale"/>
</label>
</div>
</div>
<div class="md-option-line">
@ -482,6 +581,7 @@
<small>({{$root.getLz('settings.option.visual.hardwareAcceleration.description')}})</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" style="width:180px;" v-model="app.cfg.visual.hw_acceleration">
<option value="default">
{{$root.getLz('settings.header.visual.hardwareAcceleration.default')}}
@ -491,6 +591,7 @@
</option>
<option value="disabled">{{$root.getLz('term.disabled')}}</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -498,8 +599,11 @@
{{$root.getLz('settings.option.visual.showPersonalInfo')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.visual.showuserinfo" v-on:change="toggleUserInfo"
<label>
<input type="checkbox" v-model="app.cfg.visual.showuserinfo"
v-on:change="toggleUserInfo"
switch/>
</label>
</div>
</div>
</div>
@ -513,7 +617,9 @@
{{$root.getLz("settings.option.window.close_button_hide")}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.close_button_hide" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.platform !== 'darwin'">
@ -522,7 +628,9 @@
<small>({{$root.getLz("settings.option.visual.hardwareAcceleration.description")}})</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.visual.nativeTitleBar" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.platform !== 'darwin'">
@ -530,10 +638,16 @@
{{$root.getLz("settings.option.window.windowControlStyle")}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="app.cfg.visual.windowControlPosition">
<option value="0">{{$root.getLz("settings.option.window.windowControlStyle.right")}}</option>
<option value="1">{{$root.getLz("settings.option.window.windowControlStyle.left")}}</option>
<option value="0">
{{$root.getLz("settings.option.window.windowControlStyle.right")}}
</option>
<option value="1">
{{$root.getLz("settings.option.window.windowControlStyle.left")}}
</option>
</select>
</label>
</div>
</div>
</div>
@ -552,7 +666,9 @@
{{$root.getLz('settings.option.lyrics.enableMusixmatch')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" switch checked/>
</label>
<!-- <input type="checkbox" v-model="app.cfg.lyrics.enable_mxm" switch /> -->
</div>
</div>
@ -563,7 +679,9 @@
{{$root.getLz('settings.option.lyrics.enableMusixmatchKaraoke')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lyrics.mxm_karaoke" switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -571,6 +689,7 @@
{{$root.getLz('settings.option.lyrics.musixmatchPreferredLanguage')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="app.cfg.lyrics.mxm_language">
<option value='disabled'>Disabled</option>
<option value='ab'>Abkhazian</option>
@ -839,6 +958,7 @@
<option value='za'>Zhuang</option>
<option value='zu'>Zulu</option>
</select>
</label>
</div>
</div>
<div class="md-option-line">
@ -846,7 +966,9 @@
{{$root.getLz('settings.option.lyrics.enableYoutubeLyrics')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lyrics.enable_yt" switch/>
</label>
</div>
</div>
<div class="md-option-line">
@ -854,7 +976,9 @@
{{$root.getLz('settings.option.lyrics.enableQQLyrics')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lyrics.enable_qq" switch/>
</label>
</div>
</div>
</div>
@ -873,7 +997,9 @@
{{$root.getLz('settings.option.connectivity.playbackNotifications')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.playbackNotifications" switch/>
</label>
</div>
</div>
@ -883,7 +1009,9 @@
{{$root.getLz('settings.option.connectivity.discordRPC')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.discord_rpc.enabled" switch/>
</label>
</div>
</div>
@ -892,11 +1020,13 @@
{{$root.getLz('settings.option.connectivity.discordRPC.clientName')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" v-model="app.cfg.general.discord_rpc.client">
<option value="Cider">{{$root.getLz('app.name')}}</option>
<option value="AppleMusic">{{$root.getLz('term.appleMusic')}}
</option>
</select>
</label>
</div>
</div>
@ -905,7 +1035,9 @@
{{$root.getLz('settings.option.connectivity.discordRPC.clearOnPause')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.discord_rpc.clear_on_pause" switch/>
</label>
</div>
</div>
@ -914,27 +1046,35 @@
{{$root.getLz('settings.option.connectivity.discordRPC.hideButtons')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.general.discord_rpc.hide_buttons" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.general.discord_rpc.enabled != false">
<div class="md-option-segment">
{{$root.getLz('settings.option.connectivity.discordRPC.detailsFormat')}}<br/>
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album}, {trackNumber}</small>
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album},
{trackNumber}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="text" v-model="app.cfg.general.discord_rpc.details_format"/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.general.discord_rpc.enabled != false">
<div class="md-option-segment">
{{$root.getLz('settings.option.connectivity.discordRPC.stateFormat')}}
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album}, {trackNumber}</small>
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album},
{trackNumber}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="text" v-model="app.cfg.general.discord_rpc.state_format"/>
</label>
</div>
</div>
@ -955,7 +1095,9 @@
{{$root.getLz('settings.option.connectivity.lastfmScrobble.delay')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="number" min="50" max="100" v-model="app.cfg.lastfm.scrobble_after"/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.lastfm.enabled">
@ -963,7 +1105,9 @@
{{$root.getLz('settings.option.connectivity.lastfmScrobble.nowPlaying')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lastfm.NowPlaying" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.lastfm.enabled">
@ -971,7 +1115,9 @@
{{$root.getLz('settings.option.connectivity.lastfmScrobble.removeFeatured')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lastfm.enabledRemoveFeaturingArtists" switch/>
</label>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.lastfm.enabled">
@ -979,7 +1125,9 @@
{{$root.getLz('settings.option.connectivity.lastfmScrobble.filterLoop')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.lastfm.filterLoop" switch/>
</label>
</div>
</div>
</div>
@ -1025,7 +1173,9 @@
{{$root.getLz('settings.option.visual.plugin.github.explore')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn" @click="$root.appRoute('plugins-github')">{{ $root.getLz("settings.option.visual.plugin.github.explore") }}</button>
<button class="md-btn" @click="$root.appRoute('plugins-github')">{{
$root.getLz("settings.option.visual.plugin.github.explore") }}
</button>
</div>
</div>
@ -1034,7 +1184,9 @@
{{$root.getLz('settings.option.experimental.reinstallwidevine')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn" @click="reinstallWidevineCDM">{{$root.getLz('settings.option.experimental.reinstallwidevine')}}</button>
<button class="md-btn" @click="reinstallWidevineCDM">
{{$root.getLz('settings.option.experimental.reinstallwidevine')}}
</button>
</div>
</div>
@ -1042,7 +1194,8 @@
<!-- Do not translate -->
<div class="md-option-segment">
Style Editor<br>
<small>Mix and match various theme components to get Cider looking exactly how you want.</small>
<small>Mix and match various theme components to get Cider looking exactly how you
want.</small>
</div>
<div class="md-option-segment">
<stylestack-editor :themes="themes"/>
@ -1056,7 +1209,12 @@
<small>{{$root.getLz('settings.option.experimental.unknownPlugin.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('unknown-sources')" @click="app.cfg.advanced.experiments.includes('unknown-sources') ? removeExperiment('unknown-sources') : addExperiment('unknown-sources')" switch/>
<label>
<input type="checkbox"
v-model="app.cfg.advanced.experiments.includes('unknown-sources')"
@click="app.cfg.advanced.experiments.includes('unknown-sources') ? removeExperiment('unknown-sources') : addExperiment('unknown-sources')"
switch/>
</label>
</div>
</div>
@ -1067,7 +1225,9 @@
<small>{{$root.getLz('settings.option.advanced.playlistTrackMapping.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<input type="checkbox" v-model="app.cfg.advanced.playlistTrackMapping" switch/>
</label>
</div>
</div>
@ -1077,7 +1237,11 @@
{{$root.getLz('settings.option.experimental.compactUI')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('compactui')" @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')" switch/>
<label>
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('compactui')"
@click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')"
switch/>
</label>
</div>
</div>
@ -1086,7 +1250,12 @@
{{$root.getLz('settings.option.experimental.inline_playlists')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" disabled v-model="app.cfg.advanced.experiments.includes('inline-playlists')" @click="app.cfg.advanced.experiments.includes('inline-playlists') ? removeExperiment('inline-playlists') : addExperiment('inline-playlists')" switch/>
<label>
<input type="checkbox" disabled
v-model="app.cfg.advanced.experiments.includes('inline-playlists')"
@click="app.cfg.advanced.experiments.includes('inline-playlists') ? removeExperiment('inline-playlists') : addExperiment('inline-playlists')"
switch/>
</label>
</div>
</div>
@ -1095,6 +1264,7 @@
{{$root.getLz('term.language')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" @change="$root.setLz('');$root.setLzManual()"
v-model="app.cfg.general.language">
<optgroup :label="index" v-for="(categories, index) in getLanguages()">
@ -1103,6 +1273,7 @@
</option>
</optgroup>
</select>
</label>
</div>
</div>
<div class="md-option-line update-check">
@ -1110,7 +1281,8 @@
{{$root.getLz('settings.option.general.updateCider')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn" id='settings.option.general.updateCider.check' @click="app.checkForUpdate()">
<button class="md-btn" id='settings.option.general.updateCider.check'
@click="app.checkForUpdate()">
{{$root.getLz('term.check')}}
</button>
</div>
@ -1121,6 +1293,7 @@
<small>({{$root.getLz('settings.option.general.updateCider.branch.description')}})</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<label>
<select class="md-select" style="width:180px;" v-model="app.cfg.general.update_branch">
<option value="main">
{{$root.getLz('settings.option.general.updateCider.branch.main')}}
@ -1129,6 +1302,7 @@
{{$root.getLz('settings.option.general.updateCider.branch.develop')}}
</option>
</select>
</label>
</div>
</div>
<div class="md-option-line update-check" v-if="app.platform === 'win32'">
@ -1137,7 +1311,10 @@
<small>({{$root.getLz('settings.option.visual.transparent.description')}})</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.visual.transparent" switch @change="promptForRelaunch()"/>
<label>
<input type="checkbox" v-model="app.cfg.visual.transparent" switch
@change="promptForRelaunch()"/>
</label>
</div>
</div>
</div>
@ -1172,7 +1349,8 @@
<br>
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn" id='settings.option.general.updateCider.check' @click="logoutCC()" style="display: flex;align-items: center;gap: 0.4em;">
<button class="md-btn" id='settings.option.general.updateCider.check'
@click="logoutCC()" style="display: flex;align-items: center;gap: 0.4em;">
<%- include("../svg/check.svg") %>
<div v>Connected</div>
</button>
@ -1180,7 +1358,8 @@
</div>
<div class="md-option-header" style="margin-left: -0.55em;">
<span>{{app.cfg.connectUser.username}}</span>
<img :src="'https://cdn.discordapp.com/avatars/' + app.cfg.connectUser.id + '/' + app.cfg.connectUser.avatar + '.png?size=32'"></img>
<img :src="'https://cdn.discordapp.com/avatars/' + app.cfg.connectUser.id + '/' + app.cfg.connectUser.avatar + '.png?size=32'"
alt="Discord Avatar"></img>
</div>
<div class="md-option-line">
@ -1188,7 +1367,11 @@
Sync Settings
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.settings" @click="app.cfg.connectUser.sync.settings = !app.cfg.connectUser.sync.settings" switch/>
<label>
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.settings"
@click="app.cfg.connectUser.sync.settings = !app.cfg.connectUser.sync.settings"
switch/>
</label>
</div>
</div>
@ -1197,7 +1380,11 @@
Sync Themes
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.themes" @click="app.cfg.connectUser.sync.themes = !app.cfg.connectUser.sync.themes" switch/>
<label>
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.themes"
@click="app.cfg.connectUser.sync.themes = !app.cfg.connectUser.sync.themes"
switch/>
</label>
</div>
</div>
@ -1206,7 +1393,11 @@
Sync Plugins
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.plugins" @click="app.cfg.connectUser.sync.plugins = !app.cfg.connectUser.sync.plugins" switch/>
<label>
<input type="checkbox" disabled a-v-model="app.cfg.connectUser.sync.plugins"
@click="app.cfg.connectUser.sync.plugins = !app.cfg.connectUser.sync.plugins"
switch/>
</label>
</div>
</div>
@ -1346,7 +1537,7 @@
methods: {
windowBgStyleChange() {
this.$root.getNowPlayingArtworkBG(undefined, true)
if (this.$root.cfg.visual.window_background_style == "mica") {
if (this.$root.cfg.visual.window_background_style === "mica") {
this.$root.spawnMica()
}
},
@ -1358,7 +1549,7 @@
})
},
keyBindUpdate: function (action) {
var blur = document.createElement('div');
const blur = document.createElement('div');
blur.className = 'blur';
blur.style.backgroundColor = 'rgba(0,0,0,0.25)';
blur.style.position = 'fixed';
@ -1372,15 +1563,15 @@
blur.style.justifyContent = 'center';
blur.style.fontSize = '2em';
blur.style.color = 'white';
blur.innerHTML = 'Press a combination of two keys to update keybind. Press Escape key to go back.'
blur.innerHTML = 'Press a combination of two keys to update keybinding. Press Escape key to go back.'
document.body.appendChild(blur);
var keyBind = [];
var keyBindTimeout = setTimeout(function () {
let keyBind = [];
const keyBindTimeout = setTimeout(function () {
keyBind = [];
document.body.removeChild(blur);
}, 30000);
var keyBindUpdate = function (e) {
const keyBindUpdate = function (e) {
if (document.body.contains(blur)) {
if (e.key == 'Escape') {
document.body.removeChild(blur);
@ -1392,9 +1583,9 @@
} else {
keyBind.push(e.key);
}
if (keyBind.length == 2) {
if (keyBind[0] != keyBind[1]) {
app.cfg.general.keybind[action] = keyBind
if (keyBind.length === 2) {
if (keyBind[0] !== keyBind[1]) {
app.cfg.general.keybindings[action] = keyBind
document.body.removeChild(blur);
clearTimeout(keyBindTimeout);
notyf.success(app.getLz('settings.notyf.general.keybindings.update.success'));
@ -1406,22 +1597,22 @@
}
}
}
} else return;
}
};
document.addEventListener('keydown', keyBindUpdate);
},
keyBindReset: function () {
app.cfg.general.keybind.search = [app.platform == "darwin" ? "Command" : "Control","S"];
app.cfg.general.keybind.albums = [app.platform == "darwin" ? "Command" : "Control","F"];
app.cfg.general.keybind.artists = [app.platform == "darwin" ? "Command" : "Control","D"];
app.cfg.general.keybind.browse = [app.platform == "darwin" ? "Command" : "Control","B"];
app.cfg.general.keybind.togglePrivateSession = [app.platform == "darwin" ? "Command" : "Control","P"];
app.cfg.general.keybind.webRemote = [app.platform == "darwin" ? "Command" : "Control","W"];
app.cfg.general.keybind.audioSettings = [app.platform == "darwin" ? "Option" : "Shift","A"];
app.cfg.general.keybind.pluginMenu = [app.platform == "darwin" ? "Option" : "Shift","P"];
app.cfg.general.keybind.castToDevices = [app.platform == "darwin" ? "Option" : "Shift","C"];
app.cfg.general.keybind.settings = [app.platform == "darwin" ? "Option" : "Shift","S"];
app.cfg.general.keybind.openDeveloperTools = [app.platform == "darwin" ? "Command" : "Control",app.platform == "darwin" ? "Option" : "Shift","I"];
app.cfg.general.keybindings.search = [app.platform == "darwin" ? "Command" : "Control", "S"];
app.cfg.general.keybindings.albums = [app.platform == "darwin" ? "Command" : "Control", "F"];
app.cfg.general.keybindings.artists = [app.platform == "darwin" ? "Command" : "Control", "D"];
app.cfg.general.keybindings.browse = [app.platform == "darwin" ? "Command" : "Control", "B"];
app.cfg.general.keybindings.togglePrivateSession = [app.platform == "darwin" ? "Command" : "Control", "P"];
app.cfg.general.keybindings.webRemote = [app.platform == "darwin" ? "Command" : "Control", "W"];
app.cfg.general.keybindings.audioSettings = [app.platform == "darwin" ? "Option" : "Shift", "A"];
app.cfg.general.keybindings.pluginMenu = [app.platform == "darwin" ? "Option" : "Shift", "P"];
app.cfg.general.keybindings.castToDevices = [app.platform == "darwin" ? "Option" : "Shift", "C"];
app.cfg.general.keybindings.settings = [app.platform == "darwin" ? "Option" : "Shift", "S"];
app.cfg.general.keybindings.openDeveloperTools = [app.platform == "darwin" ? "Command" : "Control", app.platform == "darwin" ? "Option" : "Shift", "I"];
notyf.success(app.getLz('settings.notyf.general.keybindings.update.success'));
bootbox.confirm(app.getLz("settings.prompt.general.keybindings.update.success"), (ok) => {
if (ok) ipcRenderer.invoke("relaunchApp")
@ -1476,8 +1667,7 @@
}
}
})
}
else {
} else {
CiderAudio.init();
if (app.cfg.audio.normalization === true) {
CiderAudio.normalizerOn()