Refactor quick menu to also pause,mute, minimize and exit

ScreenPlay/Resources.qrc

@@ -148,5 +148,7 @@
         <file>translations/ScreenPlay_it_IT.ts</file>
         <file>qml/Create/WizardsFiles/HTMLWallpaperMain.html</file>
         <file>qml/Create/WizardsFiles/HTMLWidgetMain.html</file>
+        <file>assets/icons/icon_minimize.svg</file>
+        <file>assets/icons/icon_video_settings_black_24dp.svg</file>
     </qresource>
 </RCC>

ScreenPlay/assets/icons/icon_close_black_24dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>

ScreenPlay/assets/icons/icon_minimize.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <rect x="0" y="0" width="24" height="24" style="fill:none;fill-rule:nonzero;"/>
+    <g transform="matrix(6.12323e-17,1,-1,6.12323e-17,24,0)">
+        <path d="M19,19L5,19L5,5L12,5L12,3L5,3C3.89,3 3,3.9 3,5L3,19C3,20.1 3.89,21 5,21L19,21C20.1,21 21,20.1 21,19L21,12L19,12L19,19ZM14,3L14,5L17.59,5L7.76,14.83L9.17,16.24L19,6.41L19,10L21,10L21,3L14,3Z" style="fill-rule:nonzero;"/>
+    </g>
+</svg>

ScreenPlay/assets/icons/icon_video_settings_black_24dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g><path d="M3,6h18v5h2V6c0-1.1-0.9-2-2-2H3C1.9,4,1,4.9,1,6v12c0,1.1,0.9,2,2,2h9v-2H3V6z"/><polygon points="15,12 9,8 9,16"/><path d="M22.71,18.43c0.03-0.29,0.04-0.58,0.01-0.86l1.07-0.85c0.1-0.08,0.12-0.21,0.06-0.32l-1.03-1.79 c-0.06-0.11-0.19-0.15-0.31-0.11L21.23,15c-0.23-0.17-0.48-0.31-0.75-0.42l-0.2-1.36C20.26,13.09,20.16,13,20.03,13h-2.07 c-0.12,0-0.23,0.09-0.25,0.21l-0.2,1.36c-0.26,0.11-0.51,0.26-0.74,0.42l-1.28-0.5c-0.12-0.05-0.25,0-0.31,0.11l-1.03,1.79 c-0.06,0.11-0.04,0.24,0.06,0.32l1.07,0.86c-0.03,0.29-0.04,0.58-0.01,0.86l-1.07,0.85c-0.1,0.08-0.12,0.21-0.06,0.32l1.03,1.79 c0.06,0.11,0.19,0.15,0.31,0.11l1.27-0.5c0.23,0.17,0.48,0.31,0.75,0.42l0.2,1.36c0.02,0.12,0.12,0.21,0.25,0.21h2.07 c0.12,0,0.23-0.09,0.25-0.21l0.2-1.36c0.26-0.11,0.51-0.26,0.74-0.42l1.28,0.5c0.12,0.05,0.25,0,0.31-0.11l1.03-1.79 c0.06-0.11,0.04-0.24-0.06-0.32L22.71,18.43z M19,19.5c-0.83,0-1.5-0.67-1.5-1.5s0.67-1.5,1.5-1.5s1.5,0.67,1.5,1.5 S19.83,19.5,19,19.5z"/></g></g></svg>

ScreenPlay/main.qml

@@ -15,18 +15,18 @@ import "qml/Workshop" as Workshop
 import "qml/Community" as Community
 
 ApplicationWindow {
-    id: window
+    id: root
 
     function setTheme(theme) {
         switch (theme) {
         case Settings.System:
-            window.Material.theme = Material.System;
+            root.Material.theme = Material.System;
             break;
         case Settings.Dark:
-            window.Material.theme = Material.Dark;
+            root.Material.theme = Material.Dark;
             break;
         case Settings.Light:
-            window.Material.theme = Material.Light;
+            root.Material.theme = Material.Light;
             break;
         }
     }
@@ -59,15 +59,21 @@ ApplicationWindow {
     // https://bugreports.qt.io/browse/QTBUG-86047
     Material.accent: Material.color(Material.Orange)
     onVisibilityChanged: {
-        if (window.visibility === 2)
+        if (root.visibility === 2)
             ScreenPlay.installedListModel.reset();
 
     }
+    onClosing: {
+        if (ScreenPlay.screenPlayManager.activeWallpaperCounter === 0
+                && ScreenPlay.screenPlayManager.activeWidgetsCounter === 0) {
+            Qt.quit()
+        }
+    }
     Component.onCompleted: {
         setTheme(ScreenPlay.settings.theme);
         switchPage("Installed");
         if (!ScreenPlay.settings.silentStart)
-            window.show();
+            root.show();
 
     }
 
@@ -89,7 +95,7 @@ ApplicationWindow {
 
     Connections {
         function onRequestRaise() {
-            window.show();
+            root.show();
         }
 
         target: ScreenPlay.screenPlayManager
@@ -103,10 +109,11 @@ ApplicationWindow {
     }
 
     Dialogs.CriticalError {
-        mainWindow: window
+        window: root
     }
 
     Common.TrayIcon {
+        window: root
     }
 
     StackView {
@@ -192,6 +199,7 @@ ApplicationWindow {
 
     Navigation.Navigation {
         id: nav
+        window: root
 
         onChangePage: (name)=>  {
             monitors.close();

ScreenPlay/qml/Common/Dialogs/CriticalError.qml

@@ -9,7 +9,7 @@ import ScreenPlay 1.0
 Dialog {
     id: root
 
-    property Window mainWindow
+    property ApplicationWindow window
     property string message
 
     modal: true
@@ -22,7 +22,7 @@ Dialog {
     Connections {
         function onDisplayErrorPopup(msg) {
             root.message = msg;
-            root.mainWindow.show();
+            root.window.show();
             root.open();
         }
 

ScreenPlay/qml/Common/TrayIcon.qml

@@ -1,10 +1,12 @@
 import QtQuick
-import Qt.labs.platform 1.1
+import QtQuick.Window
+import Qt.labs.platform
 import ScreenPlay 1.0
 
 SystemTrayIcon {
     id: root
 
+    property var window
     visible: true
     icon.source: "qrc:/assets/icons/app.ico"
     tooltip: qsTr("ScreenPlay - Double click to change you settings.")

ScreenPlay/qml/Navigation/Navigation.qml

@@ -1,5 +1,7 @@
 import QtQuick
 import QtQuick.Controls
+import QtQuick.Layouts
+import QtQuick.Window
 import QtQuick.Controls.Material
 import Qt5Compat.GraphicalEffects
 import QtQuick.Controls.Material.impl
@@ -13,53 +15,54 @@ Rectangle {
     property string currentNavigationName: ""
     property var navArray: [navCreate, navWorkshop, navInstalled, navSettings, navCommunity]
     property bool navActive: true
+    property ApplicationWindow window
+    property int iconWidth: 16
+    property int iconHeight: iconWidth
 
     signal changePage(string name)
 
     function setActive(active) {
-        navActive = active;
+        navActive = active
         if (active)
-            root.state = "enabled";
+            root.state = "enabled"
         else
-            root.state = "disabled";
+            root.state = "disabled"
     }
 
     function setNavigation(name) {
-        var i = 0;
+        var i = 0
         for (; i < navArray.length; i++) {
             if (navArray[i].name === name) {
-                navArray[i].state = "active";
-                root.currentNavigationName = name;
+                navArray[i].state = "active"
+                root.currentNavigationName = name
             } else {
-                navArray[i].state = "inactive";
+                navArray[i].state = "inactive"
             }
         }
     }
 
     function onPageChanged(name) {
         if (!navActive)
-            return ;
+            return
 
-        root.changePage(name);
-        setNavigation(name);
+        root.changePage(name)
+        setNavigation(name)
     }
 
     height: 60
-    clip: true
     width: 1366
     color: Material.theme === Material.Light ? "white" : Material.background
     layer.enabled: true
 
-    MouseHoverBlocker {
-    }
+    MouseHoverBlocker {}
 
     Connections {
         function onRequestNavigationActive(isActive) {
-            setActive(isActive);
+            setActive(isActive)
         }
 
         function onRequestNavigation(nav) {
-            onPageChanged(nav);
+            onPageChanged(nav)
         }
 
         target: ScreenPlay.util
@@ -128,10 +131,135 @@ Rectangle {
             onPageClicked: (name)=> {root.onPageChanged(name)}
             objectName: "settingsTab"
         }
-
     }
 
-    NavigationWallpaperConfiguration {
+    Rectangle {
+        id:quickActionRowBackground
+        anchors.centerIn: quickActionRow
+        width: quickActionRow.width + 5
+        height: quickActionRow.height - 16
+        color: "transparent"
+        border.color: Material.iconDisabledColor
+        border.width: 1
+        radius: 3
+    }
+
+    RowLayout {
+        id: quickActionRow
+        anchors {
+            top: parent.top
+            right: parent.right
+            rightMargin: 10
+            bottom: parent.bottom
+        }
+        property bool contentActive: ScreenPlay.screenPlayManager.activeWallpaperCounter > 0
+                                     || ScreenPlay.screenPlayManager.activeWidgetsCounter > 0
+
+        ToolButton {
+            id: miMuteAll
+            Layout.alignment: Qt.AlignVCenter
+            icon.source: "qrc:/assets/icons/icon_volume.svg"
+            icon.width: root.iconWidth
+            icon.height: root.iconHeight
+            enabled: quickActionRow.contentActive
+            property bool isMuted: false
+            onClicked: {
+                if (miMuteAll.isMuted) {
+                    isMuted = false;
+                    miMuteAll.icon.source = "qrc:/assets/icons/icon_volume.svg"
+                    ScreenPlay.screenPlayManager.setAllWallpaperValue("muted", "false");
+                } else {
+                    isMuted = true;
+                    miMuteAll.icon.source = "qrc:/assets/icons/icon_volume_mute.svg"
+                    ScreenPlay.screenPlayManager.setAllWallpaperValue("muted", "true");
+                }
+            }
+            hoverEnabled: true
+            ToolTip.text: qsTr("Mute/Unmute all Wallpaper")
+            ToolTip.visible: hovered
+        }
+        ToolButton {
+            id: miStopAll
+            enabled: quickActionRow.contentActive
+            Layout.alignment: Qt.AlignVCenter
+            icon.source: "qrc:/assets/icons/icon_pause.svg"
+            icon.width: root.iconWidth
+            icon.height: root.iconHeight
+
+            property bool isPlaying: false
+
+            onClicked: {
+                if (miStopAll.isPlaying) {
+                    isPlaying = false;
+                    miStopAll.icon.source = "qrc:/assets/icons/icon_pause.svg"
+                    ScreenPlay.screenPlayManager.setAllWallpaperValue("isPlaying", "true");
+                } else {
+                    isPlaying = true;
+                    miStopAll.icon.source = "qrc:/assets/icons/icon_play.svg"
+                    ScreenPlay.screenPlayManager.setAllWallpaperValue("isPlaying", "false");
+                }
+            }
+            hoverEnabled: true
+            ToolTip.text: qsTr("Pause/Play all Wallpaper")
+            ToolTip.visible: hovered
+        }
+        ToolButton {
+                id: miConfig
+                Layout.alignment: Qt.AlignVCenter
+                icon.source: "qrc:/assets/icons/icon_video_settings_black_24dp.svg"
+                icon.width: root.iconWidth
+                icon.height: root.iconHeight
+                onClicked: ScreenPlay.util.setToggleWallpaperConfiguration()
+                hoverEnabled: true
+                ToolTip.text: qsTr("Configure Wallpaper")
+                ToolTip.visible: hovered
+            }
+
+        Rectangle  {
+            color: Material.iconDisabledColor
+            height: quickActionRowBackground.height
+            width: 1
+        }
+
+        ToolButton {
+            id: miMinimize
+            Layout.alignment: Qt.AlignVCenter
+            icon.source: "qrc:/assets/icons/icon_minimize.svg"
+            icon.width: root.iconWidth
+            icon.height: root.iconHeight
+            onClicked: root.window.hide()
+            hoverEnabled: true
+            ToolTip.text: qsTr("Minimize to Tray")
+            ToolTip.visible: hovered
+        }
+        ToolButton {
+            id: miquit
+            Layout.alignment: Qt.AlignVCenter
+            icon.source: "qrc:/assets/icons/icon_close.svg"
+            icon.width: root.iconWidth
+            icon.height: root.iconHeight
+            onClicked: {
+                if(ScreenPlay.screenPlayManager.activeWallpaperCounter > 0
+                        && ScreenPlay.screenPlayManager.activeWidgetsCounter > 0){
+                    Qt.quit()
+                    return
+                }
+                dialog.open()
+            }
+            hoverEnabled: true
+            ToolTip.text: qsTr("Exit")
+            ToolTip.visible: hovered
+        }
+
+        Dialog {
+            id: dialog
+            anchors.centerIn: Overlay.overlay
+            title: qsTr("Are you sure you want to exit ScreenPlay? \nThis will shut down all Wallpaper and Widgets.")
+            standardButtons: Dialog.Ok | Dialog.Cancel
+            onAccepted: Qt.quit()
+        }
+
+
     }
 
     layer.effect: ElevationEffect {
@@ -149,7 +277,6 @@ Rectangle {
                 target: row
                 opacity: 0.3
             }
-
         }
     ]
     transitions: [
@@ -161,7 +288,6 @@ Rectangle {
                 target: row
                 duration: 300
             }
-
         }
     ]
 }

ScreenPlay/qml/Navigation/NavigationItem.qml

@@ -24,7 +24,6 @@ Item {
     width: txtAmount.paintedWidth + txt.paintedWidth + icon.paintedWidth + 40
     height: 60
     state: "inactive"
-    clip: true
     onEnabledChanged: {
         if (!enabled) {
             navigationItem.width = 0;
@@ -74,7 +73,7 @@ Item {
             anchors.left: txtAmount.right
             anchors.leftMargin: navigationItem.amount == "" ? 0 : 5
             text: "name"
-            font.pointSize: 14
+            font.pointSize: 12
             color: Material.primaryTextColor
             anchors.verticalCenter: parent.verticalCenter
             font.family: ScreenPlay.settings.font

ScreenPlay/qml/Navigation/NavigationWallpaperConfiguration.qml

@@ -1,127 +0,0 @@
-import QtQuick
-import QtQuick.Controls
-import QtQuick.Controls.Material
-import Qt5Compat.GraphicalEffects
-import ScreenPlay 1.0
-import "../Common"
-
-Item {
-    id: root
-
-    width: 390
-    property bool active: ScreenPlay.screenPlayManager.activeWallpaperCounter > 0
-
-    anchors {
-        top: parent.top
-        right: parent.right
-        rightMargin: 20
-        bottom: parent.bottom
-    }
-
-    Connections {
-        function onActiveWallpaperCounterChanged() {
-            rippleEffect.trigger()
-        }
-
-        target: ScreenPlay.screenPlayManager
-    }
-
-    Pane {
-        anchors.centerIn: parent
-        contentWidth: activeMonitorName.contentWidth + image.width + 80
-        contentHeight: parent.height - 10
-        background: Item {
-            Rectangle {
-                id: bg
-                clip: true
-                anchors {
-                    fill: parent
-                    margins: 16
-                }
-                color: "transparent"
-                border.color: root.active ? Material.accentColor : Material.iconDisabledColor
-                border.width: 1
-                radius: 3
-            }
-
-            RippleEffect {
-                id: rippleEffect
-
-                target: bg
-            }
-        }
-
-        Behavior on contentWidth {
-            PropertyAnimation {
-                duration: 250
-                easing.type: Easing.InOutQuart
-            }
-        }
-
-        Text {
-            id: activeMonitorName
-
-            horizontalAlignment: Text.AlignRight
-            color: root.active ? Material.primaryTextColor : Material.iconDisabledColor
-            font.pointSize: 12
-            font.family: ScreenPlay.settings.font
-            text: root.active ? qsTr("Configurate active Wallpaper or Widgets") : qsTr(
-                                    "No active Wallpaper or Widgets")
-
-            anchors {
-                right: image.right
-                rightMargin: 50
-                verticalCenter: parent.verticalCenter
-            }
-        }
-
-        Image {
-            id: image
-
-            width: 28
-            height: 24
-            source: "qrc:/assets/icons/icon_monitor.svg"
-            layer {
-                effect: ColorOverlay {
-                    color: root.active ? Material.color(
-                                             Material.Orange) : Material.iconDisabledColor
-                }
-            }
-
-            anchors {
-                rightMargin: 30
-                right: parent.right
-                verticalCenter: parent.verticalCenter
-            }
-
-            Text {
-                id: txtAmountActiveWallpapers
-
-                text: ScreenPlay.screenPlayManager.activeWallpaperCounter
-                      + ScreenPlay.screenPlayManager.activeWidgetsCounter
-                horizontalAlignment: Text.AlignHCenter
-                verticalAlignment: Text.AlignVCenter
-                color: root.active ? Material.color(
-                                         Material.Orange) : Material.iconDisabledColor
-                font.pointSize: 10
-                font.bold: true
-                font.family: ScreenPlay.settings.font
-                anchors {
-                    horizontalCenter: parent.horizontalCenter
-                    bottom: parent.bottom
-                    bottomMargin: 7
-                }
-            }
-        }
-
-        MouseArea {
-            id: ma
-
-            anchors.fill: parent
-            cursorShape: Qt.PointingHandCursor
-            onClicked: {
-                ScreenPlay.util.setToggleWallpaperConfiguration()
-            }
-        }
-    }
-}