|
|
|
@@ -4,17 +4,49 @@ import QtQuick
|
|
|
|
|
import QtQuick.Layouts
|
|
|
|
|
import Quickshell
|
|
|
|
|
import Quickshell.Hyprland
|
|
|
|
|
import ZShell.Internal
|
|
|
|
|
import qs.Config
|
|
|
|
|
import qs.Components
|
|
|
|
|
import qs.Helpers
|
|
|
|
|
|
|
|
|
|
RowLayout {
|
|
|
|
|
id: root
|
|
|
|
|
Item {
|
|
|
|
|
id: wrapper
|
|
|
|
|
|
|
|
|
|
required property ShellScreen screen
|
|
|
|
|
property bool changesMade: false
|
|
|
|
|
|
|
|
|
|
signal requestCrop
|
|
|
|
|
|
|
|
|
|
Layout.fillWidth: true
|
|
|
|
|
Layout.preferredHeight: 400
|
|
|
|
|
|
|
|
|
|
IconButton {
|
|
|
|
|
anchors.margins: Appearance.padding.normal
|
|
|
|
|
anchors.right: parent.right
|
|
|
|
|
anchors.top: parent.top
|
|
|
|
|
icon: "check"
|
|
|
|
|
opacity: wrapper.changesMade ? 1 : 0
|
|
|
|
|
scale: wrapper.changesMade ? 1 : 0
|
|
|
|
|
z: 2
|
|
|
|
|
|
|
|
|
|
Behavior on opacity {
|
|
|
|
|
Anim {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
Behavior on scale {
|
|
|
|
|
Anim {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onClicked: {
|
|
|
|
|
wrapper.requestCrop();
|
|
|
|
|
wrapper.changesMade = false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
RowLayout {
|
|
|
|
|
id: root
|
|
|
|
|
|
|
|
|
|
anchors.fill: parent
|
|
|
|
|
spacing: Appearance.spacing.normal
|
|
|
|
|
|
|
|
|
|
Repeater {
|
|
|
|
@@ -29,25 +61,81 @@ RowLayout {
|
|
|
|
|
|
|
|
|
|
required property ShellScreen modelData
|
|
|
|
|
|
|
|
|
|
function applyCrop(): void {
|
|
|
|
|
const croprect = cropRect.mapToItem(scaledImg, 0, 0, cropRect.width, cropRect.height);
|
|
|
|
|
const upscaledRect = Qt.rect((croprect.x - cropRect.imageX) / scaledImg.paintedWidth, (croprect.y - cropRect.imageY) / scaledImg.paintedHeight, croprect.width / scaledImg.paintedWidth, croprect.height / scaledImg.paintedHeight);
|
|
|
|
|
Wallpapers.setCrop(delegate.modelData.name, upscaledRect, croprect, cropRect.zoom);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function zoomClipRect(zoom: real): void {
|
|
|
|
|
let oldCenterX = cropRect.x + cropRect.width * 0.5;
|
|
|
|
|
let oldCenterY = cropRect.y + cropRect.height * 0.5;
|
|
|
|
|
|
|
|
|
|
cropRect.zoom = zoom;
|
|
|
|
|
|
|
|
|
|
cropRect.x = oldCenterX - cropRect.width * 0.5;
|
|
|
|
|
cropRect.y = oldCenterY - cropRect.height * 0.5;
|
|
|
|
|
|
|
|
|
|
cropRect.clampToBounds();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Layout.fillHeight: true
|
|
|
|
|
Layout.fillWidth: true
|
|
|
|
|
|
|
|
|
|
Image {
|
|
|
|
|
Connections {
|
|
|
|
|
function onRequestCrop(): void {
|
|
|
|
|
delegate.applyCrop();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
target: wrapper
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
RowLayout {
|
|
|
|
|
id: sliderLayout
|
|
|
|
|
|
|
|
|
|
anchors.bottom: parent.bottom
|
|
|
|
|
anchors.left: parent.left
|
|
|
|
|
anchors.right: parent.right
|
|
|
|
|
implicitHeight: 30
|
|
|
|
|
spacing: Appearance.spacing.large
|
|
|
|
|
|
|
|
|
|
CustomText {
|
|
|
|
|
text: qsTr("Crop scale")
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
CustomSlider {
|
|
|
|
|
id: zoomSlider
|
|
|
|
|
|
|
|
|
|
Layout.fillWidth: true
|
|
|
|
|
Layout.preferredHeight: 10
|
|
|
|
|
from: 1.0
|
|
|
|
|
to: 5.0
|
|
|
|
|
value: cropRect.zoom
|
|
|
|
|
|
|
|
|
|
onMoved: {
|
|
|
|
|
delegate.zoomClipRect(value);
|
|
|
|
|
wrapper.changesMade = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
CachingImage {
|
|
|
|
|
id: scaledImg
|
|
|
|
|
|
|
|
|
|
property var displayData
|
|
|
|
|
readonly property real imageRatio: scaledImg.sourceSize.width / scaledImg.sourceSize.height
|
|
|
|
|
property real monitorScale: 1.0
|
|
|
|
|
readonly property real scaleDownX: scaledImg.width / scaledImg.sourceSize.width
|
|
|
|
|
readonly property real scaleDownY: scaledImg.height / scaledImg.sourceSize.height
|
|
|
|
|
readonly property real scaleX: (scaledImg.sourceSize.width * monitorScale) / scaledImg.width
|
|
|
|
|
readonly property real scaleY: (scaledImg.sourceSize.height * monitorScale) / scaledImg.height
|
|
|
|
|
|
|
|
|
|
anchors.bottom: sliderLayout.top
|
|
|
|
|
anchors.bottomMargin: Appearance.spacing.normal
|
|
|
|
|
anchors.left: parent.left
|
|
|
|
|
anchors.right: parent.right
|
|
|
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
|
|
|
height: width / imageRatio
|
|
|
|
|
anchors.top: parent.top
|
|
|
|
|
asynchronous: true
|
|
|
|
|
fillMode: Image.PreserveAspectFit
|
|
|
|
|
// retainWhileLoading: true
|
|
|
|
|
source: Wallpapers.current
|
|
|
|
|
sourceSize.height: parent.height
|
|
|
|
|
sourceSize.width: parent.width
|
|
|
|
|
|
|
|
|
|
onPaintedWidthChanged: {
|
|
|
|
|
if (paintedWidth > 0) {
|
|
|
|
@@ -56,6 +144,9 @@ RowLayout {
|
|
|
|
|
cropRect.restoreFromData();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
onSourceChanged: cropRect.clampToBounds()
|
|
|
|
|
onStatusChanged: if (scaledImg.status == Image.Ready)
|
|
|
|
|
cropRect.clampToBounds()
|
|
|
|
|
|
|
|
|
|
CustomText {
|
|
|
|
|
id: monitorId
|
|
|
|
@@ -74,23 +165,24 @@ RowLayout {
|
|
|
|
|
property real aspectRatio: delegate.modelData.width / delegate.modelData.height
|
|
|
|
|
readonly property real baseHeight: baseWidth / aspectRatio
|
|
|
|
|
readonly property real baseWidth: {
|
|
|
|
|
let fittedHeight = scaledImg.height;
|
|
|
|
|
let fittedHeight = scaledImg.paintedHeight;
|
|
|
|
|
let fittedWidth = fittedHeight * aspectRatio;
|
|
|
|
|
|
|
|
|
|
if (fittedWidth > scaledImg.width) {
|
|
|
|
|
fittedWidth = scaledImg.width;
|
|
|
|
|
if (fittedWidth > scaledImg.paintedWidth) {
|
|
|
|
|
fittedWidth = scaledImg.paintedWidth;
|
|
|
|
|
fittedHeight = fittedWidth / aspectRatio;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return fittedWidth;
|
|
|
|
|
}
|
|
|
|
|
readonly property real imageX: (scaledImg.width - scaledImg.width) / 2
|
|
|
|
|
readonly property real imageY: (scaledImg.height - scaledImg.height) / 2
|
|
|
|
|
readonly property real imageX: (scaledImg.width - scaledImg.paintedWidth) / 2
|
|
|
|
|
readonly property real imageY: (scaledImg.height - scaledImg.paintedHeight) / 2
|
|
|
|
|
property real imgAspectRatio: scaledImg.paintedWidth / scaledImg.paintedHeight
|
|
|
|
|
property real zoom: scaledImg.displayData.zoom
|
|
|
|
|
|
|
|
|
|
function centerInImage() {
|
|
|
|
|
x = imageX + (scaledImg.width - width) / 2;
|
|
|
|
|
y = imageY + (scaledImg.height - height) / 2;
|
|
|
|
|
x = imageX + (scaledImg.paintedWidth - width) / 2;
|
|
|
|
|
y = imageY + (scaledImg.paintedHeight - height) / 2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function clampToBounds() {
|
|
|
|
@@ -113,11 +205,18 @@ RowLayout {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
border.color: "lime"
|
|
|
|
|
border.color: DynamicColors.palette.m3primary
|
|
|
|
|
border.width: 2
|
|
|
|
|
height: baseHeight / zoom
|
|
|
|
|
opacity: 1
|
|
|
|
|
width: baseWidth / zoom
|
|
|
|
|
|
|
|
|
|
Behavior on opacity {
|
|
|
|
|
Anim {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Component.onCompleted: clampToBounds()
|
|
|
|
|
onHeightChanged: clampToBounds()
|
|
|
|
|
onWidthChanged: clampToBounds()
|
|
|
|
|
}
|
|
|
|
@@ -129,9 +228,9 @@ RowLayout {
|
|
|
|
|
let nx = mouseX - cropRect.width * 0.5;
|
|
|
|
|
let ny = mouseY - cropRect.height * 0.5;
|
|
|
|
|
|
|
|
|
|
nx = Math.max(cropRect.imageX, Math.min(nx, cropRect.imageX + scaledImg.width - cropRect.width));
|
|
|
|
|
nx = Math.max(cropRect.imageX, Math.min(nx, cropRect.imageX + scaledImg.paintedWidth - cropRect.width));
|
|
|
|
|
|
|
|
|
|
ny = Math.max(cropRect.imageY, Math.min(ny, cropRect.imageY + scaledImg.height - cropRect.height));
|
|
|
|
|
ny = Math.max(cropRect.imageY, Math.min(ny, cropRect.imageY + scaledImg.paintedHeight - cropRect.height));
|
|
|
|
|
|
|
|
|
|
cropRect.x = nx;
|
|
|
|
|
cropRect.y = ny;
|
|
|
|
@@ -142,33 +241,18 @@ RowLayout {
|
|
|
|
|
preventStealing: true
|
|
|
|
|
|
|
|
|
|
onPositionChanged: mouse => {
|
|
|
|
|
if (pressed)
|
|
|
|
|
if (pressed) {
|
|
|
|
|
updateCrop(mouse.x, mouse.y);
|
|
|
|
|
wrapper.changesMade = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
onPressed: mouse => {
|
|
|
|
|
updateCrop(mouse.x, mouse.y);
|
|
|
|
|
wrapper.changesMade = true;
|
|
|
|
|
}
|
|
|
|
|
onReleased: {
|
|
|
|
|
const croprect = cropRect.mapToItem(scaledImg, 0, 0, cropRect.width, cropRect.height);
|
|
|
|
|
const upscaledRect = Qt.rect(croprect.x / scaledImg.width, croprect.y / scaledImg.height, croprect.width / scaledImg.width, croprect.height / scaledImg.height);
|
|
|
|
|
Wallpapers.setCrop(delegate.modelData.name, upscaledRect, croprect, cropRect.zoom);
|
|
|
|
|
wrapper.changesMade = true;
|
|
|
|
|
}
|
|
|
|
|
onWheel: wheel => {
|
|
|
|
|
let oldCenterX = cropRect.x + cropRect.width * 0.5;
|
|
|
|
|
let oldCenterY = cropRect.y + cropRect.height * 0.5;
|
|
|
|
|
|
|
|
|
|
if (wheel.angleDelta.y > 0)
|
|
|
|
|
cropRect.zoom *= 1.1;
|
|
|
|
|
else
|
|
|
|
|
cropRect.zoom /= 1.1;
|
|
|
|
|
|
|
|
|
|
cropRect.zoom = Math.max(1.0, Math.min(cropRect.zoom, 5.0));
|
|
|
|
|
console.log(cropRect.zoom);
|
|
|
|
|
|
|
|
|
|
cropRect.x = oldCenterX - cropRect.width * 0.5;
|
|
|
|
|
cropRect.y = oldCenterY - cropRect.height * 0.5;
|
|
|
|
|
|
|
|
|
|
cropRect.clampToBounds();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|