feat: drawing popout now clips strokes again + add redo + add undo and redo keybinds

Drawers/Interactions.qml

@@ -1,25 +1,33 @@
 import Quickshell
 import QtQuick
 import ZShell.Config
+import ZShell.Internal
 import qs.Components
 import qs.Helpers
 import qs.Modules.Bar.Popouts
 
-Item {
+CustomMouseArea {
 	id: root
 
+	required property Drawing drawing
+	required property DrawingInput input
+
 	required property Item bar
 	required property real borderThickness
-	property bool dashboardShortcutActive
-	required property Drawing drawing
 	required property EdgeGeometry geometry
-	property bool osdShortcutActive
+
 	required property Panels panels
 	required property Wrapper popouts
+
 	required property ShellScreen screen
+	required property ScreenState screenState
+
+	property bool dashboardShortcutActive
+	property point dragStart
+	property bool osdShortcutActive
+	property bool setInitialPoint: false
 	property bool singleGestureTriggered: false
 	property bool utilitiesShortcutActive
-	required property ScreenState screenState
 
 	function inBottomPanel(panel: Item, x: real, y: real): bool {
 		const panelHeight = panel.height * (1 - (panel.offsetScale ?? 0));
@@ -56,124 +64,116 @@ Item {
 		return x >= panelX && x <= panelX + panel.width;
 	}
 
+	acceptedButtons: bar.fullscreen ? Qt.NoButton : Qt.AllButtons
 	anchors.fill: parent
+	hoverEnabled: true
 
-	DragHandler {
-		id: singleHandler
-
-		cursorShape: (active && centroid.pressPosition.y < root.bar.implicitHeight) ? Qt.ClosedHandCursor : undefined
-		dragThreshold: 0
-		enabled: !root.screenState.isDrawing
-		grabPermissions: PointerHandler.CanTakeOverFromHandlersOfSameType | PointerHandler.ApprovesTakeOverByAnything
-		maximumPointCount: 1
-		minimumPointCount: 1
-		target: null
-
-		onActiveChanged: {
-			if (!active)
-				root.singleGestureTriggered = false;
-		}
-		onCentroidChanged: {
-			const x = centroid.position.x;
-			const y = centroid.position.y;
-			const pressX = centroid.pressPosition.x;
-			const pressY = centroid.pressPosition.y;
-			const dragX = x - pressX;
-			const dragY = y - pressY;
-
-			if (pressY >= root.screen.height - Config.bar.border && pressX > root.screen.width / 5 && dragY < -Config.launcher.dragThreshold)
-				root.screenState.launcher = true;
-
-			if (root.singleGestureTriggered)
-				return;
-
-			const inDashboard = root.inTopPanel(root.panels.dashboardWrapper, pressX, pressY);
-
-			if (inDashboard && root.withinPanelWidth(root.panels.dashboardWrapper, x, y)) {
-				if (dragY > Config.dashboard.dragThreshold) {
-					root.screenState.dashboard = true;
-					root.singleGestureTriggered = true;
-				} else if (dragY < -Config.dashboard.dragThreshold) {
-					root.screenState.dashboard = false;
-					root.singleGestureTriggered = true;
-				}
+	onContainsMouseChanged: {
+		if (!containsMouse) {
+			if (!osdShortcutActive) {
+				screenState.osd = false;
+				panels.osd.hovered = false;
 			}
 
-			if (root.geometry.insetTop(root.borderThickness) > pressY && (Config.dashboard.showOnHover || !inDashboard)) {
-				if (dragY > 20) {
-					root.screenState.settings = true;
-					root.singleGestureTriggered = true;
-				} else if (dragY < -20) {
-					root.screenState.settings = false;
-					root.singleGestureTriggered = true;
-				}
+			if (!popouts.currentName.startsWith("traymenu") || Config.bar.tray.showOnHover) {
+				popouts.hasCurrent = false;
 			}
 
-			if (pressY > root.screen.height - root.geometry.insetBottom(root.borderThickness) && pressX < root.screen.width / 5 && dragY < -50)
-				root.screenState.clipboard = true;
+			if (Config.bar.autoHide || bar.fullscreen)
+				bar.isHovered = false;
 
-			if (!Config.dock.hoverToReveal && pressY > root.screen.height - root.geometry.insetTop(root.borderThickness) && pressX > root.screen.width / 5 && !root.screenState.launcher)
-				if (dragY < -10) {
-					root.screenState.dock = true;
-					root.singleGestureTriggered = true;
-				}
-
-			if (pressX > root.screen.width - Config.bar.border && pressY < (root.screen.height / 2) && dragX < -Config.sidebar.dragThreshold) {
-				root.screenState.sidebar = true;
-				root.singleGestureTriggered = true;
-			}
-
-			if (pressX >= root.screen.width - Config.bar.border && pressY > (root.screen.height / 2) && dragX < -20) {
-				Hypr.dispatch(`hl.dsp.focus({ workspace = 'r+1', on_current_monitor = true })`);
-				root.singleGestureTriggered = true;
-			}
-
-			if (pressX <= Config.bar.border && dragX > 20) {
-				Hypr.dispatch(`hl.dsp.focus({ workspace = 'r-1', on_current_monitor = true })`);
-				root.singleGestureTriggered = true;
-			}
+			if (screenState.dashboard && Config.dashboard.showOnHover)
+				screenState.dashboard = false;
 		}
 	}
+	onPositionChanged: event => {
+		const x = event.x;
+		const y = event.y;
+		const dragX = x - dragStart.x;
+		const dragY = y - dragStart.y;
 
-	PointHandler {
-		id: drawingHandler
+		if (screenState.isDrawing && !inLeftPanel(panels.drawing, x, y)) {
+			input.z = 2;
+			panels.drawing.collapse();
+		}
 
-		property bool setInitialPoint: false
+		if (root.bar.fullscreen && !root.bar.isHovered)
+			unhideTimer.start();
 
-		acceptedButtons: Qt.LeftButton | Qt.RightButton
-		enabled: root.screenState.isDrawing && (!root.inLeftPanel(root.panels.drawing, hoverHandler.point.position.x, hoverHandler.point.position.y) || !root.panels.drawing.expanded)
+		if (pressed && dragStart.y >= screen.height - Config.bar.border && dragStart.x > screen.width / 5 && dragY < -Config.launcher.dragThreshold)
+			screenState.launcher = true;
 
-		onActiveChanged: {
-			if (!active) {
-				setInitialPoint = false;
-				root.drawing.content.endStroke();
-			} else {
-				root.panels.drawing.collapse();
+		const entryAt = bar.entryAt(geometry.axisPos(x, y));
+		const showDashboard = Config.dashboard.showOnHover && inTopPanel(panels.dashboardWrapper, x, y) && (!entryAt || entryAt === "activeWindow");
+
+		if (!dashboardShortcutActive) {
+			screenState.dashboard = showDashboard;
+		} else if (showDashboard) {
+			dashboardShortcutActive = false;
+		}
+
+		if (pressed && geometry.insetTop(borderThickness) > dragStart.y && withinPanelWidth(panels.dashboardWrapper, x, y)) {
+			if (dragY > Config.dashboard.dragThreshold)
+				screenState.dashboard = true;
+			else if (dragY < -Config.dashboard.dragThreshold)
+				screenState.dashboard = false;
+		}
+
+		if (pressed && geometry.insetTop(borderThickness) > dragStart.y && !inTopPanel(panels.dashboardWrapper, dragStart.x, dragStart.y)) {
+			if (dragY > 20) {
+				screenState.settings = true;
+			} else if (dragY < -20) {
+				screenState.settings = false;
 			}
 		}
-		onPointChanged: {
-			if (!active)
-				return;
-			const x = point.position.x;
-			const y = point.position.y;
-			const origX = point.pressPosition.x;
-			const origY = point.pressPosition.y;
 
-			if (point.pressedButtons & Qt.RightButton) {
-				root.drawing.content.clear();
-				return;
+		if (pressed && dragStart.y > screen.height - geometry.insetBottom(borderThickness) && dragStart.x < screen.width / 5 && dragY < -50)
+			screenState.clipboard = true;
+
+		if (pressed && !Config.dock.hoverToReveal && dragStart.y > screen.height - geometry.insetTop(borderThickness) && dragStart.x > screen.width / 5 && !screenState.launcher)
+			if (dragY < -10)
+				screenState.dock = true;
+
+		if (pressed && dragStart.x > screen.width - Config.bar.border && dragStart.y < (screen.height / 2) && dragX < -Config.sidebar.dragThreshold)
+			screenState.sidebar = true;
+
+		if (pressed && dragStart.x >= screen.width - Config.bar.border && dragStart.y > (screen.height / 2) && dragX < -20)
+			Hypr.dispatch(`hl.dsp.focus({ workspace = 'r+1', on_current_monitor = true })`);
+
+		if (pressed && dragStart.x <= Config.bar.border && dragX > 20)
+			Hypr.dispatch(`hl.dsp.focus({ workspace = 'r-1', on_current_monitor = true })`);
+
+		if (!screenState.bar && Config.bar.autoHide && geometry.barContains(x, y, true))
+			bar.isHovered = true;
+
+		if (panels.sidebar.offsetScale === 1) {
+			const showOsd = inRightPanel(panels.osdWrapper, x, y);
+
+			if (showOsd) {
+				osdShortcutActive = false;
+				panels.osd.hovered = true;
 			}
-			if (x === 0 && y === 0 && origX === 0 && origY === 0)
-				return;
+		} else {
+			const outOfSidebar = x < width - panels.sidebar.width * (1 - panels.sidebar.offsetScale);
+			const showOsd = outOfSidebar && inRightPanel(panels.osdWrapper, x, y);
 
-			if (!setInitialPoint) {
-				setInitialPoint = true;
-				root.drawing.content.beginStroke(origX, origY);
-				return;
+			if (!osdShortcutActive) {
+				screenState.osd = showOsd;
+				panels.osd.hovered = showOsd;
+			} else if (showOsd) {
+				osdShortcutActive = false;
+				panels.osd.hovered = true;
 			}
-
-			root.drawing.content.appendPoint(x, y);
 		}
+
+		if (Config.dock.enable && Config.dock.hoverToReveal && !screenState.dock && !screenState.launcher && inBottomPanel(panels.dock, x, y))
+			screenState.dock = true;
+
+		if (geometry.barContains(x, y))
+			bar.checkPopout(geometry.axisPos(x, y));
+	}
+	onPressed: event => {
+		dragStart = Qt.point(event.x, event.y);
 	}
 
 	Timer {
@@ -184,98 +184,20 @@ Item {
 		running: false
 
 		onTriggered: {
-			if (hoverHandler.hovered)
+			if (root.containsMouse)
 				root.bar.isHovered = true;
 		}
 	}
 
-	HoverHandler {
-		id: hoverHandler
-
-		cursorShape: root.screenState.isDrawing && !root.inLeftPanel(root.panels.drawing, point.position.x, point.position.y) ? Qt.BlankCursor : undefined
-
-		onHoveredChanged: {
-			if (!hovered) {
-				if (!root.osdShortcutActive) {
-					root.screenState.osd = false;
-					root.panels.osd.hovered = false;
-				}
-
-				if (!root.popouts.currentName.startsWith("traymenu") || Config.bar.tray.showOnHover) {
-					root.popouts.hasCurrent = false;
-				}
-
-				if (Config.bar.autoHide || root.bar.fullscreen)
-					root.bar.isHovered = false;
-
-				if (root.screenState.dashboard && Config.dashboard.showOnHover)
-					root.screenState.dashboard = false;
-			}
-		}
-		onPointChanged: {
-			const x = point.position.x;
-			const y = point.position.y;
-
-			if (root.screenState.isDrawing) {
-				if (root.inLeftPanel(root.panels.drawing, x, y) && !(drawingHandler.point.pressedButtons & Qt.LeftButton)) {
-					root.panels.drawing.expand();
-					root.drawing.content.hideHover();
-					return;
-				}
-
-				root.drawing.content.showHover(x, y);
-				return;
-			}
-
-			if (!root.screenState.bar && Config.bar.autoHide && root.geometry.barContains(x, y, true))
-				root.bar.isHovered = true;
-
-			if (root.bar.fullscreen && !root.bar.isHovered)
-				unhideTimer.start();
-
-			if (root.panels.sidebar.offsetScale === 1) {
-				const showOsd = root.inRightPanel(root.panels.osdWrapper, x, y);
-
-				if (showOsd) {
-					root.osdShortcutActive = false;
-					root.panels.osd.hovered = true;
-				}
-			} else {
-				const outOfSidebar = x < root.width - root.panels.sidebar.width * (1 - root.panels.sidebar.offsetScale);
-				const showOsd = outOfSidebar && root.inRightPanel(root.panels.osdWrapper, x, y);
-
-				if (!root.osdShortcutActive) {
-					root.screenState.osd = showOsd;
-					root.panels.osd.hovered = showOsd;
-				} else if (showOsd) {
-					root.osdShortcutActive = false;
-					root.panels.osd.hovered = true;
-				}
-			}
-
-			if (Config.dock.enable && Config.dock.hoverToReveal && !root.screenState.dock && !root.screenState.launcher && root.inBottomPanel(root.panels.dock, x, y))
-				root.screenState.dock = true;
-
-			const inDashboard = root.inTopPanel(root.panels.dashboardWrapper, x, y);
-
-			if (Config.dashboard.showOnHover)
-				root.screenState.dashboard = inDashboard;
-
-			if (root.geometry.barContains(x, y))
-				root.bar.checkPopout(root.geometry.axisPos(x, y));
-		}
-	}
-
 	Connections {
-		function onDashboardChanged() {
+		function onDashboardChanged(): void {
 			if (root.screenState.dashboard) {
-				const inDashboardArea = root.inTopPanel(root.panels.dashboard, root.mouseX, root.mouseY);
+				const inDashboardArea = root.inTopPanel(root.panels.dashboardWrapper, root.mouseX, root.mouseY);
 				if (!inDashboardArea) {
 					root.dashboardShortcutActive = true;
 				}
-				if (root.panels.launcher.x + root.panels.launcher.width > root.panels.dashboardWrapper.x)
-					root.screenState.launcher = false;
 
+				root.screenState.launcher = false;
 				root.screenState.settings = false;
 				root.screenState.sidebar = false;
 				root.screenState.resources = false;
@@ -285,12 +207,15 @@ Item {
 			}
 		}
 
-		function onIsDrawingChanged() {
-			if (!root.screenState.isDrawing)
-				root.drawing.clear();
+		function onIsDrawingChanged(): void {
+			if (root.screenState.isDrawing) {
+				root.drawing.content.showHover();
+			} else {
+				root.drawing.content.clear();
+			}
 		}
 
-		function onLauncherChanged() {
+		function onLauncherChanged(): void {
 			if (!root.screenState.launcher) {
 				root.dashboardShortcutActive = false;
 				root.osdShortcutActive = false;
@@ -305,16 +230,13 @@ Item {
 			}
 
 			if (root.screenState.launcher) {
-				if (root.panels.dashboardWrapper.x < root.panels.launcher.x + root.panels.launcher.width) {
-					root.screenState.dashboard = false;
-				}
-
+				root.screenState.dashboard = false;
 				root.screenState.dock = false;
 				root.screenState.settings = false;
 			}
 		}
 
-		function onOsdChanged() {
+		function onOsdChanged(): void {
 			if (root.screenState.osd) {
 				const inOsdArea = root.inRightPanel(root.panels.osd, root.mouseX, root.mouseY);
 				if (!inOsdArea) {
@@ -325,7 +247,7 @@ Item {
 			}
 		}
 
-		function onResourcesChanged() {
+		function onResourcesChanged(): void {
 			if (root.screenState.resources) {
 				if (root.popouts.currentName.startsWith("audio") || root.popouts.currentName.startsWith("updates"))
 					root.popouts.hasCurrent = false;
@@ -335,7 +257,7 @@ Item {
 			}
 		}
 
-		function onSettingsChanged() {
+		function onSettingsChanged(): void {
 			if (root.screenState.settings) {
 				root.screenState.resources = false;
 				root.screenState.dashboard = false;
@@ -345,9 +267,10 @@ Item {
 			}
 		}
 
-		function onSidebarChanged() {
+		function onSidebarChanged(): void {
 			if (root.screenState.sidebar) {
-				root.screenState.dashboard = false;
+				if (root.panels.dashboardWrapper.x + root.panels.dashboardWrapper.width > root.panels.sidebar.x)
+					root.screenState.dashboard = false;
 				root.screenState.settings = false;
 				root.popouts.hasCurrent = false;
 			}