157 lines
4.7 KiB
QML
157 lines
4.7 KiB
QML
import QtQuick 2.13
|
|
import QtQuick.Controls 2.13
|
|
import QtQuick.Layouts 1.13
|
|
import QtQml.Models 2.14
|
|
|
|
import shared.controls 1.0
|
|
import shared.panels 1.0
|
|
import utils 1.0
|
|
|
|
import StatusQ.Components 0.1
|
|
import StatusQ.Controls 0.1
|
|
import StatusQ.Core 0.1
|
|
import StatusQ.Popups 0.1
|
|
import StatusQ.Popups.Dialog 0.1
|
|
|
|
StatusDialog {
|
|
id: root
|
|
objectName: "groupChatEdit_main"
|
|
|
|
property string activeGroupImageData
|
|
property string activeGroupColor
|
|
property string activeGroupName
|
|
|
|
signal updateGroupChatDetails(string groupName, string groupColor, string groupImage)
|
|
|
|
title: qsTr("Edit group name and image")
|
|
width: 480
|
|
height: 610
|
|
|
|
QtObject {
|
|
id: d
|
|
readonly property int nameCharLimit: 24
|
|
}
|
|
|
|
onOpened: {
|
|
groupName.input.edit.forceActiveFocus()
|
|
groupName.text = root.activeGroupName.substring(0, d.nameCharLimit)
|
|
|
|
colorSelectionGrid.selectedColor = activeGroupColor
|
|
|
|
for (let i = 0; i < colorSelectionGrid.model.length; i++) {
|
|
if(colorSelectionGrid.model[i] === root.activeGroupColor.toUpperCase())
|
|
colorSelectionGrid.selectedColorIndex = i
|
|
}
|
|
|
|
imageEditor.dataImage = activeGroupImageData
|
|
}
|
|
|
|
ColumnLayout {
|
|
anchors.fill: parent
|
|
spacing: 20
|
|
|
|
StatusInput {
|
|
id: groupName
|
|
input.edit.objectName: "groupChatEdit_name"
|
|
Layout.alignment: Qt.AlignHCenter
|
|
label: qsTr("Name the group")
|
|
charLimit: d.nameCharLimit
|
|
}
|
|
|
|
StatusBaseText {
|
|
id: imgText
|
|
text: qsTr("Group image")
|
|
leftPadding: groupName.leftPadding - root.padding
|
|
font.pixelSize: 15
|
|
}
|
|
|
|
EditCroppedImagePanel {
|
|
id: imageEditor
|
|
objectName: "groupChatEdit_image"
|
|
Layout.preferredWidth: 128
|
|
Layout.preferredHeight: Layout.preferredWidth / aspectRatio
|
|
Layout.alignment: Qt.AlignHCenter
|
|
|
|
imageFileDialogTitle: qsTr("Choose an image as logo")
|
|
title: qsTr("Edit group name and image")
|
|
acceptButtonText: qsTr("Use as an icon for this group chat")
|
|
|
|
backgroundComponent:
|
|
StatusLetterIdenticon {
|
|
id: letter
|
|
color: colorSelectionGrid.selectedColor
|
|
name: root.activeGroupName
|
|
height: 100
|
|
width: 100
|
|
letterSize: 64
|
|
|
|
StatusRoundButton {
|
|
id: addButton
|
|
|
|
icon.name: "add"
|
|
type: StatusRoundButton.Type.Secondary
|
|
|
|
transform: [
|
|
Translate {
|
|
x: -addButton.width/2 - 5
|
|
y: -addButton.height/2 + 5
|
|
},
|
|
Rotation { angle: -addRotationTransform.angle },
|
|
Rotation {
|
|
id: addRotationTransform
|
|
angle: 135
|
|
origin.x: letter.radius
|
|
},
|
|
Translate {
|
|
x: letter.width - 2 * letter.radius
|
|
y: letter.radius
|
|
}
|
|
]
|
|
|
|
onClicked: imageEditor.chooseImageToCrop()
|
|
}
|
|
}
|
|
}
|
|
|
|
StatusBaseText {
|
|
id: colorText
|
|
text: qsTr("Standard colours")
|
|
leftPadding: groupName.leftPadding - root.padding
|
|
font.pixelSize: 15
|
|
}
|
|
|
|
StatusColorSelectorGrid {
|
|
id: colorSelectionGrid
|
|
objectName: "groupChatEdit_color"
|
|
Layout.alignment: Qt.AlignHCenter
|
|
diameter: 40
|
|
selectorDiameter: 16
|
|
columns: 6
|
|
selectedColorIndex: -1
|
|
}
|
|
|
|
Item {
|
|
id: spacerItem
|
|
height: 10
|
|
}
|
|
}
|
|
|
|
footer: StatusDialogFooter {
|
|
rightButtons: ObjectModel {
|
|
StatusButton {
|
|
id: saveBtn
|
|
objectName: "groupChatEdit_save"
|
|
text: qsTr("Save changes")
|
|
enabled: groupName.text.trim().length > 0 &&
|
|
((groupName.text != root.activeGroupName) ||
|
|
(root.activeGroupColor != colorSelectionGrid.selectedColor) ||
|
|
(String(imageEditor.source).length > 0))
|
|
onClicked : {
|
|
updateGroupChatDetails(groupName.text, colorSelectionGrid.selectedColor,
|
|
Utils.getImageAndCropInfoJson(imageEditor.source, imageEditor.cropRect))
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|