refactor: make ChatInputButton to reduce duplication
This commit is contained in:
Jonathan Rainville
Iuri Matias
parent
d03e9807ef
commit
8ac2d66f63
|
|
@ -4,6 +4,7 @@ import QtGraphicalEffects 1.13
|
|||
import "../../../../imports"
|
||||
import "../../../../shared"
|
||||
import "../components"
|
||||
import "./ChatComponents"
|
||||
|
||||
Item {
|
||||
property int iconPadding: 6
|
||||
|
|
@ -48,12 +49,9 @@ Item {
|
|||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
property bool hovered: false
|
||||
|
||||
ChatInputButton {
|
||||
id: emojiIconContainer
|
||||
width: emojiIcon.width + chatButtonsContainer.iconPadding * 2
|
||||
height: emojiIcon.height + chatButtonsContainer.iconPadding * 2
|
||||
source: "../../../img/emojiBtn.svg"
|
||||
anchors.right: {
|
||||
if(stickerIconContainer.visible) return stickerIconContainer.left;
|
||||
if(imageIconContainer.visible) return imageIconContainer.left;
|
||||
|
|
@ -61,135 +59,44 @@ Item {
|
|||
}
|
||||
anchors.rightMargin: Style.current.padding - chatButtonsContainer.iconPadding * 2
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
radius: Style.current.radius
|
||||
color: hovered ? Style.current.secondaryBackground : Style.current.transparent
|
||||
|
||||
SVGImage {
|
||||
id: emojiIcon
|
||||
visible: txtData.length == 0
|
||||
width: 20
|
||||
height: 20
|
||||
// fillMode: Image.PreserveAspectFit
|
||||
source: "../../../img/emojiBtn.svg"
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
ColorOverlay {
|
||||
anchors.fill: emojiIcon
|
||||
source: emojiIcon
|
||||
color: emojiIconContainer.hovered || emojiPopup.opened ? Style.current.blue : Style.current.darkGrey
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: {
|
||||
emojiIconContainer.hovered = true
|
||||
}
|
||||
onExited: {
|
||||
emojiIconContainer.hovered = false
|
||||
}
|
||||
onClicked: {
|
||||
if (emojiPopup.opened) {
|
||||
opened: emojiPopup.opened
|
||||
close: function () {
|
||||
emojiPopup.close()
|
||||
} else {
|
||||
}
|
||||
open: function () {
|
||||
emojiPopup.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
property bool hovered: false
|
||||
|
||||
ChatInputButton {
|
||||
id: stickerIconContainer
|
||||
visible: !chatColumn.isExtendedInput && txtData.length == 0
|
||||
width: emojiIcon.width + chatButtonsContainer.iconPadding * 2
|
||||
height: emojiIcon.height + chatButtonsContainer.iconPadding * 2
|
||||
source: "../../../img/stickers_icon.svg"
|
||||
anchors.right: imageIconContainer.visible ? imageIconContainer.left : parent.right
|
||||
anchors.rightMargin: Style.current.padding - chatButtonsContainer.iconPadding * (imageIconContainer.visible ? 2 : 1)
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
radius: Style.current.radius
|
||||
color: hovered ? Style.current.secondaryBackground : Style.current.transparent
|
||||
|
||||
Image {
|
||||
id: stickersIcon
|
||||
width: 20
|
||||
height: 20
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: "../../../img/stickers_icon.svg"
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
}
|
||||
ColorOverlay {
|
||||
anchors.fill: stickersIcon
|
||||
source: stickersIcon
|
||||
color: stickerIconContainer.hovered || stickersPopup.opened ? Style.current.blue : Style.current.darkGrey
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: {
|
||||
stickerIconContainer.hovered = true
|
||||
}
|
||||
onExited: {
|
||||
stickerIconContainer.hovered = false
|
||||
}
|
||||
onClicked: {
|
||||
if (stickersPopup.opened) {
|
||||
opened: stickersPopup.opened
|
||||
close: function () {
|
||||
stickersPopup.close()
|
||||
} else {
|
||||
}
|
||||
open: function () {
|
||||
stickersPopup.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
property bool hovered: false
|
||||
visible: !chatColumn.isExtendedInput && (chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat || chatsModel.activeChannel.chatType === Constants.chatTypeOneToOne)
|
||||
ChatInputButton {
|
||||
id: imageIconContainer
|
||||
width: emojiIcon.width + chatButtonsContainer.iconPadding * 2
|
||||
height: emojiIcon.height + chatButtonsContainer.iconPadding * 2
|
||||
visible: !chatColumn.isExtendedInput && (chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat || chatsModel.activeChannel.chatType === Constants.chatTypeOneToOne)
|
||||
source: "../../../img/images_icon.svg"
|
||||
anchors.right: chatSendBtn.visible ? chatSendBtn.left : parent.right
|
||||
anchors.rightMargin: Style.current.padding - chatButtonsContainer.iconPadding
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
radius: Style.current.radius
|
||||
color: hovered ? Style.current.secondaryBackground : Style.current.transparent
|
||||
|
||||
Image {
|
||||
id: imageIcon
|
||||
width: 20
|
||||
height: 20
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: "../../../img/images_icon.svg"
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
}
|
||||
ColorOverlay {
|
||||
anchors.fill: imageIcon
|
||||
source: imageIcon
|
||||
color: imageIconContainer.hovered ? Style.current.blue : Style.current.darkGrey
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: {
|
||||
imageIconContainer.hovered = true
|
||||
}
|
||||
onExited: {
|
||||
imageIconContainer.hovered = false
|
||||
}
|
||||
onClicked: {
|
||||
imageDialog.open();
|
||||
opened: imageDialog.visible
|
||||
close: function () {
|
||||
imageDialog.close()
|
||||
}
|
||||
open: function () {
|
||||
imageDialog.open()
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,53 @@
|
|||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.13
|
||||
import QtGraphicalEffects 1.13
|
||||
import "../../../../../imports"
|
||||
import "../../../../../shared"
|
||||
|
||||
Rectangle {
|
||||
property url source: ""
|
||||
property bool hovered: false
|
||||
property bool opened: false
|
||||
property var close: function () {}
|
||||
property var open: function () {}
|
||||
|
||||
id: root
|
||||
width: buttonIcon.width + chatButtonsContainer.iconPadding * 2
|
||||
height: buttonIcon.height + chatButtonsContainer.iconPadding * 2
|
||||
radius: Style.current.radius
|
||||
color: hovered ? Style.current.secondaryBackground : Style.current.transparent
|
||||
|
||||
SVGImage {
|
||||
id: buttonIcon
|
||||
visible: txtData.length === 0
|
||||
source: root.source
|
||||
width: 20
|
||||
height: 20
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
ColorOverlay {
|
||||
anchors.fill: buttonIcon
|
||||
source: buttonIcon
|
||||
color: root.hovered || root.opened ? Style.current.blue : Style.current.darkGrey
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: {
|
||||
root.hovered = true
|
||||
}
|
||||
onExited: {
|
||||
root.hovered = false
|
||||
}
|
||||
onClicked: {
|
||||
if (root.opened) {
|
||||
root.close()
|
||||
} else {
|
||||
root.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -113,6 +113,7 @@ else: unix:!android: target.path = /opt/$${TARGET}/bin
|
|||
!isEmpty(target.path): INSTALLS += target
|
||||
|
||||
DISTFILES += \
|
||||
app/AppLayouts/Chat/ChatColumn/ChatComponents/ChatInputButton.qml \
|
||||
app/AppLayouts/Chat/ChatColumn/CompactMessage.qml \
|
||||
app/AppLayouts/Chat/ChatColumn/MessageComponents/ChannelIdentifier.qml \
|
||||
app/AppLayouts/Chat/ChatColumn/MessageComponents/ChatImage.qml \
|
||||
|
|
|
|||
Loading…
Reference in New Issue