better crop region handling, but coordinate math is wrong

Helpers/UPower.qml

@@ -6,7 +6,21 @@ import Quickshell.Services.UPower
 Singleton {
 	id: root
 
+	readonly property real batteryPercent: UPower.displayDevice.percentage
 	readonly property list<UPowerDevice> devices: UPower.devices.values
 	readonly property UPowerDevice displayDevice: UPower.displayDevice
 	readonly property bool onBattery: UPower.onBattery
+	// property bool toastShown
+	//
+	// Connections {
+	// 	target: UPower
+	//
+	// 	function onPercentageChanged(): {
+	// 		if (root.batteryPercent >= 0.2 && toastShown)
+	// 			return;
+	//
+	// 		root.toastShown = true;
+	// 		Toaster.toast(qsTr("Battery "))
+	// 	}
+	// }
 }

Helpers/Wallpapers.qml

@@ -1,7 +1,9 @@
 pragma Singleton
+pragma ComponentBehavior: Bound
 
 import Quickshell
 import Quickshell.Io
+import QtQuick
 import ZShell.Models
 import qs.Config
 import qs.Modules
@@ -12,11 +14,17 @@ Searcher {
 	id: root
 
 	property string actualCurrent: WallpaperPath.currentWallpaperPath
+	property alias crops: adapter.monitorCrops
 	readonly property string current: showPreview ? previewPath : actualCurrent
+	property alias monitorCrops: monitorCrops
 	property string previewPath
 	property bool recentlyChanged
 	property bool showPreview: false
 
+	function getCrop(screen: string): var {
+		return root.crops[screen];
+	}
+
 	function preview(path: string): void {
 		previewPath = path;
 		if (Config.general.color.schemeGeneration)
@@ -24,9 +32,26 @@ Searcher {
 		showPreview = true;
 	}
 
+	function setCrop(screen: string, rect: rect, zoom: real): void {
+		let updated = Object.assign({}, root.crops);
+
+		updated[screen] = {
+			x: rect.x,
+			y: rect.y,
+			width: rect.width,
+			height: rect.height,
+			zoom: zoom
+		};
+
+		root.crops = updated;
+		monitorCrops.writeAdapter();
+		monitorCrops.reload();
+	}
+
 	function setWallpaper(path: string): void {
 		actualCurrent = path;
 		WallpaperPath.currentWallpaperPath = path;
+		Quickshell.screens.forEach(n => setCrop(n.name, Qt.rect(0, 0, 0, 0), 1.0));
 		Quickshell.execDetached(["zshell-cli", "wallpaper", "lockscreen", "--input-image", `${root.actualCurrent}`, "--output-path", `${Paths.state}/lockscreen_bg.png`, "--blur-amount", `${Config.lock.blurAmount}`]);
 		if (Config.general.color.schemeGeneration)
 			Quickshell.execDetached(["zshell-cli", "scheme", "generate", "--image-path", `${root.actualCurrent}`, "--scheme", `${Config.colors.schemeType}`, "--mode", `${Config.general.color.mode}`]);
@@ -53,6 +78,22 @@ Searcher {
 		target: "wallpaper"
 	}
 
+	FileView {
+		id: monitorCrops
+
+		path: `${Paths.state}/wallpaper-crops.json`
+		watchChanges: true
+
+		onAdapterUpdated: writeAdapter()
+		onFileChanged: reload()
+
+		JsonAdapter {
+			id: adapter
+
+			property var monitorCrops: ({})
+		}
+	}
+
 	FileSystemModel {
 		id: wallpapers
 

Modules/Settings/Categories/Background.qml

@@ -1,3 +1,4 @@
+import Quickshell
 import QtQuick.Layouts
 import qs.Modules.Settings.Controls
 import qs.Config
@@ -5,6 +6,8 @@ import qs.Config
 SettingsPage {
 	id: root
 
+	required property ShellScreen screen
+
 	SettingsSection {
 		sectionId: "Wallpaper"
 
@@ -35,6 +38,7 @@ SettingsPage {
 		WallpaperCropper {
 			Layout.fillWidth: true
 			Layout.preferredHeight: 600
+			screen: root.screen
 		}
 	}
 

Modules/Settings/Content.qml

@@ -1,3 +1,5 @@
+pragma ComponentBehavior: Bound
+
 import Quickshell
 import Quickshell.Widgets
 import QtQuick
@@ -20,7 +22,6 @@ Item {
 	required property PersistentProperties visibilities
 
 	function scrollToSetting(section: string, settingName: string) {
-		// Wait for the StackView transition to complete, then scroll
 		root.pendingSection = section;
 		root.pendingSetting = settingName;
 		scrollTimer.restart();
@@ -157,6 +158,7 @@ Item {
 		id: background
 
 		Cat.Background {
+			screen: root.screen
 		}
 	}
 

Modules/Settings/Controls/WallpaperCropper.qml

@@ -1,3 +1,5 @@
+pragma ComponentBehavior: Bound
+
 import QtQuick
 import QtQuick.Layouts
 import QtQuick.Controls
@@ -6,9 +8,29 @@ import qs.Config
 import qs.Components
 import qs.Helpers
 
-Item {
+RowLayout {
 	id: root
 
+	required property ShellScreen screen
+
+	spacing: Appearance.spacing.normal
+
+	Repeater {
+		model: Quickshell.screens
+
+		delegate: ImgCrop {
+		}
+	}
+
+	component ImgCrop: Item {
+		id: cropper
+
+		readonly property var displayData: Wallpapers.getCrop(modelData.name)
+		required property ShellScreen modelData
+
+		Layout.fillHeight: true
+		Layout.fillWidth: true
+
 		Image {
 			id: imageView
 
@@ -18,8 +40,8 @@ Item {
 			property real displayY: (height - paintedHeight) * 0.5
 			property real scaleX: sourceW / displayW
 			property real scaleY: sourceH / displayH
-		property real sourceH: Quickshell.screens[0].height
+			property real sourceH: cropper.modelData.height
-		property real sourceW: Quickshell.screens[0].width
+			property real sourceW: cropper.modelData.width
 
 			anchors.fill: parent
 			fillMode: Image.PreserveAspectFit
@@ -39,9 +61,9 @@ Item {
 			CustomRect {
 				id: cropRect
 
-			property real aspectRatio: Quickshell.screens[0].width / Quickshell.screens[0].height
+				property real aspectRatio: cropper.modelData.width / cropper.modelData.height
 				readonly property rect sourceRect: Qt.rect(x * imageView.scaleX, y * imageView.scaleY, width * imageView.scaleX, height * imageView.scaleY)
-			property real zoom: Config.background.zoom
+				property real zoom: cropper.displayData.zoom
 
 				function clampToBounds() {
 					x = Math.max(0, Math.min(x, overlay.width - width));
@@ -56,8 +78,8 @@ Item {
 				radius: Appearance.rounding.small
 				visible: imageView.status === Image.Ready
 				width: Math.min(overlay.width / zoom, overlay.height * aspectRatio / zoom)
-			x: Config.background.sourceClipX / imageView.scaleX
+				x: cropper.displayData.x / imageView.scaleX
-			y: Config.background.sourceClipY / imageView.scaleY
+				y: cropper.displayData.y / imageView.scaleY
 			}
 
 			MouseArea {
@@ -86,11 +108,12 @@ Item {
 				}
 				onReleased: {
 					Wallpapers.recentlyChanged = false;
-				Config.background.sourceClipX = cropRect.sourceRect.x;
+					Wallpapers.setCrop(cropper.modelData.name, cropRect.sourceRect, cropRect.zoom);
-				Config.background.sourceClipY = cropRect.sourceRect.y;
+					// Config.background.sourceClipX = cropRect.sourceRect.x;
-				Config.background.sourceClipW = cropRect.sourceRect.width;
+					// Config.background.sourceClipY = cropRect.sourceRect.y;
-				Config.background.sourceClipH = cropRect.sourceRect.height;
+					// Config.background.sourceClipW = cropRect.sourceRect.width;
-				Config.save();
+					// Config.background.sourceClipH = cropRect.sourceRect.height;
+					// Config.save();
 				}
 				onWheel: wheel => {
 					let oldCenterX = cropRect.x + cropRect.width * 0.5;
@@ -111,4 +134,5 @@ Item {
 				}
 			}
 		}
+	}
 }

Modules/Wallpaper/WallBackground.qml

@@ -17,26 +17,63 @@ Item {
 	Image {
 		id: img
 
-		anchors.fill: parent
 		asynchronous: true
-		fillMode: Image.PreserveAspectCrop
+		fillMode: Image.Stretch
 		opacity: 1
 		retainWhileLoading: true
 		source: root.source
-		sourceClipRect: Wallpapers.recentlyChanged ? null : Qt.rect(Config.background.sourceClipX, Config.background.sourceClipY, Config.background.sourceClipW, Config.background.sourceClipH)
 		sourceSize.height: root.screen.height
 		sourceSize.width: root.screen.width
 
-		onSourceChanged: {
+		Behavior on height {
-			if (Wallpapers.recentlyChanged) {
+			Anim {
-				Config.background.sourceClipH = 0;
-				Config.background.sourceClipW = 0;
-				Config.background.sourceClipY = 0;
-				Config.background.sourceClipX = 0;
-				Config.background.zoom = 1.0;
-				Config.save();
 			}
-			Wallpapers.recentlyChanged = true;
+		}
+		Behavior on width {
+			Anim {
+			}
+		}
+		Behavior on x {
+			Anim {
+			}
+		}
+		Behavior on y {
+			Anim {
+			}
+		}
+
+		Connections {
+			function onAdapterUpdated(): void {
+				const displayData = Wallpapers.getCrop(root.screen.name);
+				const displayRect = Qt.rect(displayData.x, displayData.y, displayData.width, displayData.height);
+				const scale = root.screen.width / displayData.width;
+				if (displayRect.width > 0 && displayRect.height > 0) {
+					img.anchors.fill = null;
+					img.x = -displayRect.x;
+					img.y = -displayRect.y;
+					img.width = img.implicitWidth * scale;
+					img.height = img.implicitHeight * scale;
+				} else {
+					img.anchors.fill = root;
+				}
+			}
+
+			function onLoaded(): void {
+				const displayData = Wallpapers.getCrop(root.screen.name);
+				const displayRect = Qt.rect(displayData.x, displayData.y, displayData.width, displayData.height);
+				const scale = root.screen.width / displayData.width;
+				if (displayRect.width > 0 && displayRect.height > 0) {
+					img.anchors.fill = null;
+					img.x = -displayRect.x;
+					img.y = -displayRect.y;
+					img.width = img.implicitWidth * scale;
+					img.height = img.implicitHeight * scale;
+				} else {
+					img.anchors.fill = root;
+				}
+			}
+
+			target: Wallpapers.monitorCrops
 		}
 	}
 }