Workspace overview

Panes/Overview.qml

@@ -0,0 +1,74 @@
+import QtQuick
+import Quickshell
+import Quickshell.Hyprland
+import Quickshell.Widgets
+import Quickshell.Wayland
+
+Grid {
+    id: overview
+    anchors {
+        top: parent.top
+        horizontalCenter: parent.horiontalCenter
+    }
+    spacing: 6
+    padding: 6
+    columns: 5
+    horizontalItemAlignment: Grid.AlignHCenter
+    verticalItemAlignment: Grid.AlignVCenter
+    component WorkspaceView: ClippingRectangle {
+        color: "#282828"
+        width: 192
+        radius: 8
+        topLeftRadius: modelData == 0 ? 12 : this.radius
+        topRightRadius: modelData == 4 ? 12 : this.radius
+        bottomLeftRadius: modelData == 5 ? 12 : this.radius
+        height: this.width * Hyprland.focusedMonitor?.height / Hyprland.focusedMonitor?.width
+        border {
+            width: 2
+            color: {
+                if (Hyprland.focusedWorkspace?.id == modelData + 1) {
+                    return "#ffffffff"
+                }
+                if (hover.hovered) {
+                    return "#aaffffff"
+                }
+                return "#00ffffff"
+                
+            } 
+            Behavior on color { ColorAnimation {duration: 150} }
+        }
+        required property var modelData
+        Image {
+            anchors.fill: parent
+            source: Quickshell.shellPath('assets/wallpaper')
+            fillMode: Image.PreserveAspectCrop
+        }
+        Repeater {
+            model: Hyprland.toplevels.values.filter(tl => tl.workspace?.id == modelData + 1)
+            delegate: ClippingRectangle {
+                x: modelData.lastIpcObject.at[0] / 10 - 2
+                y: modelData.lastIpcObject.at[1] / 10 - 2
+                width: modelData.lastIpcObject.size[0] / 10
+                height: modelData.lastIpcObject.size[1] / 10
+                ScreencopyView {
+                    anchors.fill: parent
+                    captureSource: modelData.wayland
+                    live: background.index == 7
+                }
+            }
+        }
+        TapHandler { onTapped: {
+            Hyprland.dispatch(`hl.dsp.focus({workspace = ${modelData + 1}})`)
+            root.close()
+        }}
+        HoverHandler { id: hover }
+    }
+    Repeater {
+        model: 9
+        WorkspaceView {}
+    }
+    WorkspaceView {
+        modelData: -100 
+        bottomRightRadius: 12
+    }
+}