crop region now restores correctly

Modules/Settings/Categories/Background.qml

@@ -36,8 +36,6 @@ SettingsPage {
 		}
 
 		WallpaperCropper {
-			Layout.fillWidth: true
-			Layout.preferredHeight: 600
 			screen: root.screen
 		}
 	}

Modules/Settings/Controls/WallpaperCropper.qml

@@ -14,10 +14,15 @@ RowLayout {
 	required property ShellScreen screen
 
 	Layout.fillWidth: true
+	Layout.preferredHeight: 400
 	spacing: Appearance.spacing.normal
 
 	Repeater {
-		model: Quickshell.screens
+		model: ScriptModel {
+			values: [...Quickshell.screens].sort((a, b) => {
+				return a.x - b.x;
+			})
+		}
 
 		Item {
 			id: delegate
@@ -44,25 +49,23 @@ RowLayout {
 				height: width / imageRatio
 				source: Wallpapers.current
 
-				Component.onCompleted: {
+				onPaintedWidthChanged: {
-					Hyprland.refreshMonitors();
+					if (paintedWidth > 0) {
-					// monitorScale = Hyprland.monitorFor(delegate.modelData).scale;
-				}
-				onScaleYChanged: console.log(scaleX, scaleY, "scale")
-				onStatusChanged: {
-					if (scaledImg.status == Image.Ready) {
-						console.log(scaledImg.sourceSize.width, scaledImg.sourceSize.height, scaledImg.width, scaledImg.height, delegate.modelData.width, delegate.modelData.height);
-					}
-				}
-
-				Connections {
-					function onLoaded(): void {
 						scaledImg.displayData = Wallpapers.getCrop(delegate.modelData.name);
-						cropRect.zoom = scaledImg.displayData.zoom;
+						cropRect.zoom = Wallpapers.getCrop(delegate.modelData.name).zoom;
 						cropRect.restoreFromData();
 					}
+				}
 
-					target: Wallpapers.monitorCrops
+				CustomText {
+					id: monitorId
+
+					anchors.centerIn: parent
+					color: Qt.alpha(DynamicColors.palette.m3surface, 0.85)
+					font.pointSize: Appearance.font.size.large * 4
+					style: Text.Outline
+					styleColor: DynamicColors.palette.m3onSurface
+					text: delegate.modelData.name
 				}
 
 				CustomRect {
@@ -91,22 +94,20 @@ RowLayout {
 					}
 
 					function clampToBounds() {
-						x = Math.max(imageX, Math.min(x, imageX + scaledImg.width - width));
+						x = Math.max(imageX, Math.min(x, imageX + scaledImg.paintedWidth - width));
 
-						y = Math.max(imageY, Math.min(y, imageY + scaledImg.height - height));
+						y = Math.max(imageY, Math.min(y, imageY + scaledImg.paintedHeight - height));
 					}
 
 					function restoreFromData() {
 						let data = scaledImg.displayData;
 
 						if (data && data.scaledX !== 0 || data.scaledY !== 0 || data.scaledWidth !== 0 || data.scaledHeight !== 0) {
-							console.log("true");
+							x = data.scaledX;
-							x = imageX + data.scaledX;
+							y = data.scaledY;
-							y = imageY + data.scaledY;
 
 							clampToBounds();
 						} else {
-							console.log("false");
 							zoom = 1.0;
 							centerInImage();
 						}

Modules/Wallpaper/WallBackground.qml

@@ -13,6 +13,21 @@ Item {
 	required property ShellScreen screen
 	property string source: Wallpapers.current
 
+	function refreshData(): void {
+		Hyprland.refreshMonitors();
+		const scale = Hyprland.monitorFor(root.screen).scale;
+		if (scale > 0 && img.resScale !== scale) {
+			img.resScale = scale;
+			img.sourceSize.width = root.screen.width * scale;
+		}
+		const displayData = Wallpapers.getCrop(root.screen.name);
+		const displayRect = Qt.rect(img.sourceSize.width * displayData.x, img.implicitHeight * displayData.y, img.sourceSize.width * displayData.width, img.implicitHeight * displayData.height);
+		img.anchors.fill = null;
+		img.zoom = displayData.zoom;
+		img.x = -(displayRect.x * displayData.zoom / img.resScale);
+		img.y = -(displayRect.y * displayData.zoom / img.resScale);
+	}
+
 	anchors.fill: parent
 
 	Image {
@@ -49,35 +64,19 @@ Item {
 			}
 		}
 
+		onStatusChanged: {
+			if (img.status == Image.Ready) {
+				root.refreshData();
+			}
+		}
+
 		Connections {
 			function onAdapterUpdated(): void {
-				Hyprland.refreshMonitors();
+				root.refreshData();
-				const scale = Hyprland.monitorFor(root.screen).scale;
-				if (scale > 0 && img.resScale !== scale) {
-					img.resScale = scale;
-					img.sourceSize.width = root.screen.width * scale;
-				}
-				const displayData = Wallpapers.getCrop(root.screen.name);
-				const displayRect = Qt.rect(img.sourceSize.width * displayData.x, img.implicitHeight * displayData.y, img.sourceSize.width * displayData.width, img.implicitHeight * displayData.height);
-				img.anchors.fill = null;
-				img.zoom = displayData.zoom;
-				img.x = -(displayRect.x * displayData.zoom / img.resScale);
-				img.y = -(displayRect.y * displayData.zoom / img.resScale);
 			}
 
 			function onLoaded(): void {
-				Hyprland.refreshMonitors();
+				root.refreshData();
-				const scale = Hyprland.monitorFor(root.screen).scale;
-				if (scale > 0 && img.resScale !== scale) {
-					img.resScale = scale;
-					img.sourceSize.width = root.screen.width * scale;
-				}
-				const displayData = Wallpapers.getCrop(root.screen.name);
-				const displayRect = Qt.rect(img.sourceSize.width * displayData.x, img.implicitHeight * displayData.y, img.sourceSize.width * displayData.width, img.implicitHeight * displayData.height);
-				img.anchors.fill = null;
-				img.zoom = displayData.zoom;
-				img.x = -(displayRect.x * displayData.zoom / img.resScale);
-				img.y = -(displayRect.y * displayData.zoom / img.resScale);
 			}
 
 			target: Wallpapers.monitorCrops