From d42976f8db73b3128a5fff25129b1735c4f3c36d Mon Sep 17 00:00:00 2001 From: Calum Clark CSM2019 Date: Mon, 24 Jan 2022 22:31:57 +0000 Subject: [PATCH 1/5] miniplayer settings toggle to appear on top of windows. working on linux, probs working elsewhere reading documentation. --- src/main/base/store.ts | 3 ++- src/main/base/win.ts | 4 ++++ src/renderer/index.js | 4 ++++ src/renderer/views/pages/settings.ejs | 8 ++++++++ 4 files changed, 18 insertions(+), 1 deletion(-) diff --git a/src/main/base/store.ts b/src/main/base/store.ts index 66c0a6a4..4dab66ca 100644 --- a/src/main/base/store.ts +++ b/src/main/base/store.ts @@ -60,7 +60,8 @@ export class ConfigStore { "animated_artwork_qualityLevel": 1, "bg_artwork_rotation": false, "hw_acceleration": "default", // default, webgpu, disabled - "showuserinfo": true + "showuserinfo": true, + "miniplayer_ontop": true }, "lyrics": { "enable_mxm": false, diff --git a/src/main/base/win.ts b/src/main/base/win.ts index 3ec4f0fc..0773d8ed 100644 --- a/src/main/base/win.ts +++ b/src/main/base/win.ts @@ -430,6 +430,10 @@ export class Win { this.win.setMinimumSize(width,height); }) + electron.ipcMain.on("windowontop", (event, ontop) => { + this.win.setAlwaysOnTop(ontop); + }); + // Set scale electron.ipcMain.on("windowresize", (event, width, height, lock = false) => { this.win.setContentSize(width, height); diff --git a/src/renderer/index.js b/src/renderer/index.js index 95e7b1a5..8578817a 100644 --- a/src/renderer/index.js +++ b/src/renderer/index.js @@ -3328,10 +3328,14 @@ const app = new Vue({ ipcRenderer.send('unmaximize'); ipcRenderer.send('windowmin', 250, 250) ipcRenderer.send('windowresize', 300, 300, false) + if (this.cfg.visual.miniplayer_ontop) { + ipcRenderer.send('windowontop', true) + } app.appMode = 'mini'; } else { ipcRenderer.send('windowmin', 844, 410) ipcRenderer.send('windowresize', this.tmpWidth, this.tmpHeight, false) + ipcRenderer.send('windowontop', false) app.appMode = 'player'; } }, diff --git a/src/renderer/views/pages/settings.ejs b/src/renderer/views/pages/settings.ejs index d330161d..8cb5d7c3 100644 --- a/src/renderer/views/pages/settings.ejs +++ b/src/renderer/views/pages/settings.ejs @@ -524,6 +524,14 @@ +
+
+ Miniplayer always on top +
+
+ +
+
From 26451e0af2547caa6b18d4ce147087cae3ab29fc Mon Sep 17 00:00:00 2001 From: Calum Clark CSM2019 Date: Tue, 25 Jan 2022 01:30:58 +0000 Subject: [PATCH 2/5] Clickable pin in miniplayer to toggle ontop behaviour. currently an emoji span. gracefully resets windowontop on exit. --- src/main/base/store.ts | 2 +- src/renderer/index.js | 13 ++++++++++--- src/renderer/style.less | 18 ++++++++++++++++++ src/renderer/views/components/miniplayer.ejs | 5 ++++- src/renderer/views/pages/settings.ejs | 8 -------- 5 files changed, 33 insertions(+), 13 deletions(-) diff --git a/src/main/base/store.ts b/src/main/base/store.ts index 4dab66ca..bc495822 100644 --- a/src/main/base/store.ts +++ b/src/main/base/store.ts @@ -61,7 +61,7 @@ export class ConfigStore { "bg_artwork_rotation": false, "hw_acceleration": "default", // default, webgpu, disabled "showuserinfo": true, - "miniplayer_ontop": true + "miniplayer_top_toggle": true }, "lyrics": { "enable_mxm": false, diff --git a/src/renderer/index.js b/src/renderer/index.js index 8578817a..13ca45e4 100644 --- a/src/renderer/index.js +++ b/src/renderer/index.js @@ -3328,17 +3328,24 @@ const app = new Vue({ ipcRenderer.send('unmaximize'); ipcRenderer.send('windowmin', 250, 250) ipcRenderer.send('windowresize', 300, 300, false) - if (this.cfg.visual.miniplayer_ontop) { - ipcRenderer.send('windowontop', true) - } app.appMode = 'mini'; } else { ipcRenderer.send('windowmin', 844, 410) ipcRenderer.send('windowresize', this.tmpWidth, this.tmpHeight, false) ipcRenderer.send('windowontop', false) + this.cfg.visual.miniplayer_top_toggle = true; app.appMode = 'player'; } }, + pinMiniPlayer() { + if (this.cfg.visual.miniplayer_top_toggle) { + ipcRenderer.send('windowontop', true) + this.cfg.visual.miniplayer_top_toggle = false + } else { + ipcRenderer.send('windowontop', false) + this.cfg.visual.miniplayer_top_toggle = true; + } + }, formatTimezoneOffset: (e = new Date) => { let leadingZeros = (e, s = 2) => { let n = "" + e; diff --git a/src/renderer/style.less b/src/renderer/style.less index 0a280a01..48a78f9e 100644 --- a/src/renderer/style.less +++ b/src/renderer/style.less @@ -4794,6 +4794,24 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb { -webkit-app-region: no-drag; } + .player-pin { + z-index: 3; + position: absolute; + min-width: 20px; + min-height: 20px; + top: 5px; + right: 30px; + -webkit-app-region: no-drag; + } + + #mini-pin{ + display: none; + } + + .player-pin:hover #mini-pin { + display: block; + } + .playback-button--small { opacity: 0.7; } diff --git a/src/renderer/views/components/miniplayer.ejs b/src/renderer/views/components/miniplayer.ejs index bbfbf8c2..2d585401 100644 --- a/src/renderer/views/components/miniplayer.ejs +++ b/src/renderer/views/components/miniplayer.ejs @@ -1,7 +1,10 @@