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

feat(Community/Logo): use crop control for community Logo 

Note that this doesn't refactor status-go to use CroppedImage
for the community logo.

fixes: 5404
This commit is contained in:
Stefan 2022-05-23 20:36:48 +03:00 committed by Stefan Dunca
parent e7dff15a97
commit 7c74a0942d
9 changed files with 34 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/modules/main/chat_section/controller.nim
View File

@ -376,8 +376,7 @@ proc editCommunity*(
description: string,
access: int,
color: string,
imageUrl: string,
aX: int, aY: int, bX: int, bY: int,
logoJsonStr: string,
bannerJsonStr: string,
historyArchiveSupportEnabled: bool,
pinMessageAllMembersEnabled: bool) =
@ -387,8 +386,7 @@ proc editCommunity*(
description,
access,
color,
imageUrl,
aX, aY, bX, bY,
logoJsonStr,
bannerJsonStr,
historyArchiveSupportEnabled,
pinMessageAllMembersEnabled)

2
src/app/modules/main/chat_section/io_interface.nim
View File

@ -243,7 +243,7 @@ method removeUserFromCommunity*(self: AccessInterface, pubKey: string) {.base.}
method banUserFromCommunity*(self: AccessInterface, pubKey: string) {.base.} =
raise newException(ValueError, "No implementation available")
method editCommunity*(self: AccessInterface, name: string, description: string, access: int, color: string, imagePath: string, aX: int, aY: int, bX: int, bY: int, bannerJsonData: string, historyArchiveSupportEnabled: bool, pinMessageAllMembersEnabled: bool) {.base.} =
method editCommunity*(self: AccessInterface, name: string, description: string, access: int, color: string, logoJsonData: string, bannerJsonData: string, historyArchiveSupportEnabled: bool, pinMessageAllMembersEnabled: bool) {.base.} =
raise newException(ValueError, "No implementation available")
method exportCommunity*(self: AccessInterface): string {.base.} =

5
src/app/modules/main/chat_section/module.nim
View File

@ -726,12 +726,11 @@ method banUserFromCommunity*(self: Module, pubKey: string) =
method editCommunity*(self: Module, name: string, description: string,
access: int, color: string,
imagePath: string,
aX: int, aY: int, bX: int, bY: int,
logoJsonStr: string,
bannerJsonStr: string,
historyArchiveSupportEnabled: bool,
pinMessageAllMembersEnabled: bool) =
self.controller.editCommunity(name, description, access, color, imagePath, aX, aY, bX, bY, bannerJsonStr, historyArchiveSupportEnabled, pinMessageAllMembersEnabled)
self.controller.editCommunity(name, description, access, color, logoJsonStr, bannerJsonStr, historyArchiveSupportEnabled, pinMessageAllMembersEnabled)
method exportCommunity*(self: Module): string =
self.controller.exportCommunity()

4
src/app/modules/main/chat_section/view.nim
View File

@ -244,8 +244,8 @@ QtObject:
proc banUserFromCommunity*(self: View, pubKey: string) {.slot.} =
self.delegate.banUserFromCommunity(pubKey)
proc editCommunity*(self: View, name: string, description: string, access: int, color: string, imagePath: string, aX: int, aY: int, bX: int, bY: int, bannerJsonData: string, historyArchiveSupportEnabled: bool, pinMessageAllMembersEnabled: bool) {.slot.} =
self.delegate.editCommunity(name, description, access, color, imagePath, aX, aY, bX, bY, bannerJsonData, historyArchiveSupportEnabled, pinMessageAllMembersEnabled)
proc editCommunity*(self: View, name: string, description: string, access: int, color: string, logoJsonData: string, bannerJsonData: string, historyArchiveSupportEnabled: bool, pinMessageAllMembersEnabled: bool) {.slot.} =
self.delegate.editCommunity(name, description, access, color, logoJsonData, bannerJsonData, historyArchiveSupportEnabled, pinMessageAllMembersEnabled)
proc exportCommunity*(self: View): string {.slot.} =
self.delegate.exportCommunity()

14
src/app_service/service/community/service.nim
View File

@ -570,21 +570,25 @@ QtObject:
description: string,
access: int,
color: string,
imageUrl: string,
aX: int, aY: int, bX: int, bY: int,
logoJsonStr: string,
bannerJsonStr: string,
historyArchiveSupportEnabled: bool,
pinMessageAllMembersEnabled: bool) =
try:
var image = singletonInstance.utils.formatImagePath(imageUrl)
# TODO: refactor status-go to use `CroppedImage` for logo as it does for banner. This is an API breaking change, sync with mobile
let logoJson = parseJson(logoJsonStr)
let cropRectJson = logoJson["cropRect"]
let response = status_go.editCommunity(
id,
name,
description,
access,
color,
image,
aX, aY, bX, bY,
logoJson["imagePath"].getStr(),
int(cropRectJson["x"].getFloat()),
int(cropRectJson["y"].getFloat()),
int(cropRectJson["x"].getFloat() + cropRectJson["width"].getFloat()),
int(cropRectJson["y"].getFloat() + cropRectJson["height"].getFloat()),
bannerJsonStr,
historyArchiveSupportEnabled,
pinMessageAllMembersEnabled)

98
ui/app/AppLayouts/Chat/panels/communities/CommunityEditSettingsPanel.qml
View File

@ -23,12 +23,9 @@ Flickable {
property alias name: nameInput.text
property alias description: descriptionTextInput.text
property alias logoImagePath: addImageButton.selectedImage
property string logoImageData: ""
readonly property alias imageAx: imageCropperModal.aX
readonly property alias imageAy: imageCropperModal.aY
readonly property alias imageBx: imageCropperModal.bX
readonly property alias imageBy: imageCropperModal.bY
property alias logoImagePath: logoEditor.source
property alias logoCropRect: logoEditor.cropRect
property string bannerImageData: ""
property alias bannerPath: bannerEditor.source
property alias bannerCropRect: bannerEditor.cropRect
@ -97,98 +94,31 @@ Flickable {
ColumnLayout {
spacing: 8
// Logo
//
StatusBaseText {
text: qsTr("Community logo")
font.pixelSize: 15
color: Theme.palette.directColor1
}
Item {
Layout.fillWidth: true
EditCroppedImagePanel {
id: logoEditor
implicitHeight: addImageButton.height + 32
Layout.preferredWidth: 128
Layout.preferredHeight: Layout.preferredWidth / aspectRatio
Layout.alignment: Qt.AlignHCenter
Rectangle {
id: addImageButton
imageFileDialogTitle: qsTr("Choose an image as logo")
title: qsTr("Community logo")
acceptButtonText: qsTr("Make this my Community logo")
property string selectedImage: ""
anchors.centerIn: parent
color: imagePreview.visible ? "transparent" : Style.current.inputBackground
width: 128
height: width
radius: width / 2
FileDialog {
id: imageDialog
title: qsTr("Please choose an image")
folder: shortcuts.pictures
nameFilters: [qsTr("Image files (*.jpg *.jpeg *.png)")]
onAccepted: {
if(imageDialog.fileUrls.length > 0) {
addImageButton.selectedImage = imageDialog.fileUrls[0]
imageCropperModal.open()
}
}
}
Rectangle {
id: imagePreviewCropper
clip: true
width: parent.width
height: parent.height
radius: parent.width / 2
visible: !!addImageButton.selectedImage || !!root.logoImageData
Image {
id: imagePreview
visible: !!addImageButton.selectedImage || !!root.logoImageData
source: addImageButton.selectedImage
? addImageButton.selectedImage
: root.logoImageData
fillMode: Image.PreserveAspectFit
width: parent.width
height: parent.height
}
layer.enabled: true
layer.effect: OpacityMask {
maskSource: Rectangle {
anchors.centerIn: parent
width: imageCropperModal.width
height: imageCropperModal.height
radius: width / 2
}
}
}
dataImage: root.logoImageData
NoImageUploadedPanel {
anchors.centerIn: parent
visible: !imagePreview.visible
}
StatusRoundButton {
type: StatusRoundButton.Type.Secondary
icon.name: "add"
anchors.top: parent.top
anchors.right: parent.right
anchors.rightMargin: Style.current.halfPadding
highlighted: sensor.containsMouse
}
MouseArea {
id: sensor
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: imageDialog.open()
}
ImageCropperModal {
id: imageCropperModal
selectedImage: addImageButton.selectedImage
ratio: "1:1"
}
visible: !logoEditor.userSelectedImage && !root.logoImageData
}
}

1
ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
View File

@ -146,6 +146,7 @@ StackLayout {
return root.name !== name ||
root.description !== description ||
logoImagePath.length > 0 ||
isValidRect(logoCropRect) ||
root.color !== color ||
bannerPath.length > 0 ||
isValidRect(bannerCropRect) ||

6
ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
View File

@ -129,11 +129,7 @@ StatusAppTwoPanelLayout {
Utils.filterXSS(item.description),
root.community.access,
item.color.toString().toUpperCase(),
item.logoImagePath,
item.imageAx,
item.imageAy,
item.imageBx,
item.imageBy,
JSON.stringify({imagePath: String(item.logoImagePath).replace("file://", ""), cropRect: item.logoCropRect}),
JSON.stringify({imagePath: String(item.bannerPath).replace("file://", ""), cropRect: item.bannerCropRect}),
item.historyArchiveSupportToggle,
false /*TODO port the modal implementation*/

2
ui/imports/shared/popups/BannerCropperModal.qml
View File

@ -52,7 +52,7 @@ Item {
StatusImageCropPanel {
id: bannerCropper
implicitHeight: 350
implicitHeight: root.roundedImage ? 350 : 370
anchors {
fill: parent