Add reactions flickable to messages (on click)

This commit is contained in:
Sebastian Wolf 2022-05-01 23:51:03 +02:00
parent 0e7ae00a67
commit 723371e9c9
No known key found for this signature in database
GPG key ID: CEA9522B5F38A90A

View file

@ -25,7 +25,8 @@ import "../js/debug.js" as Debug
ListItem { ListItem {
id: messageListItem id: messageListItem
contentHeight: messageBackground.height + Theme.paddingMedium contentHeight: messageBackground.height + Theme.paddingMedium + ( reactionsColumn.visible ? reactionsColumn.height : 0 )
Behavior on contentHeight { NumberAnimation { duration: 200 } }
property var chatId property var chatId
property var messageId property var messageId
property int messageIndex property int messageIndex
@ -62,6 +63,7 @@ ListItem {
readonly property bool showForwardMessageMenuItem: (baseContextMenuItemCount + 2) <= maxContextMenuItemCount readonly property bool showForwardMessageMenuItem: (baseContextMenuItemCount + 2) <= maxContextMenuItemCount
// And don't count "More Options..." for "Delete Message" if "Delete Message" is the only extra option // And don't count "More Options..." for "Delete Message" if "Delete Message" is the only extra option
readonly property bool haveSpaceForDeleteMessageMenuItem: (baseContextMenuItemCount + 3 - (deleteMessageIsOnlyExtraOption ? 1 : 0)) <= maxContextMenuItemCount readonly property bool haveSpaceForDeleteMessageMenuItem: (baseContextMenuItemCount + 3 - (deleteMessageIsOnlyExtraOption ? 1 : 0)) <= maxContextMenuItemCount
property var messageReactions
highlighted: (down || isSelected || additionalOptionsOpened) && !menuOpen highlighted: (down || isSelected || additionalOptionsOpened) && !menuOpen
openMenuOnPressAndHold: !messageListItem.precalculatedValues.pageIsSelecting openMenuOnPressAndHold: !messageListItem.precalculatedValues.pageIsSelecting
@ -105,9 +107,14 @@ ListItem {
} else if (webPagePreviewLoader.item) { } else if (webPagePreviewLoader.item) {
webPagePreviewLoader.item.clicked() webPagePreviewLoader.item.clicked()
} }
if (messageListItem.messageReactions) {
messageListItem.messageReactions = null;
} else {
tdLibWrapper.getMessageAvailableReactions(messageListItem.chatId, messageListItem.messageId); tdLibWrapper.getMessageAvailableReactions(messageListItem.chatId, messageListItem.messageId);
} }
} }
}
onPressAndHold: { onPressAndHold: {
if (openMenuOnPressAndHold) { if (openMenuOnPressAndHold) {
@ -226,8 +233,32 @@ ListItem {
} }
} }
onAvailableReactionsReceived: { onAvailableReactionsReceived: {
if (messageListItem.messageId === messageId) { if (messageListItem.messageId === messageId &&
pageStack.currentPage === chatPage) {
Debug.log("Available reactions for this message: " + reactions); Debug.log("Available reactions for this message: " + reactions);
messageListItem.messageReactions = reactions;
showItemCompletelyTimer.requestedIndex = index;
showItemCompletelyTimer.start();
}
}
}
Timer {
id: showItemCompletelyTimer
property int requestedIndex: (chatView.count - 1)
repeat: false
running: false
interval: 200
triggeredOnStart: false
onTriggered: {
if (requestedIndex === index) {
chatView.highlightMoveDuration = -1;
chatView.highlightResizeDuration = -1;
chatView.scrollToIndex(requestedIndex);
chatView.highlightMoveDuration = 0;
chatView.highlightResizeDuration = 0;
} }
} }
} }
@ -274,7 +305,8 @@ ListItem {
id: messageTextRow id: messageTextRow
spacing: Theme.paddingSmall spacing: Theme.paddingSmall
width: precalculatedValues.entryWidth width: precalculatedValues.entryWidth
anchors.centerIn: parent anchors.horizontalCenter: parent.horizontalCenter
y: Theme.paddingSmall
Loader { Loader {
id: profileThumbnailLoader id: profileThumbnailLoader
@ -548,7 +580,6 @@ ListItem {
} }
} }
Text { Text {
width: parent.width width: parent.width
@ -604,4 +635,59 @@ ListItem {
} }
Column {
id: reactionsColumn
width: parent.width - ( 2 * Theme.horizontalPageMargin )
anchors.top: messageTextRow.bottom
anchors.topMargin: Theme.paddingSmall
anchors.horizontalCenter: parent.horizontalCenter
visible: messageListItem.messageReactions ? ( messageListItem.messageReactions.length > 0 ? true : false ) : false
opacity: messageListItem.messageReactions ? ( messageListItem.messageReactions.length > 0 ? 1 : 0 ) : 0
Behavior on opacity { NumberAnimation {} }
spacing: Theme.paddingMedium
Flickable {
width: parent.width
height: reactionsResultRow.height + Theme.paddingSmall
anchors.horizontalCenter: parent.horizontalCenter
contentWidth: reactionsResultRow.width
clip: true
Row {
id: reactionsResultRow
spacing: Theme.paddingMedium
Repeater {
model: messageListItem.messageReactions
Item {
height: singleReactionRow.height
width: singleReactionRow.width
Row {
id: singleReactionRow
spacing: Theme.paddingSmall
Image {
id: emojiPicture
source: Emoji.getEmojiPath(modelData)
width: Theme.fontSizeLarge
height: Theme.fontSizeLarge
}
}
MouseArea {
anchors.fill: parent
onClicked: {
Debug.log("Reaction clicked: " + modelData);
messageListItem.messageReactions = null;
}
}
}
}
}
}
}
} }