diff --git a/config/Dimensions.qml b/config/Dimensions.qml index 6fa759f..42c2c27 100644 --- a/config/Dimensions.qml +++ b/config/Dimensions.qml @@ -13,7 +13,6 @@ Singleton { property Clock clock: Clock {} property Workspace workspace: Workspace {} property Tray tray: Tray {} - property TrayMenu trayMenu: TrayMenu {} component Bar: QtObject { id: bar @@ -66,14 +65,4 @@ Singleton { property int verticalPadding: 6 property int horizontalPadding: 7 } - - component TrayMenu: QtObject { - id: trayItem - - property int fontSize: 10 - property int width: 30 - property int height: 30 - property int verticalPadding: 6 - property int horizontalPadding: 7 - } } diff --git a/modules/bar/Bar.qml b/modules/bar/Bar.qml index cbc77d0..612acda 100644 --- a/modules/bar/Bar.qml +++ b/modules/bar/Bar.qml @@ -8,7 +8,7 @@ import "../../config/" Scope { PanelWindow { - id: parentWindow + id: root anchors.top: true anchors.left: true diff --git a/modules/bar/components/mpris/Player.qml b/modules/bar/components/mpris/Player.qml index 3c7490f..47cc619 100644 --- a/modules/bar/components/mpris/Player.qml +++ b/modules/bar/components/mpris/Player.qml @@ -27,14 +27,8 @@ Loader { modelData.play(); } } - - onWheel: event => { - if (event.angleDelta.y > 0) { - parent.nextPlayer(); - } else if (event.angleDelta.y < 0) { - parent.previousPlayer(); - } - } + onScrolledUp: parent.nextPlayer() + onScrolledDown: parent.previousPlayer() StyledText { id: text @@ -50,7 +44,7 @@ Loader { states: State { name: "hovered" - when: clickable.containsMouse + when: clickable.hovered PropertyChanges { text { color: Theme.palette.base300 diff --git a/modules/bar/components/tray/Tray.qml b/modules/bar/components/tray/Tray.qml index a907abc..4b04744 100644 --- a/modules/bar/components/tray/Tray.qml +++ b/modules/bar/components/tray/Tray.qml @@ -10,14 +10,6 @@ Row { Repeater { model: SystemTray.items - Loader { - required property SystemTrayItem modelData - active: true - - sourceComponent: item - property Component item: TrayItem { - trayItem: modelData - } - } + TrayItem {} } } diff --git a/modules/bar/components/tray/TrayItem.qml b/modules/bar/components/tray/TrayItem.qml index 6e8fff6..126f5be 100644 --- a/modules/bar/components/tray/TrayItem.qml +++ b/modules/bar/components/tray/TrayItem.qml @@ -7,62 +7,50 @@ import "../../../../config/" import "../../../../styled/" import "menu/" -Clickable { - id: root +Loader { + required property SystemTrayItem modelData - property SystemTrayItem trayItem - property bool menuOpened: false + active: modelData.hasMenu - implicitWidth: Dimensions.tray.width - implicitHeight: Dimensions.tray.height + onLoaded: console.log(modelData.icon) + sourceComponent: item + property Component item: Clickable { + id: clickable - onClicked: toggleMenu() + property bool menuOpen - function toggleMenu() { - menuOpened = !menuOpened; - } + width: Dimensions.tray.width + height: Dimensions.tray.height - IconImage { - id: icon - anchors.margins: 6 - anchors.fill: parent - asynchronous: true - source: { - let icon = modelData.icon; - if (icon.includes("?path=")) { - const [name, path] = icon.split("?path="); - icon = `file://${path}/${name.slice(name.lastIndexOf("/") + 1)}`; - } - return icon; - } - anchors.centerIn: parent - } + onClicked: menuOpen = !menuOpen - PopupWindow { - id: popup - - visible: root.menuOpened - - color: 'transparent' - - anchor.item: root - anchor.rect.x: root.width / 2 - width / 2 - anchor.rect.y: root.height + 8 - - implicitWidth: menu.width - implicitHeight: menu.height - - Rectangle { + IconImage { + id: icon + anchors.margins: 6 anchors.fill: parent - color: Theme.palette.base300 - radius: 8 + asynchronous: true + source: { + let icon = modelData.icon; + if (icon.includes("?path=")) { + const [name, path] = icon.split("?path="); + icon = `file://${path}/${name.slice(name.lastIndexOf("/") + 1)}`; + } + return icon; + } + anchors.centerIn: parent } - Menu { - id: menu + // Loader { + // active: menuOpen && modelData.hasMenu + // + // property Component menu: Menu { + // menu: modelData.menu + // } + // } + PopupWindow { - menuOpener: QsMenuOpener { - menu: trayItem.menu + Menu { + menu: modelData.menu } } } diff --git a/modules/bar/components/tray/menu/Menu.qml b/modules/bar/components/tray/menu/Menu.qml index b7268ff..2f6c027 100644 --- a/modules/bar/components/tray/menu/Menu.qml +++ b/modules/bar/components/tray/menu/Menu.qml @@ -1,29 +1,23 @@ import QtQuick import QtQuick.Layouts import Quickshell -import "../../../../../config/" import "../../../../../styled/" ColumnLayout { - id: menu - property QsMenuOpener menuOpener - - anchors.margins: 8 + property QsMenuOpener menu Repeater { - model: menuOpener.children - delegate: Loader { - required property QsMenuEntry modelData - active: true + model: modelData.children - sourceComponent: modelData.isSeparator ? menuSeperator : menuItem - property Component menuSeperator: Rectangle { - implicitHeight: 1 - implicitWidth: menu.width - color: Theme.palette.basecontent - } + Loader { + id: loader + required property QsMenuEntry modelData + + active: modelData.enabled + + sourceComponent: menuItem property Component menuItem: MenuItem { - menuEntry: modelData + menuEntry: loader.modelData } } } diff --git a/modules/bar/components/tray/menu/MenuItem.qml b/modules/bar/components/tray/menu/MenuItem.qml index dbf7272..f41ee57 100644 --- a/modules/bar/components/tray/menu/MenuItem.qml +++ b/modules/bar/components/tray/menu/MenuItem.qml @@ -1,7 +1,6 @@ import QtQuick import QtQuick.Layouts import Quickshell -import "../../../../../config/" import "../../../../../styled/" Clickable { @@ -9,20 +8,11 @@ Clickable { property QsMenuEntry menuEntry implicitWidth: text.width - implicitHeight: 30 - onClicked: menuEntry.triggered() - - StyledText { + Text { id: text - - font.pixelSize: Dimensions.clock.fontSize - anchors.verticalCenter: parent.verticalCenter - topPadding: Dimensions.clock.verticalPadding - bottomPadding: Dimensions.clock.verticalPadding - leftPadding: Dimensions.clock.horizontalPadding - rightPadding: Dimensions.clock.horizontalPadding - text: item.menuEntry.text + + padding: 8 } } diff --git a/styled/Clickable.qml b/styled/Clickable.qml index f2f2c2e..ec4eff1 100644 --- a/styled/Clickable.qml +++ b/styled/Clickable.qml @@ -1,21 +1,30 @@ import QtQuick import "../config/" -MouseArea { - id: mouseArea - +Item { + id: root property bool disabled: false + property alias hovered: mouseArea.containsMouse + signal clicked + signal scrolledUp + signal scrolledDown - hoverEnabled: !disabled - cursorShape: Qt.PointingHandCursor - - Rectangle { + StyledLabel { id: background anchors.fill: parent - - radius: Dimensions.radius - color: mouseArea.containsMouse ? Theme.palette.primary : Theme.palette.base300 - Behavior on color { + states: State { + name: "hovered" + when: mouseArea.containsMouse + PropertyChanges { + background { + color: Theme.palette.primary + } + } + } + transitions: Transition { + from: "" + to: "hovered" + reversible: true ColorAnimation { properties: "color" duration: 200 @@ -23,4 +32,22 @@ MouseArea { } } } + + MouseArea { + id: mouseArea + anchors.fill: parent + + hoverEnabled: !disabled + cursorShape: Qt.PointingHandCursor + + onClicked: root.clicked() + + onWheel: event => { + if (event.angleDelta.y > 0) { + root.scrolledUp(); + } else if (event.angleDelta.y < 0) { + root.scrolledDown(); + } + } + } }