feat: initial video wallpaper implementation

Modules/Settings/Common/WallpaperCropper.qml

@@ -13,7 +13,9 @@ import qs.Services
 Item {
 	id: wrapper
 
-	property int buttonRowHeight: Tokens.padding.large * 3
+	readonly property bool isVideo: Wallpapers.currentIsVideo
+	readonly property var currentScreen: screens.length > selectedScreenIndex ? screens[selectedScreenIndex] : null
+	readonly property real maxZoom: 5.0
 	readonly property bool changesMade: {
 		cropRevision;
 
@@ -25,9 +27,9 @@ Item {
 
 		return Math.abs(r.x - t.x) > 0.5 || Math.abs(r.y - t.y) > 0.5 || Math.abs(r.zoom - t.zoom) > 0.001;
 	}
+
+	property int buttonRowHeight: Tokens.padding.large * 3
 	property int cropRevision: 0
-	readonly property var currentScreen: screens.length > selectedScreenIndex ? screens[selectedScreenIndex] : null
-	readonly property real maxZoom: 5.0
 	property var screens: []
 	property int selectedScreenIndex: 0
 	property bool shouldBeActive: true
@@ -127,7 +129,7 @@ Item {
 		anchors.rightMargin: Tokens.padding.extraLarge * 2
 		anchors.top: parent.top
 
-		active: wrapper.screens.length > 1
+		active: wrapper.screens.length > 1 && !wrapper.isVideo
 
 		sourceComponent: ButtonRow {
 			id: screenSelector
@@ -163,6 +165,7 @@ Item {
 		anchors.left: parent.left
 		anchors.right: parent.right
 		implicitHeight: 30
+		enabled: !wrapper.isVideo
 
 		CustomSlider {
 			id: zoomSlider
@@ -274,7 +277,7 @@ Item {
 				opacity: status === Image.Ready ? 1 : 0
 				retainWhileLoading: true
 				smooth: true
-				source: Wallpapers.current
+				source: Wallpapers.currentThumbnail
 				sourceSize.height: {
 					const dpr = (QsWindow.window as QsWindow)?.devicePixelRatio ?? 1;
 					return imageSlot.height * dpr;
@@ -285,12 +288,37 @@ Item {
 						type: Anim.SlowEffects
 					}
 				}
+
+				Loader {
+					opacity: wrapper.isVideo && scaledImg.status === Image.Ready ? 1 : 0
+					active: opacity > 0
+					anchors.centerIn: parent
+					Behavior on opacity {
+						Anim {
+							type: Anim.SlowEffects
+						}
+					}
+
+					sourceComponent: CustomRect {
+						implicitWidth: videoIcon.implicitWidth + Tokens.padding.extraLarge * 2
+						implicitHeight: implicitWidth
+						radius: Tokens.rounding.full
+						color: Colors.tPalette.m3surface
+
+						MaterialIcon {
+							id: videoIcon
+							anchors.centerIn: parent
+							text: "video_library"
+							fontStyle: Tokens.font.icon.extraLarge
+						}
+					}
+				}
 			}
 
 			Loader {
 				id: cropRectLoader
 
-				active: scaledImg.status === Image.Ready
+				active: scaledImg.status === Image.Ready && !wrapper.isVideo
 
 				sourceComponent: Component {
 					CustomRect {
@@ -333,7 +361,6 @@ Item {
 							y = t.y;
 						}
 
-						// Where the rect should be according to saved data (same rules as a restore).
 						function savedTarget() {
 							const data = Wallpapers.getCrop(wrapper.currentScreen.name);
 							const hasCrop = data && (Math.abs(data.x) > 0.001 || Math.abs(data.y) > 0.001 || Math.abs(data.width - 1.0) > 0.001 || Math.abs(data.height - 1.0) > 0.001);
@@ -436,9 +463,10 @@ Item {
 				}
 
 				anchors.fill: parent
-				cursorShape: pressed ? Qt.ClosedHandCursor : insideCropRect(mouseX, mouseY) ? Qt.OpenHandCursor : Qt.PointingHandCursor
+				cursorShape: wrapper.isVideo ? Qt.ArrowCursor : pressed ? Qt.ClosedHandCursor : insideCropRect(mouseX, mouseY) ? Qt.OpenHandCursor : Qt.PointingHandCursor
 				hoverEnabled: true
 				preventStealing: true
+				enabled: !wrapper.isVideo
 
 				onPositionChanged: mouse => {
 					if (pressed) {