status-desktop/ui/app/AppLayouts/Profile/Sections/ChangeProfilePicModal.qml
Alexandra Betouni 4ee21ada05 feat(desktop) Added image function in Style
Introduced Style.svg() Style.png() Style.emoji() and
Style.icon() in Style.qml. Those should be used to
set the source in Images instead of using relative
paths. Usage:
Image {
   source: Style.svg("check)
   ....

Also moved all Singletons inside a new "utils"
folder and made it a QML module, to use
import utils 1.0 instead of relative paths

Closes #3678
2021-09-28 15:28:00 -04:00

120 lines
3.0 KiB
QML

import QtQuick 2.13
import QtQuick.Dialogs 1.3
import utils 1.0
import "../../../../shared"
import "../../../../shared/status"
ModalPopup {
property string selectedImage // selectedImage is for us to be able to analyze it before setting it as current
property string uploadError
id: popup
//% "Profile picture"
title: qsTrId("profile-picture")
onClosed: {
destroy()
}
onSelectedImageChanged: {
if (!selectedImage) {
return
}
cropImageModal.open()
}
Item {
anchors.fill: parent
RoundedImage {
id: profilePic
source: profileModel.profile.largeImage
width: 160
height: 160
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
border.width: 1
border.color: Style.current.border
onClicked: imageDialog.open()
}
StyledText {
visible: !!uploadError
text: uploadError
anchors.left: parent.left
anchors.right: parent.right
anchors.top: profilePic.bottom
horizontalAlignment: Text.AlignHCenter
font.pixelSize: 13
wrapMode: Text.WordWrap
anchors.topMargin: 13
font.weight: Font.Thin
color: Style.current.danger
}
ImageCropperModal {
id: cropImageModal
selectedImage: popup.selectedImage
ratio: "1:1"
onCropFinished: {
uploadError = profileModel.picture.upload(selectedImage, aX, aY, bX, bY)
}
}
}
footer: Item {
width: parent.width
height: uploadBtn.height
StatusButton {
visible: profileModel.profile.hasIdentityImage
type: "secondary"
flat: true
color: Style.current.danger
//% "Remove"
text: qsTrId("remove")
anchors.right: uploadBtn.left
anchors.rightMargin: Style.current.padding
anchors.bottom: parent.bottom
onClicked: {
uploadError = profileModel.picture.remove()
}
}
StatusButton {
id: uploadBtn
//% "Upload"
text: qsTrId("upload")
anchors.right: parent.right
anchors.bottom: parent.bottom
onClicked: {
imageDialog.open()
}
FileDialog {
id: imageDialog
//% "Please choose an image"
title: qsTrId("please-choose-an-image")
folder: shortcuts.pictures
nameFilters: [
//% "Image files (*.jpg *.jpeg *.png)"
qsTrId("image-files----jpg---jpeg---png-")
]
onAccepted: {
selectedImage = imageDialog.fileUrls[0]
}
}
}
}
}
/*##^##
Designer {
D{i:0;autoSize:true;height:480;width:640}
}
##^##*/