✨ Miniplayer improvements

atcq · Aug 3, 2020 · 72e0eb5 · 72e0eb5
1 parent baf217d
commit 72e0eb5
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 29 deletions.
diff --git a/main.js b/main.js
@@ -964,11 +964,13 @@ function createWindow() {
                 ),
                 width: settingsProvider.get('settings-miniplayer-size'),
                 height: settingsProvider.get('settings-miniplayer-size'),
-                backgroundColor: '#000000',
+                backgroundColor: '#232323',
                 minWidth: 100,
                 minHeight: 100,
                 autoHideMenuBar: true,
-                skipTaskbar: false,
+                skipTaskbar: !settingsProvider.get(
+                    'settings-miniplayer-show-task'
+                ),
                 webPreferences: {
                     nodeIntegration: true,
                 },

diff --git a/src/locales/scaffold.json b/src/locales/scaffold.json
@@ -52,6 +52,7 @@
     "LABEL_SETTINGS_TAB_MINIPLAYER_ALWAYS_SHOW_CONTROLS": "Always show controls",
     "LABEL_SETTINGS_TAB_MINIPLAYER_PAINT_CONTROLS": "Paint controls with album color",
     "LABEL_SETTINGS_TAB_MINIPLAYER_RESIZABLE": "Allow resizing",
+    "LABEL_SETTINGS_TAB_MINIPLAYER_SHOW_TASK": "Show on taskbar",
     "LABEL_SETTINGS_TAB_RAINMETER_WEB_NOW_PLAYING": "Rainmeter (WebNowPlaying)",
     "LABEL_SETTINGS_TAB_READ_CLIPBOARD": "Read clipboard for youtube links",
     "LABEL_SETTINGS_TAB_SHORTCUTS": "Shortcuts",

diff --git a/src/pages/miniplayer/miniplayer.css b/src/pages/miniplayer/miniplayer.css
@@ -1,3 +1,8 @@
+body {
+    background-repeat: no-repeat;
+    background-size: 100vmin;
+}
+
 body:hover .player-info,
 body:hover .cmd-btn,
 body.showinfo .player-info,
@@ -18,12 +23,12 @@ body.showinfo #background {
 
 .player-info {
     filter: opacity(0);
-    height: 78vmin
+    height: 78vmin;
 }
 
 .cmd-bar {
     margin: 4px 4px 0;
-    height: 10vmin
+    height: 10vmin;
 }
 
 #btn-drag {
@@ -108,7 +113,7 @@ body.showinfo #background {
 .progress-bar {
     margin-top: 1.4vmin;
     height: 0.6vmin;
-    width: 100vw;
+    width: 100vmin;
 }
 
 #progress {

diff --git a/src/pages/miniplayer/miniplayer.html b/src/pages/miniplayer/miniplayer.html
@@ -70,10 +70,6 @@
 
         <div id="background"></div>
         <div id="secondsEffect"></div>
-        <!--div class="hover-top"></div>
-        <div class="hover-left"></div>
-        <div class="hover-right"></div>
-        <div class="hover-bottom"></div-->
     </body>
 
     <script src="./miniplayer.js"></script>

diff --git a/src/pages/miniplayer/miniplayer.js b/src/pages/miniplayer/miniplayer.js
@@ -82,6 +82,7 @@ document.addEventListener('dblclick', (ev) => {
 
 function setPlayerInfo(data) {
     document.title = `${data.track.title} - ${data.track.author}`
+    body.style.backgroundImage = `url(${data.track.cover})`
     background.style.backgroundImage = `url(${data.track.cover})`
     title.innerHTML = data.track.title || 'Title'
     author.innerHTML = data.track.author || 'Author'

diff --git a/src/pages/settings/settings.html b/src/pages/settings/settings.html
@@ -189,6 +189,25 @@
                                         </td>
                                     </tr>
 
+                                    <tr>
+                                        <td>
+                                            <span
+                                                i18n="i18n_LABEL_SETTINGS_TAB_GENERAL_DISABLE_HARDWARE_ACCELERATION"
+                                            ></span>
+                                        </td>
+                                        <td class="right">
+                                            <div class="switch">
+                                                <label>
+                                                    <input
+                                                        type="checkbox"
+                                                        id="settings-disable-hardware-acceleration"
+                                                    />
+                                                    <span class="lever"></span>
+                                                </label>
+                                            </div>
+                                        </td>
+                                    </tr>
+
                                     <tr>
                                         <td>
                                             <span
@@ -268,25 +287,6 @@
                                         </td>
                                     </tr>
 
-                                    <tr>
-                                        <td>
-                                            <span
-                                                i18n="i18n_LABEL_SETTINGS_TAB_GENERAL_DISABLE_HARDWARE_ACCELERATION"
-                                            ></span>
-                                        </td>
-                                        <td class="right">
-                                            <div class="switch">
-                                                <label>
-                                                    <input
-                                                        type="checkbox"
-                                                        id="settings-disable-hardware-acceleration"
-                                                    />
-                                                    <span class="lever"></span>
-                                                </label>
-                                            </div>
-                                        </td>
-                                    </tr>
-
                                     <tr class="macos-specific">
                                         <td colspan="2">
                                             <div
@@ -394,6 +394,24 @@
                                             </div>
                                         </td>
                                     </tr>
+                                    <tr>
+                                        <td>
+                                            <span
+                                                i18n="i18n_LABEL_SETTINGS_TAB_MINIPLAYER_SHOW_TASK"
+                                            ></span>
+                                        </td>
+                                        <td class="right">
+                                            <div class="switch">
+                                                <label>
+                                                    <input
+                                                        type="checkbox"
+                                                        id="settings-miniplayer-show-task"
+                                                    />
+                                                    <span class="lever"></span>
+                                                </label>
+                                            </div>
+                                        </td>
+                                    </tr>
                                 </tbody>
                             </table>
                         </div>

diff --git a/src/pages/settings/settings.js b/src/pages/settings/settings.js
@@ -122,6 +122,7 @@ document.addEventListener('DOMContentLoaded', function () {
 
     initElement('settings-miniplayer-always-top', 'click')
     initElement('settings-miniplayer-resizable', 'click')
+    initElement('settings-miniplayer-show-task', 'click')
     initElement('settings-miniplayer-always-show-controls', 'click')
     initElement('settings-miniplayer-paint-controls', 'click')
     initElement('settings-enable-taskbar-progressbar', 'click')

diff --git a/src/utils/defaultSettings.js b/src/utils/defaultSettings.js
@@ -18,7 +18,9 @@ settingsProvider.setInitialValue('settings-app-language', 'en') // English
 
 settingsProvider.setInitialValue('settings-miniplayer-size', '200') // Normal size
 
-settingsProvider.setInitialValue('settings-miniplayer-resizable', true) // Normal size
+settingsProvider.setInitialValue('settings-miniplayer-resizable', false) // Not resizable
+
+settingsProvider.setInitialValue('settings-miniplayer-show-task', false) // hide from taskbar
 
 settingsProvider.setInitialValue('settings-lyrics-provider', '1') // OVH