diff --git a/.config/quickshell/modules/common/ConfigOptions.qml b/.config/quickshell/modules/common/ConfigOptions.qml index 56b735dd..c8fde86d 100644 --- a/.config/quickshell/modules/common/ConfigOptions.qml +++ b/.config/quickshell/modules/common/ConfigOptions.qml @@ -37,6 +37,12 @@ Singleton { } } + property QtObject dock: QtObject { + property real height: 60 + property real hoverRegionHeight: 3 + property bool pinnedOnStartup: false + } + property QtObject networking: QtObject { property string userAgent: "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36" } diff --git a/.config/quickshell/modules/common/widgets/GroupButton.qml b/.config/quickshell/modules/common/widgets/GroupButton.qml index 4b033a72..a369ec16 100644 --- a/.config/quickshell/modules/common/widgets/GroupButton.qml +++ b/.config/quickshell/modules/common/widgets/GroupButton.qml @@ -27,9 +27,10 @@ Button { property var parentGroup: root.parent property int clickIndex: parentGroup?.clickIndex ?? -1 - Layout.fillWidth: (clickIndex - 1 <= parentGroup.children.indexOf(button) && parentGroup.children.indexOf(button) <= clickIndex + 1) - implicitWidth: (button.down && bounce) ? clickedWidth : baseWidth - implicitHeight: (button.down && bounce) ? clickedHeight : baseHeight + Layout.fillWidth: (clickIndex - 1 <= parentGroup.children.indexOf(root) && parentGroup.children.indexOf(root) <= clickIndex + 1) + Layout.fillHeight: (clickIndex - 1 <= parentGroup.children.indexOf(root) && parentGroup.children.indexOf(root) <= clickIndex + 1) + implicitWidth: (root.down && bounce) ? clickedWidth : baseWidth + implicitHeight: (root.down && bounce) ? clickedHeight : baseHeight Behavior on implicitWidth { animation: Appearance.animation.clickBounce.numberAnimation.createObject(this) @@ -56,9 +57,9 @@ Button { colBackground)) : colBackground onDownChanged: { - if (button.down) { - if (button.parent.clickIndex !== undefined) { - button.parent.clickIndex = parent.children.indexOf(button) + if (root.down) { + if (root.parent.clickIndex !== undefined) { + root.parent.clickIndex = parent.children.indexOf(root) } } } diff --git a/.config/quickshell/modules/common/widgets/VerticalButtonGroup.qml b/.config/quickshell/modules/common/widgets/VerticalButtonGroup.qml new file mode 100644 index 00000000..7d8fc29f --- /dev/null +++ b/.config/quickshell/modules/common/widgets/VerticalButtonGroup.qml @@ -0,0 +1,47 @@ +import "root:/modules/common" +import "root:/modules/common/widgets" +import "root:/modules/common/functions/color_utils.js" as ColorUtils +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +/** + * A container that supports GroupButton children for bounciness. + * See https://m3.material.io/components/button-groups/overview + */ +Rectangle { + id: root + default property alias content: columnLayout.data + property real spacing: 5 + property real padding: 0 + property int clickIndex: columnLayout.clickIndex + + property real contentHeight: { + let total = 0; + for (let i = 0; i < columnLayout.children.length; ++i) { + const child = columnLayout.children[i]; + total += child.baseHeight ?? child.implicitHeight ?? child.height; + } + return total + columnLayout.spacing * (columnLayout.children.length - 1); + } + + topLeftRadius: columnLayout.children.length > 0 ? (columnLayout.children[0].radius + padding) : + Appearance?.rounding?.small + topRightRadius: topLeftRadius + bottomLeftRadius: columnLayout.children.length > 0 ? (columnLayout.children[columnLayout.children.length - 1].radius + padding) : + Appearance?.rounding?.small + bottomRightRadius: bottomLeftRadius + + color: "transparent" + height: root.contentHeight + padding * 2 + implicitWidth: columnLayout.implicitWidth + padding * 2 + implicitHeight: root.contentHeight + padding * 2 + + children: [ColumnLayout { + id: columnLayout + anchors.fill: parent + anchors.margins: root.padding + spacing: root.spacing + property int clickIndex: -1 + }] +} diff --git a/.config/quickshell/modules/dock/Dock.qml b/.config/quickshell/modules/dock/Dock.qml new file mode 100644 index 00000000..4da45e74 --- /dev/null +++ b/.config/quickshell/modules/dock/Dock.qml @@ -0,0 +1,141 @@ +import "root:/" +import "root:/services" +import "root:/modules/common" +import "root:/modules/common/widgets" +import QtQuick +import QtQuick.Controls +import QtQuick.Effects +import QtQuick.Layouts +import Quickshell.Io +import Quickshell +import Quickshell.Widgets +import Quickshell.Wayland +import Quickshell.Hyprland + +Scope { // Scope + id: root + property bool pinned: ConfigOptions?.dock.pinnedOnStartup ?? false + + Variants { // For each monitor + model: Quickshell.screens + PanelWindow { // Window + required property var modelData + id: dockRoot + screen: modelData + + property bool reveal: root.pinned || dockMouseArea.containsMouse + + anchors { + bottom: true + left: true + right: true + } + + function hide() { + cheatsheetLoader.active = false + } + exclusiveZone: root.pinned ? implicitHeight - Appearance.sizes.hyprlandGapsOut : 0 + Component.onCompleted: { + console.log(ConfigOptions.dock.hoverRegionHeight) + } + + implicitWidth: dockBackground.implicitWidth + WlrLayershell.namespace: "quickshell:dock" + color: "transparent" + + implicitHeight: (ConfigOptions?.dock.height ?? 70) + Appearance.sizes.elevationMargin + Appearance.sizes.hyprlandGapsOut + + mask: Region { + item: dockMouseArea + } + + MouseArea { + id: dockMouseArea + anchors.top: parent.top + height: parent.height + anchors.topMargin: dockRoot.reveal ? 0 : dockRoot.implicitHeight - ConfigOptions.dock.hoverRegionHeight + anchors.left: parent.left + anchors.right: parent.right + hoverEnabled: true + + Behavior on anchors.topMargin { + animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) + } + + Item { + id: dockHoverRegion + anchors.fill: parent + + Item { + id: dockBackground + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + + implicitWidth: dockRow.implicitWidth + 5 * 2 + height: parent.height - Appearance.sizes.elevationMargin - Appearance.sizes.hyprlandGapsOut + + RectangularShadow { + anchors.fill: dockVisualBackground + radius: dockVisualBackground.radius + blur: 1.2 * Appearance.sizes.elevationMargin + spread: 1 + color: Appearance.colors.colShadow + cached: true + } + Rectangle { + id: dockVisualBackground + property real margin: Appearance.sizes.elevationMargin + anchors.fill: parent + anchors.topMargin: margin + anchors.bottomMargin: margin + color: Appearance.colors.colLayer0 + radius: Appearance.rounding.large + } + + RowLayout { + id: dockRow + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + spacing: 3 + property real padding: 5 + + VerticalButtonGroup { + GroupButton { // Pin button + baseWidth: 35 + baseHeight: 35 + clickedWidth: baseWidth + clickedHeight: baseHeight + 20 + buttonRadius: Appearance.rounding.normal + toggled: root.pinned + onClicked: root.pinned = !root.pinned + contentItem: MaterialSymbol { + text: "keep" + horizontalAlignment: Text.AlignHCenter + iconSize: Appearance.font.pixelSize.larger + color: root.pinned ? Appearance.m3colors.m3onPrimary : Appearance.colors.colOnLayer0 + } + } + } + DockSeparator {} + DockApps {} + DockSeparator {} + DockButton { + onClicked: Hyprland.dispatch("global quickshell:overviewToggle") + contentItem: MaterialSymbol { + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + font.pixelSize: parent.width / 2 + text: "apps" + color: Appearance.colors.colOnLayer0 + } + } + } + } + } + + } + } + } +} diff --git a/.config/quickshell/modules/dock/DockApps.qml b/.config/quickshell/modules/dock/DockApps.qml new file mode 100644 index 00000000..5dbddfac --- /dev/null +++ b/.config/quickshell/modules/dock/DockApps.qml @@ -0,0 +1,17 @@ +import "root:/" +import "root:/services" +import "root:/modules/common" +import "root:/modules/common/widgets" +import QtQuick +import QtQuick.Controls +import QtQuick.Effects +import QtQuick.Layouts +import Quickshell.Io +import Quickshell +import Quickshell.Widgets +import Quickshell.Wayland +import Quickshell.Hyprland + +RowLayout { + +} \ No newline at end of file diff --git a/.config/quickshell/modules/dock/DockButton.qml b/.config/quickshell/modules/dock/DockButton.qml new file mode 100644 index 00000000..f8066158 --- /dev/null +++ b/.config/quickshell/modules/dock/DockButton.qml @@ -0,0 +1,15 @@ +import "root:/" +import "root:/modules/common" +import "root:/modules/common/widgets" +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +RippleButton { + Layout.fillHeight: true + implicitWidth: background.height + buttonRadius: Appearance.rounding.normal + + topInset: dockVisualBackground.margin + dockRow.padding + bottomInset: dockVisualBackground.margin + dockRow.padding +} diff --git a/.config/quickshell/modules/dock/DockSeparator.qml b/.config/quickshell/modules/dock/DockSeparator.qml new file mode 100644 index 00000000..2b27b0da --- /dev/null +++ b/.config/quickshell/modules/dock/DockSeparator.qml @@ -0,0 +1,13 @@ +import "root:/" +import "root:/modules/common" +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +Rectangle { + Layout.topMargin: dockVisualBackground.margin + dockRow.padding + Appearance.rounding.normal + Layout.bottomMargin: dockVisualBackground.margin + dockRow.padding + Appearance.rounding.normal + Layout.fillHeight: true + implicitWidth: 1 + color: Appearance.m3colors.m3outlineVariant +}