status-desktop/ui/app/AppLayouts/Chat/ChatColumn/ChatMessages.qml

253 lines
8.4 KiB
QML
Raw Normal View History

2020-06-17 19:18:31 +00:00
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import QtQml.Models 2.13
import "../../../../shared"
import "../../../../imports"
2020-06-17 21:43:26 +00:00
import "../components"
2020-05-28 17:34:54 +00:00
import "./samples/"
import "./MessageComponents"
2020-05-28 22:22:51 +00:00
ScrollView {
2020-06-04 23:42:11 +00:00
id: scrollView
2020-05-28 17:34:54 +00:00
property var messageList: MessagesData {}
property var appSettings
property bool loadingMessages: false
2020-06-15 12:51:04 +00:00
property real scrollY: chatLogView.visibleArea.yPosition * chatLogView.contentHeight
2020-05-28 22:22:51 +00:00
2020-06-04 23:42:11 +00:00
contentItem: chatLogView
Layout.fillWidth: true
Layout.fillHeight: true
2020-06-08 22:34:41 +00:00
ScrollBar.vertical.policy: chatLogView.contentHeight > chatLogView.height ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff
2020-05-28 22:22:51 +00:00
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
2020-06-04 23:42:11 +00:00
ListView {
id: chatLogView
2020-06-04 23:42:11 +00:00
anchors.fill: parent
anchors.bottomMargin: Style.current.bigPadding
2020-06-04 23:42:11 +00:00
spacing: 4
2020-06-15 12:51:04 +00:00
boundsBehavior: Flickable.StopAtBounds
2020-06-04 23:42:11 +00:00
Layout.fillWidth: true
Layout.fillHeight: true
Timer {
id: timer
}
Rectangle {
id: newMessagesBox
color: Style.current.secondaryBackground
anchors.bottom: parent.bottom
anchors.right: parent.right
anchors.rightMargin: Style.current.padding
height: newMessagesText.height + clickHereText.height + 2 * Style.current.smallPadding
width: 200
radius: Style.current.radius
StyledText {
id: newMessagesText
text: qsTr("New message(s) received")
horizontalAlignment: Text.AlignHCenter
wrapMode: Text.WordWrap
anchors.left: parent.left
anchors.leftMargin: Style.current.smallPadding
anchors.right: parent.right
anchors.rightMargin: Style.current.smallPadding
anchors.top: parent.top
anchors.topMargin: Style.current.smallPadding
font.pixelSize: 15
}
StyledText {
id: clickHereText
text: qsTr("Click here to scroll back down")
horizontalAlignment: Text.AlignHCenter
wrapMode: Text.WordWrap
anchors.left: parent.left
anchors.leftMargin: Style.current.smallPadding
anchors.right: parent.right
anchors.rightMargin: Style.current.smallPadding
anchors.top: newMessagesText.bottom
anchors.topMargin: 0
font.pixelSize: 12
color: Style.current.darkGrey
}
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: {
newMessagesBox.visible = false
chatLogView.scrollToBottom(true)
}
}
}
onAtYEndChanged: {
if (chatLogView.atYEnd) {
newMessagesBox.visible = false
}
}
function scrollToBottom(force, caller) {
if (!force && !chatLogView.atYEnd) {
// User has scrolled up, we don't want to scroll back
return false
}
if (caller) {
if (caller !== chatLogView.itemAtIndex(chatLogView.count - 1)) {
// If we have a caller, only accept its request if it's the last message
return false
}
// Add a small delay because images, even though they say they say they are loaed, they aren't shown yet
timer.setTimeout(function() {
Qt.callLater(chatLogView.positionViewAtEnd)
}, 100);
return true
}
Qt.callLater(chatLogView.positionViewAtEnd)
return true
}
Connections {
target: chatsModel
onMessagesLoaded: {
loadingMessages = false;
}
onActiveChannelChanged: {
Qt.callLater(chatLogView.scrollToBottom.bind(this, true))
}
onSendingMessage: {
2020-07-23 16:23:20 +00:00
chatLogView.scrollToBottom(true)
}
onNewMessagePushed: {
if (!chatLogView.scrollToBottom()) {
newMessagesBox.visible = true
}
}
onAppReady: {
// Add an additionnal delay, since the app can be "ready" just milliseconds before the UI updated to show the chat
timer.setTimeout(function() {
chatLogView.scrollToBottom(true)
}, 500);
}
onMessageNotificationPushed: function(chatId, msg, messageType, chatType, timestamp, identicon, username) {
notificationWindow.notifyUser(chatId, msg, messageType, chatType, timestamp, identicon, username)
}
2020-06-04 19:07:07 +00:00
}
property var loadMsgs : Backpressure.oneInTime(chatLogView, 500, function() {
if(loadingMessages) return;
loadingMessages = true;
chatsModel.loadMoreMessages();
});
onContentYChanged: {
if(scrollY < 500){
loadMsgs();
}
}
2020-06-04 23:42:11 +00:00
model: messageListDelegate
2020-06-10 18:23:18 +00:00
section.property: "sectionIdentifier"
section.criteria: ViewSection.FullString
2020-06-04 23:42:11 +00:00
}
DelegateModel {
id: messageListDelegate
property var lessThan: [
2020-06-13 19:02:48 +00:00
function(left, right) { return left.clock < right.clock } // TODO: should be sorted by messageId
]
2020-05-28 22:22:51 +00:00
property int sortOrder: 0
onSortOrderChanged: items.setGroups(0, items.count, "unsorted")
2020-06-04 23:42:11 +00:00
function insertPosition(lessThan, item) {
var lower = 0
var upper = items.count
while (lower < upper) {
var middle = Math.floor(lower + (upper - lower) / 2)
var result = lessThan(item.model, items.get(middle).model);
if (result) {
upper = middle
} else {
lower = middle + 1
}
}
return lower
}
function sort(lessThan) {
while (unsortedItems.count > 0) {
var item = unsortedItems.get(0)
var index = insertPosition(lessThan, item)
item.groups = "items"
items.move(item.itemsIndex, index)
2020-05-28 22:22:51 +00:00
}
2020-06-04 23:42:11 +00:00
}
2020-06-04 23:42:11 +00:00
items.includeByDefault: false
groups: DelegateModelGroup {
id: unsortedItems
name: "unsorted"
includeByDefault: true
onChanged: {
if (messageListDelegate.sortOrder == messageListDelegate.lessThan.length)
setGroups(0, count, "items")
else {
messageListDelegate.sort(messageListDelegate.lessThan[messageListDelegate.sortOrder])
}
2020-05-28 22:22:51 +00:00
}
}
model: messageList
delegate: Message {
id: msgDelegate
fromAuthor: model.fromAuthor
chatId: model.chatId
userName: model.userName
message: model.message
plainText: model.plainText
identicon: model.identicon
isCurrentUser: model.isCurrentUser
timestamp: model.timestamp
sticker: model.sticker
contentType: model.contentType
2020-07-01 18:24:13 +00:00
outgoingStatus: model.outgoingStatus
responseTo: model.responseTo
authorCurrentMsg: msgDelegate.ListView.section
authorPrevMsg: msgDelegate.ListView.previousSection
2020-07-09 17:47:36 +00:00
profileClick: profilePopup.setPopupData.bind(profilePopup)
messageId: model.messageId
emojiReactions: model.emojiReactions
prevMessageIndex: {
// This is used in order to have access to the previous message and determine the timestamp
// we can't rely on the index because the sequence of messages is not ordered on the nim side
if(msgDelegate.DelegateModel.itemsIndex > 0){
return messageListDelegate.items.get(msgDelegate.DelegateModel.itemsIndex - 1).model.index
}
return -1;
}
appSettings: scrollView.appSettings
scrollToBottom: chatLogView.scrollToBottom
2020-07-14 15:35:21 +00:00
timeout: model.timeout
}
}
}
/*##^##
Designer {
D{i:0;autoSize:true;height:480;width:640}
}
##^##*/