fullscreen mode settings

index.html

@@ -3915,6 +3915,35 @@
                                         <span class="slider"></span>
                                     </label>
                                 </div>
+
+                                <div class="setting-item">
+                                    <div class="info">
+                                        <span class="label">Now Playing View Mode</span>
+                                        <span class="description">Choose what shows when you click the album art</span>
+                                    </div>
+                                    <select id="now-playing-mode">
+                                        <option value="album">Go to Album</option>
+                                        <option value="cover">Fullscreen Mode</option>
+                                        <option value="lyrics">Lyrics Panel</option>
+                                    </select>
+                                </div>
+
+                                <div class="setting-item">
+                                    <div class="info">
+                                        <span class="label">Fullscreen Cover Click Action</span>
+                                        <span class="description"
+                                            >Choose what happens when you click the cover in fullscreen mode</span
+                                        >
+                                    </div>
+                                    <select id="fullscreen-cover-click-action">
+                                        <option value="exit">Exit fullscreen mode</option>
+                                        <option value="hide-ui">Hide UI</option>
+                                        <option value="pause-resume">Pause/resume track</option>
+                                        <option value="next">Skip song</option>
+                                        <option value="previous">Previous song</option>
+                                        <option value="nothing">Do nothing</option>
+                                    </select>
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -4788,19 +4817,6 @@
                             </div>
 
                             <div class="settings-group">
-                                <div class="setting-item">
-                                    <div class="info">
-                                        <span class="label">Now Playing View Mode</span>
-                                        <span class="description">Choose what shows when you click the album art</span>
-                                    </div>
-                                    <select id="now-playing-mode">
-                                        <option value="album">Go to Album</option>
-                                        <option value="cover">Fullscreen Mode</option>
-                                        <option value="lyrics">Lyrics Panel</option>
-                                    </select>
-                                </div>
-
-                                <div class="setting-item">
                                     <div class="info">
                                         <span class="label">Compact Artists</span>
                                         <span class="description"

js/app.js

@@ -4,6 +4,7 @@ import {
     apiSettings,
     themeManager,
     nowPlayingSettings,
+    fullscreenCoverClickSettings,
     downloadQualitySettings,
     sidebarSettings,
     pwaUpdateSettings,
@@ -518,10 +519,47 @@ document.addEventListener('DOMContentLoaded', async () => {
     });
 
     document.getElementById('fullscreen-cover-image')?.addEventListener('click', () => {
-        if (window.location.hash === '#fullscreen') {
+        const action = fullscreenCoverClickSettings.getAction();
-            window.history.back();
+        const overlay = document.getElementById('fullscreen-cover-overlay');
-        } else {
+        const playerInstance = window.monochromePlayer;
-            ui.closeFullscreenCover();
+
+        switch (action) {
+            case 'exit':
+                if (window.location.hash === '#fullscreen') {
+                    window.history.back();
+                } else {
+                    ui.closeFullscreenCover();
+                }
+                break;
+            case 'hide-ui':
+                if (overlay) {
+                    overlay.classList.toggle('ui-hidden');
+                    const toggleBtn = document.getElementById('toggle-ui-btn');
+                    if (toggleBtn) {
+                        const isUIHidden = overlay.classList.contains('ui-hidden');
+                        toggleBtn.classList.toggle('active', isUIHidden);
+                        toggleBtn.classList.toggle('visible', true);
+                        toggleBtn.title = isUIHidden ? 'Show UI' : 'Hide UI';
+                    }
+                }
+                break;
+            case 'pause-resume':
+                if (playerInstance) playerInstance.handlePlayPause();
+                break;
+            case 'next':
+                if (playerInstance) playerInstance.playNext();
+                break;
+            case 'previous':
+                if (playerInstance) playerInstance.playPrev();
+                break;
+            case 'nothing':
+                break;
+            default:
+                if (window.location.hash === '#fullscreen') {
+                    window.history.back();
+                } else {
+                    ui.closeFullscreenCover();
+                }
         }
     });
 

js/settings.js

@@ -3,6 +3,7 @@ import {
     themeManager,
     lastFMStorage,
     nowPlayingSettings,
+    fullscreenCoverClickSettings,
     lyricsSettings,
     backgroundSettings,
     dynamicColorSettings,
@@ -1986,6 +1987,15 @@ export function initializeSettings(scrobbler, player, api, ui) {
         });
     }
 
+    // Fullscreen Cover Click Action
+    const fullscreenCoverClickAction = document.getElementById('fullscreen-cover-click-action');
+    if (fullscreenCoverClickAction) {
+        fullscreenCoverClickAction.value = fullscreenCoverClickSettings.getAction();
+        fullscreenCoverClickAction.addEventListener('change', (e) => {
+            fullscreenCoverClickSettings.setAction(e.target.value);
+        });
+    }
+
     // Close Modals on Navigation Toggle
     const closeModalsOnNavigationToggle = document.getElementById('close-modals-on-navigation-toggle');
     if (closeModalsOnNavigationToggle) {

js/storage.js

@@ -421,6 +421,22 @@ export const nowPlayingSettings = {
     },
 };
 
+export const fullscreenCoverClickSettings = {
+    STORAGE_KEY: 'fullscreen-cover-click-action',
+
+    getAction() {
+        try {
+            return localStorage.getItem(this.STORAGE_KEY) || 'exit';
+        } catch {
+            return 'exit';
+        }
+    },
+
+    setAction(action) {
+        localStorage.setItem(this.STORAGE_KEY, action);
+    },
+};
+
 export const lyricsSettings = {
     DOWNLOAD_WITH_TRACKS: 'lyrics-download-with-tracks',