Merge pull request #938 from Monochromish/develop
Added update keybind feature.
This commit is contained in:
Amaru8
GitHub
commit
c505b2d9bd
6 changed files with 390 additions and 248 deletions
|
|
@ -280,6 +280,8 @@
|
|||
"settings.option.general.customizeSidebar": "Customize Sidebar Items",
|
||||
"settings.option.general.customizeSidebar.customize": "Customize",
|
||||
"settings.option.general.keybindings": "Keybindings",
|
||||
"settings.notyf.general.keybindings.update.success": "Keybind updated successfully",
|
||||
"settings.prompt.general.keybindings.update.success": "Keybind updated successfully. Press OK to relaunch Cider",
|
||||
"settings.option.general.keybindings.open": "Open",
|
||||
"settings.description.search": "Search",
|
||||
"settings.description.albums": "Library Albums",
|
||||
|
|
|
|||
|
|
@ -280,6 +280,8 @@
|
|||
"settings.option.general.customizeSidebar": "Customize Sidebar Items",
|
||||
"settings.option.general.customizeSidebar.customize": "Customize",
|
||||
"settings.option.general.keybindings": "Keybindings",
|
||||
"settings.notyf.general.keybindings.update.success": "Keybind updated successfully",
|
||||
"settings.prompt.general.keybindings.update.success": "Keybind updated successfully. Press OK to relaunch Cider",
|
||||
"settings.option.general.keybindings.open": "Open",
|
||||
"settings.description.search": "Search",
|
||||
"settings.description.albums": "Library Albums",
|
||||
|
|
|
|||
|
|
@ -44,6 +44,53 @@ export class Store {
|
|||
"onStartup": {
|
||||
"enabled": false,
|
||||
"hidden": false,
|
||||
},
|
||||
"keybind": {
|
||||
"search": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"S"
|
||||
],
|
||||
"albums": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"F"
|
||||
],
|
||||
"artists": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"D"
|
||||
],
|
||||
"browse": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"B"
|
||||
],
|
||||
"togglePrivateSession": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"P"
|
||||
],
|
||||
"webRemote": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
"W"
|
||||
],
|
||||
"audioSettings": [
|
||||
process.platform == "darwin" ? "Option" : "Shift",
|
||||
"A"
|
||||
],
|
||||
"pluginMenu": [
|
||||
process.platform == "darwin" ? "Option" : "Shift",
|
||||
"P"
|
||||
],
|
||||
"castToDevices": [
|
||||
process.platform == "darwin" ? "Option" : "Shift",
|
||||
"C"
|
||||
],
|
||||
"settings": [
|
||||
process.platform == "darwin" ? "Option" : "Shift",
|
||||
"S"
|
||||
],
|
||||
"openDeveloperTools": [
|
||||
process.platform == "darwin" ? "Command" : "Control",
|
||||
process.platform == "darwin" ? "Option" : "Shift",
|
||||
"I"
|
||||
]
|
||||
}
|
||||
},
|
||||
"home": {
|
||||
|
|
|
|||
|
|
@ -35,7 +35,20 @@ export default class Thumbar {
|
|||
* @private
|
||||
*/
|
||||
private isMac: boolean = process.platform === 'darwin';
|
||||
private _menuTemplate: any = [
|
||||
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 = [
|
||||
{
|
||||
label: app.getName(),
|
||||
submenu: [
|
||||
|
|
@ -46,7 +59,7 @@ export default class Thumbar {
|
|||
{type: 'separator'},
|
||||
{
|
||||
label: 'Settings',
|
||||
accelerator: 'CommandOrControl+,',
|
||||
accelerator: this._store.general.keybind.settings.join('+'),
|
||||
click: () => this._win.webContents.executeJavaScript(`app.appRoute('settings')`)
|
||||
},
|
||||
{type: 'separator'},
|
||||
|
|
@ -104,27 +117,26 @@ export default class Thumbar {
|
|||
{type: 'separator'},
|
||||
{
|
||||
label: 'Toggle Private Session',
|
||||
accelerator: 'CommandOrControl+P',
|
||||
accelerator: this._store.general.keybind.togglePrivateSession.join('+'),
|
||||
click: () => this._win.webContents.executeJavaScript(`app.cfg.general.privateEnabled = !app.cfg.general.privateEnabled`)
|
||||
},
|
||||
{type: 'separator'},
|
||||
{
|
||||
label: 'Web Remote',
|
||||
accelerator: 'CommandOrControl+Shift+W',
|
||||
accelerator: this._store.general.keybind.webRemote.join('+'),
|
||||
sublabel: 'Opens in external window',
|
||||
click: () => this._win.webContents.executeJavaScript(`app.appRoute('remote-pair')`)
|
||||
},
|
||||
{
|
||||
label: 'Audio Settings',
|
||||
accelerator: 'CommandOrControl+Shift+A',
|
||||
accelerator: this._store.general.keybind.audioSettings.join('+'),
|
||||
click: () => this._win.webContents.executeJavaScript(`app.modals.audioSettings = true`)
|
||||
},
|
||||
{
|
||||
label: 'Plug-in Menu',
|
||||
accelerator: 'CommandOrControl+Shift+P',
|
||||
accelerator: this._store.general.keybind.pluginMenu.join('+'),
|
||||
click: () => this._win.webContents.executeJavaScript(`app.modals.pluginMenu = true`)
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
|
|
@ -156,10 +168,32 @@ export default class Thumbar {
|
|||
accelerator: 'CommandOrControl+Down',
|
||||
click: () => this._win.webContents.executeJavaScript(`app.volumeDown()`)
|
||||
},
|
||||
{
|
||||
label: 'Browse',
|
||||
accelerator: this._store.general.keybind.browse.join('+'),
|
||||
click: () => this._win.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')`)
|
||||
},
|
||||
{
|
||||
label: 'Search',
|
||||
accelerator: this._store.general.keybind.search.join('+'),
|
||||
click: () => this._win.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')`)
|
||||
},
|
||||
{type: 'separator'},
|
||||
{
|
||||
label: 'Cast To Devices',
|
||||
accelerator: 'CommandOrControl+Shift+C',
|
||||
accelerator: this._store.general.keybind.castToDevices.join('+'),
|
||||
click: () => this._win.webContents.executeJavaScript(`app.modals.castMenu = true`)
|
||||
}
|
||||
]
|
||||
|
|
@ -215,7 +249,7 @@ export default class Thumbar {
|
|||
{type: 'separator'},
|
||||
{
|
||||
label: 'Toggle Developer Tools',
|
||||
accelerator: 'Option+CommandOrControl+Shift+I',
|
||||
accelerator: this._store.general.keybind.openDeveloperTools.join('+'),
|
||||
click: () => this._win.webContents.openDevTools()
|
||||
},
|
||||
{
|
||||
|
|
@ -224,18 +258,8 @@ export default class Thumbar {
|
|||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
/*******************************************************************************************
|
||||
* Public Methods
|
||||
* ****************************************************************************************/
|
||||
|
||||
/**
|
||||
* Runs on plugin load (Currently run on application start)
|
||||
*/
|
||||
constructor(utils: { getApp: () => any; getStore: () => any; }) {
|
||||
this._app = utils.getApp();
|
||||
this._store = utils.getStore();
|
||||
console.debug(`[Plugin][${this.name}] Loading Complete.`);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -18,12 +18,6 @@ const Events = {
|
|||
});
|
||||
|
||||
document.addEventListener('keydown', async function (event) {
|
||||
// CTRL + F
|
||||
if (event.keyCode === 70 && event.ctrlKey) {
|
||||
app.appRoute('search')
|
||||
app.$refs.searchInput.focus()
|
||||
app.$refs.searchInput.select()
|
||||
}
|
||||
// CTRL + R
|
||||
if (event.keyCode === 82 && event.ctrlKey) {
|
||||
event.preventDefault()
|
||||
|
|
@ -38,22 +32,6 @@ const Events = {
|
|||
event.preventDefault()
|
||||
window.location.reload()
|
||||
}
|
||||
// CTRL + S
|
||||
if (event.keyCode === 83 && event.ctrlKey) {
|
||||
app.appRoute("settings")
|
||||
}
|
||||
// CTRL + A
|
||||
if (event.keyCode === 65 && event.ctrlKey) {
|
||||
app.appRoute("library-albums")
|
||||
}
|
||||
// CTRL + B
|
||||
if (event.keyCode === 66 && event.ctrlKey) {
|
||||
app.appRoute("browse")
|
||||
}
|
||||
// CTRL + D
|
||||
if (event.keyCode === 68 && event.ctrlKey) {
|
||||
app.appRoute("library-artists")
|
||||
}
|
||||
// CTRL + E
|
||||
if (event.keyCode === 69 && event.ctrlKey) {
|
||||
app.invokeDrawer('queue')
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@
|
|||
{{$root.getLz('settings.option.general.customizeSidebar.customize')}}
|
||||
</button>
|
||||
</div>
|
||||
<b-modal id="modal-1" centered size="lg" v-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">
|
||||
|
|
@ -132,96 +132,121 @@
|
|||
{{$root.getLz('settings.option.general.keybindings.open')}}
|
||||
</button>
|
||||
</div>
|
||||
<b-modal id="modal-2" centered size="lg" v-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 keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + F</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.albums')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + A</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.artists')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + D</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.browse')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + B</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.private')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + P</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.remote')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + Shift + W</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.audio')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + Shift + A</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.plugins')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + Shift + P</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.cast')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + Shift + C</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.settings')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + S</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.description.developer')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto keybindings-border">
|
||||
<p class="keybinding-text">{{ getCommandOrControl() }} + {{ getOptionOrShift() }} + I</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<button class="md-btn md-btn-large md-btn-block" @click="keyBindReset()">
|
||||
{{$root.getLz('term.reset')}}
|
||||
</button>
|
||||
</div>
|
||||
</b-modal>
|
||||
</div>
|
||||
|
|
@ -1302,12 +1327,6 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
getCommandOrControl() {
|
||||
return app.platform == "darwin" ? "⌘" : "Ctrl";
|
||||
},
|
||||
getOptionOrShift() {
|
||||
return app.platform == "darwin" ? "⌥" : "Shift";
|
||||
},
|
||||
windowBgStyleChange() {
|
||||
this.$root.getNowPlayingArtworkBG(undefined, true)
|
||||
if (this.$root.cfg.visual.window_background_style == "mica") {
|
||||
|
|
@ -1321,6 +1340,76 @@
|
|||
}
|
||||
})
|
||||
},
|
||||
keyBindUpdate: function (action) {
|
||||
var blur = document.createElement('div');
|
||||
blur.className = 'blur';
|
||||
blur.style.backgroundColor = 'rgba(0,0,0,0.25)';
|
||||
blur.style.position = 'fixed';
|
||||
blur.style.top = '0';
|
||||
blur.style.left = '0';
|
||||
blur.style.width = '100%';
|
||||
blur.style.height = '100%';
|
||||
blur.style.zIndex = '9999';
|
||||
blur.style.display = 'flex';
|
||||
blur.style.alignItems = 'center';
|
||||
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.'
|
||||
document.body.appendChild(blur);
|
||||
|
||||
var keyBind = [];
|
||||
var keyBindTimeout = setTimeout(function () {
|
||||
keyBind = [];
|
||||
document.body.removeChild(blur);
|
||||
}, 30000);
|
||||
var keyBindUpdate = function (e) {
|
||||
if (document.body.contains(blur)) {
|
||||
if (e.key == 'Escape') {
|
||||
document.body.removeChild(blur);
|
||||
clearTimeout(keyBindTimeout);
|
||||
return;
|
||||
} else {
|
||||
if (e.keyCode >= 65 && e.keyCode <= 90 && e.keyCode <= 97 && e.keyCode <= 122) {
|
||||
keyBind.push(e.key.toUpperCase());
|
||||
} else {
|
||||
keyBind.push(e.key);
|
||||
}
|
||||
if (keyBind.length == 2) {
|
||||
if (keyBind[0] != keyBind[1]) {
|
||||
app.cfg.general.keybind[action] = keyBind
|
||||
document.body.removeChild(blur);
|
||||
clearTimeout(keyBindTimeout);
|
||||
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")
|
||||
})
|
||||
} else {
|
||||
keyBind = [];
|
||||
}
|
||||
}
|
||||
}
|
||||
} 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"];
|
||||
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")
|
||||
})
|
||||
},
|
||||
gitHubExplore() {
|
||||
app.appRoute("themes-github")
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue