status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(Communities): loading of new images for logo and banner 

Also rename the crop image workflow

fixes: #5961
This commit is contained in:
Stefan 2022-06-01 16:00:57 +02:00 committed by osmaczko
parent 1696fec9db
commit 93596b19ca
4 changed files with 31 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/app/AppLayouts/Onboarding/views/InsertDetailsView.qml
View File

@ -210,7 +210,7 @@ Item {
}
}
BannerCropperModal {
ImageCropWorkflow {
id: cropperModal
imageFileDialogTitle: qsTr("Choose an image for profile picture")

44
ui/imports/shared/panels/EditCroppedImagePanel.qml
View File

@ -18,15 +18,15 @@ import StatusQ.Popups 0.1
Item {
id: root
property alias source: bannerPreview.source
property alias cropRect: bannerPreview.cropRect
/*required*/ property alias aspectRatio: bannerCropperModal.aspectRatio
property alias source: croppedPreview.source
property alias cropRect: croppedPreview.cropRect
/*required*/ property alias aspectRatio: imageCropWorkflow.aspectRatio
property alias roundedImage: bannerCropperModal.roundedImage
property alias roundedImage: imageCropWorkflow.roundedImage
/*required*/ property alias imageFileDialogTitle: bannerCropperModal.imageFileDialogTitle
/*required*/ property alias title: bannerCropperModal.title
/*required*/ property alias acceptButtonText: bannerCropperModal.acceptButtonText
/*required*/ property alias imageFileDialogTitle: imageCropWorkflow.imageFileDialogTitle
/*required*/ property alias title: imageCropWorkflow.title
/*required*/ property alias acceptButtonText: imageCropWorkflow.acceptButtonText
property string dataImage: ""
@ -70,7 +70,7 @@ Item {
Layout.fillWidth: true
Layout.fillHeight: true
visible: !bannerEditor.visible
visible: !imageCropEditor.visible
StatusRoundedImage {
anchors.fill: parent
@ -81,15 +81,15 @@ Item {
showLoadingIndicator: true
border.width: 1
border.color: Style.current.border
radius: root.roundedImage ? width/2 : bannerPreview.radius
radius: root.roundedImage ? width/2 : croppedPreview.radius
}
StatusImageCrop {
id: bannerPreview
id: croppedPreview
anchors.fill: parent
visible: root.state === d.imageSelectedState
windowStyle: bannerCropperModal.windowStyle
windowStyle: imageCropWorkflow.windowStyle
wallColor: Theme.palette.statusAppLayout.backgroundColor
wallTransparency: 1
clip:true
@ -100,7 +100,7 @@ Item {
icon.name: "edit"
readonly property real rotationRadius: roundedImage ? parent.width/2 : bannerEditor.radius
readonly property real rotationRadius: roundedImage ? parent.width/2 : imageCropEditor.radius
transform: [
Translate {
x: -editButton.width/2 - d.buttonsInsideOffset
@ -119,19 +119,19 @@ Item {
]
type: StatusRoundButton.Type.Secondary
onClicked: bannerCropperModal.chooseImageToCrop()
onClicked: imageCropWorkflow.chooseImageToCrop()
}
}
Rectangle {
id: bannerEditor
id: imageCropEditor
Layout.fillWidth: true
Layout.fillHeight: true
visible: root.state === d.noImageState
radius: roundedImage ? Math.max(width, height)/2 : bannerPreview.radius
radius: roundedImage ? Math.max(width, height)/2 : croppedPreview.radius
color: Style.current.inputBackground
StatusRoundButton {
@ -139,7 +139,7 @@ Item {
icon.name: "add"
readonly property real rotationRadius: root.roundedImage ? parent.width/2 : bannerEditor.radius
readonly property real rotationRadius: root.roundedImage ? parent.width/2 : imageCropEditor.radius
transform: [
Translate {
x: -addButton.width/2 - d.buttonsInsideOffset
@ -159,16 +159,16 @@ Item {
type: StatusRoundButton.Type.Secondary
onClicked: bannerFileDialog.open()
z: bannerEditor.z + 1
onClicked: imageCropWorkflow.chooseImageToCrop()
z: imageCropEditor.z + 1
}
BannerCropperModal {
id: bannerCropperModal
ImageCropWorkflow {
id: imageCropWorkflow
onImageCropped: {
bannerPreview.source = image
bannerPreview.setCropRect(cropRect)
croppedPreview.source = image
croppedPreview.setCropRect(cropRect)
root.userSelectedImage = true
}
}

14
ui/imports/shared/popups/BannerCropperModal.qml → ui/imports/shared/popups/ImageCropWorkflow.qml
View File

@ -13,8 +13,8 @@ import utils 1.0
Item {
id: root
property alias aspectRatio: bannerCropper.aspectRatio
property alias windowStyle: bannerCropper.windowStyle
property alias aspectRatio: imageCropper.aspectRatio
property alias windowStyle: imageCropper.windowStyle
/*required*/ property string imageFileDialogTitle: ""
/*required*/ property string title: ""
/*required*/ property string acceptButtonText: ""
@ -30,11 +30,11 @@ Item {
id: fileDialog
title: root.imageFileDialogTitle
folder: root.userSelectedImage ? bannerCropper.source.substr(0, bannerCropper.source.lastIndexOf("/")) : shortcuts.pictures
folder: root.userSelectedImage ? imageCropper.source.substr(0, imageCropper.source.lastIndexOf("/")) : shortcuts.pictures
nameFilters: [qsTr("Supported image formats (%1)").arg("*.jpg *.jpeg *.jfif *.webp *.png *.heif")]
onAccepted: {
if (fileDialog.fileUrls.length > 0) {
bannerCropper.source = fileDialog.fileUrls[0]
imageCropper.source = fileDialog.fileUrls[0]
imageCropperModal.open()
}
}
@ -50,7 +50,7 @@ Item {
width: root.roundedImage ? 480 : 580
StatusImageCropPanel {
id: bannerCropper
id: imageCropper
implicitHeight: root.roundedImage ? 350 : 370
@ -71,10 +71,10 @@ Item {
StatusButton {
text: root.acceptButtonText
enabled: bannerCropper.sourceSize.width > 0 && bannerCropper.sourceSize.height > 0
enabled: imageCropper.sourceSize.width > 0 && imageCropper.sourceSize.height > 0
onClicked: {
root.imageCropped(bannerCropper.source, bannerCropper.cropRect)
root.imageCropped(imageCropper.source, imageCropper.cropRect)
imageCropperModal.close()
}
}

2
ui/imports/shared/popups/qmldir
View File

@ -15,4 +15,4 @@ UserStatusContextMenu 1.0 UserStatusContextMenu.qml
SignTransactionModal 1.0 SignTransactionModal.qml
SelectAccountModal 1.0 SelectAccountModal.qml
ProfilePopup 1.0 ProfilePopup.qml
BannerCropperModal 1.0 BannerCropperModal.qml
ImageCropWorkflow 1.0 ImageCropWorkflow.qml