mirror of
https://gitlab.linphone.org/BC/public/linphone-desktop.git
synced 2026-02-02 12:19:23 +00:00
421 lines
13 KiB
QML
421 lines
13 KiB
QML
import QtQuick 2.7
|
|
import QtQuick.Controls 2.2
|
|
import QtQuick.Layouts 1.3
|
|
|
|
import Common 1.0
|
|
import Linphone 1.0
|
|
import Linphone.Styles 1.0
|
|
import UtilsCpp 1.0
|
|
|
|
import 'Chat.js' as Logic
|
|
|
|
// =============================================================================
|
|
|
|
Rectangle {
|
|
id: container
|
|
|
|
property alias proxyModel: chat.model // ChatRoomProxyModel
|
|
property alias tryingToLoadMoreEntries : chat.tryToLoadMoreEntries
|
|
|
|
property string noticeBannerText : '' // When set, show a banner with text and hide after some time
|
|
onNoticeBannerTextChanged: if(noticeBannerText!='') messageBlock.state = "showed"
|
|
|
|
// ---------------------------------------------------------------------------
|
|
|
|
signal messageToSend (string text)
|
|
|
|
// ---------------------------------------------------------------------------
|
|
|
|
color: ChatStyle.color
|
|
|
|
ColumnLayout {
|
|
anchors.fill: parent
|
|
spacing: 0
|
|
|
|
ScrollableListView {
|
|
id: chat
|
|
|
|
// -----------------------------------------------------------------------
|
|
|
|
property bool bindToEnd: false
|
|
property bool tryToLoadMoreEntries: true
|
|
//property var sipAddressObserver: SipAddressesModel.getSipAddressObserver(proxyModel.fullPeerAddress, proxyModel.fullLocalAddress)
|
|
|
|
// -----------------------------------------------------------------------
|
|
Layout.fillHeight: true
|
|
Layout.fillWidth: true
|
|
|
|
highlightFollowsCurrentItem: false
|
|
|
|
section {
|
|
criteria: ViewSection.FullString
|
|
delegate: sectionHeading
|
|
property: '$sectionDate'
|
|
}
|
|
|
|
Timer {
|
|
id: loadMoreEntriesDelayer
|
|
interval: 1
|
|
repeat: false
|
|
running: false
|
|
|
|
onTriggered: {
|
|
chat.positionViewAtBeginning()
|
|
container.proxyModel.loadMoreEntries()
|
|
}
|
|
}
|
|
Timer {
|
|
// Delay each search by 100ms
|
|
id: endOfLoadMoreEntriesDelayer
|
|
interval: 100
|
|
repeat: false
|
|
running: false
|
|
|
|
onTriggered: {
|
|
if(chat.atYBeginning){// We are still at the beginning. Try to continue searching
|
|
loadMoreEntriesDelayer.start()
|
|
}else// We are not at the begining. New search can be done by moving to the top.
|
|
chat.tryToLoadMoreEntries = false
|
|
}
|
|
}
|
|
|
|
// -----------------------------------------------------------------------
|
|
|
|
Component.onCompleted: Logic.initView()
|
|
|
|
onContentYChanged: {
|
|
if (chat.atYBeginning && !chat.tryToLoadMoreEntries) {
|
|
chat.tryToLoadMoreEntries = true// Show busy indicator
|
|
loadMoreEntriesDelayer.start()// Let GUI time to the busy indicator to be shown
|
|
}
|
|
}
|
|
onMovementEnded: Logic.handleMovementEnded()
|
|
onMovementStarted: Logic.handleMovementStarted()
|
|
|
|
// -----------------------------------------------------------------------
|
|
|
|
Connections {
|
|
target: proxyModel
|
|
|
|
// When the view is changed (for example `Calls` -> `Messages`),
|
|
// the position is set at end and it can be possible to load
|
|
// more entries.
|
|
onEntryTypeFilterChanged: Logic.initView()
|
|
onMoreEntriesLoaded: {
|
|
Logic.handleMoreEntriesLoaded(n)
|
|
if(n>1)// New entries : delay the end
|
|
endOfLoadMoreEntriesDelayer.start()
|
|
else// No new entries, we can stop without waiting
|
|
chat.tryToLoadMoreEntries = false
|
|
}
|
|
}
|
|
|
|
// -----------------------------------------------------------------------
|
|
// Heading.
|
|
// -----------------------------------------------------------------------
|
|
|
|
Component {
|
|
id: sectionHeading
|
|
|
|
Item {
|
|
implicitHeight: container.height + ChatStyle.sectionHeading.bottomMargin
|
|
width: parent.width
|
|
|
|
Borders {
|
|
id: container
|
|
|
|
borderColor: ChatStyle.sectionHeading.border.color
|
|
bottomWidth: ChatStyle.sectionHeading.border.width
|
|
implicitHeight: text.contentHeight +
|
|
ChatStyle.sectionHeading.padding * 2 +
|
|
ChatStyle.sectionHeading.border.width * 2
|
|
topWidth: ChatStyle.sectionHeading.border.width
|
|
width: parent.width
|
|
|
|
Text {
|
|
id: text
|
|
|
|
anchors.fill: parent
|
|
color: ChatStyle.sectionHeading.text.color
|
|
font {
|
|
bold: true
|
|
pointSize: ChatStyle.sectionHeading.text.pointSize
|
|
}
|
|
horizontalAlignment: Text.AlignHCenter
|
|
verticalAlignment: Text.AlignVCenter
|
|
|
|
// Cast section to integer because Qt converts the
|
|
// sectionDate in string!!!
|
|
text: new Date(section).toLocaleDateString(
|
|
Qt.locale(App.locale)
|
|
)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// -----------------------------------------------------------------------
|
|
// Message/Event renderer.
|
|
// -----------------------------------------------------------------------
|
|
|
|
delegate: Rectangle {
|
|
id: entry
|
|
property bool isNotice : $chatEntry.type === ChatRoomModel.NoticeEntry
|
|
property bool isCall : $chatEntry.type === ChatRoomModel.CallEntry
|
|
property bool isMessage : $chatEntry.type === ChatRoomModel.MessageEntry
|
|
|
|
function isHoverEntry () {
|
|
return mouseArea.containsMouse
|
|
}
|
|
|
|
function removeEntry () {
|
|
proxyModel.removeRow(index)
|
|
}
|
|
|
|
anchors {
|
|
left: parent ? parent.left : undefined
|
|
leftMargin: isNotice?0:ChatStyle.entry.leftMargin
|
|
right: parent ? parent.right : undefined
|
|
|
|
rightMargin: isNotice?0:ChatStyle.entry.deleteIconSize +
|
|
ChatStyle.entry.message.extraContent.spacing +
|
|
ChatStyle.entry.message.extraContent.rightMargin +
|
|
ChatStyle.entry.message.extraContent.leftMargin +
|
|
ChatStyle.entry.message.outgoing.areaSize
|
|
}
|
|
|
|
color: ChatStyle.color
|
|
implicitHeight: layout.height + ChatStyle.entry.bottomMargin
|
|
|
|
// ---------------------------------------------------------------------
|
|
|
|
MouseArea {
|
|
id: mouseArea
|
|
|
|
cursorShape: Qt.ArrowCursor
|
|
hoverEnabled: true
|
|
implicitHeight: layout.height
|
|
width: parent.width + parent.anchors.rightMargin
|
|
acceptedButtons: Qt.NoButton
|
|
ColumnLayout{
|
|
id: layout
|
|
spacing: 0
|
|
width: entry.width
|
|
Text{
|
|
id:authorName
|
|
Layout.leftMargin: timeDisplay.width + 10
|
|
Layout.fillWidth: true
|
|
text : $chatEntry.fromDisplayName ? $chatEntry.fromDisplayName : ''
|
|
property var previousItem : {
|
|
if(index >0)
|
|
return proxyModel.getAt(index-1)
|
|
else
|
|
return null
|
|
}
|
|
|
|
color: ChatStyle.entry.event.text.color
|
|
font.pointSize: ChatStyle.entry.event.text.pointSize
|
|
visible: isMessage
|
|
&& $chatEntry != undefined
|
|
&& !$chatEntry.isOutgoing // Only outgoing
|
|
&& (!previousItem //No previous entry
|
|
|| previousItem.type != ChatRoomModel.MessageEntry // Previous entry is a message
|
|
|| previousItem.fromSipAddress != $chatEntry.fromSipAddress // Different user
|
|
|| (new Date(previousItem.timestamp)).setHours(0, 0, 0, 0) != (new Date($chatEntry.timestamp)).setHours(0, 0, 0, 0) // Same day == section
|
|
)
|
|
}
|
|
RowLayout {
|
|
|
|
spacing: 0
|
|
width: entry.width
|
|
|
|
// Display time.
|
|
Text {
|
|
id:timeDisplay
|
|
Layout.alignment: Qt.AlignTop
|
|
Layout.preferredHeight: ChatStyle.entry.lineHeight
|
|
Layout.preferredWidth: ChatStyle.entry.time.width
|
|
|
|
color: ChatStyle.entry.event.text.color
|
|
font.pointSize: ChatStyle.entry.time.pointSize
|
|
|
|
text: $chatEntry.timestamp.toLocaleString(
|
|
Qt.locale(App.locale),
|
|
'hh:mm'
|
|
)
|
|
|
|
verticalAlignment: Text.AlignVCenter
|
|
|
|
TooltipArea {
|
|
text: $chatEntry.timestamp.toLocaleString(Qt.locale(App.locale))
|
|
}
|
|
visible:!isNotice
|
|
}
|
|
|
|
// Display content.
|
|
Loader {
|
|
id: loader
|
|
Layout.fillWidth: true
|
|
source: Logic.getComponentFromEntry($chatEntry)
|
|
}
|
|
Connections{
|
|
target: loader.item
|
|
ignoreUnknownSignals: true
|
|
//: "Copied to clipboard" : when a user copy a text from the menu, this message show up.
|
|
onCopyAllDone: container.noticeBannerText = qsTr("allTextCopied")
|
|
//: "Selection copied to clipboard" : when a user copy a text from the menu, this message show up.
|
|
onCopySelectionDone: container.noticeBannerText = qsTr("selectedTextCopied")
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
footer: Item{
|
|
Text {
|
|
property var composers : container.proxyModel.composers
|
|
color: ChatStyle.composingText.color
|
|
font.pointSize: ChatStyle.composingText.pointSize
|
|
height: visible ? undefined : 0
|
|
leftPadding: ChatStyle.composingText.leftPadding
|
|
visible: composers.length > 0 && (!proxyModel.chatRoomModel.haveEncryption && SettingsModel.standardChatEnabled || proxyModel.chatRoomModel.haveEncryption && SettingsModel.secureChatEnabled)
|
|
wrapMode: Text.Wrap
|
|
//: '%1 is typing...' indicate that someone is composing in chat
|
|
text:(composers.length==0?'': qsTr('chatTyping','',composers.length).arg(container.proxyModel.getDisplayNameComposers()))
|
|
}
|
|
}
|
|
|
|
Rectangle{
|
|
id: messageBlock
|
|
height: 32
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
anchors.bottom: parent.bottom
|
|
anchors.leftMargin: ChatStyle.entry.leftMargin
|
|
anchors.rightMargin: ChatStyle.entry.leftMargin
|
|
anchors.bottomMargin: ChatStyle.entry.bottomMargin
|
|
color: ChatStyle.messageBanner.color
|
|
radius: 10
|
|
state: "hidden"
|
|
Timer{
|
|
id: hideNoticeBanner
|
|
interval: 4000
|
|
repeat: false
|
|
onTriggered: messageBlock.state = "hidden"
|
|
}
|
|
RowLayout{
|
|
anchors.centerIn: parent
|
|
spacing: 5
|
|
Icon{
|
|
icon: ChatStyle.copyTextIcon
|
|
overwriteColor: ChatStyle.messageBanner.textColor
|
|
iconSize: 20
|
|
}
|
|
Text{
|
|
Layout.fillHeight: true
|
|
Layout.fillWidth: true
|
|
text: container.noticeBannerText
|
|
font {
|
|
pointSize: ChatStyle.messageBanner.pointSize
|
|
}
|
|
color: ChatStyle.messageBanner.textColor
|
|
}
|
|
}
|
|
states: [
|
|
State {
|
|
name: "hidden"
|
|
PropertyChanges { target: messageBlock; opacity: 0 }
|
|
},
|
|
State {
|
|
name: "showed"
|
|
PropertyChanges { target: messageBlock; opacity: 1 }
|
|
}
|
|
]
|
|
transitions: [
|
|
Transition {
|
|
from: "*"; to: "showed"
|
|
SequentialAnimation{
|
|
NumberAnimation{ properties: "opacity"; easing.type: Easing.OutBounce; duration: 500 }
|
|
ScriptAction{ script: hideNoticeBanner.start()}
|
|
}
|
|
},
|
|
Transition {
|
|
SequentialAnimation{
|
|
NumberAnimation{ properties: "opacity"; duration: 1000 }
|
|
ScriptAction{ script: container.noticeBannerText = '' }
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Send area.
|
|
// -------------------------------------------------------------------------
|
|
|
|
Borders {
|
|
id: textAreaBorders
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: textArea.height
|
|
|
|
borderColor: ChatStyle.sendArea.border.color
|
|
topWidth: ChatStyle.sendArea.border.width
|
|
visible: proxyModel.chatRoomModel && !proxyModel.chatRoomModel.hasBeenLeft && (!proxyModel.chatRoomModel.haveEncryption && SettingsModel.standardChatEnabled || proxyModel.chatRoomModel.haveEncryption && SettingsModel.secureChatEnabled)
|
|
|
|
|
|
DroppableTextArea {
|
|
id: textArea
|
|
|
|
enabled:proxyModel && proxyModel.chatRoomModel ? !proxyModel.chatRoomModel.hasBeenLeft:false
|
|
isEphemeral : proxyModel && proxyModel.chatRoomModel ? proxyModel.chatRoomModel.ephemeralEnabled:false
|
|
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
anchors.bottom: parent.bottom
|
|
|
|
height:ChatStyle.sendArea.height + ChatStyle.sendArea.border.width
|
|
minimumHeight:ChatStyle.sendArea.height + ChatStyle.sendArea.border.width
|
|
maximumHeight:container.height/2
|
|
|
|
dropEnabled: SettingsModel.fileTransferUrl.length > 0
|
|
dropDisabledReason: qsTr('noFileTransferUrl')
|
|
placeholderText: qsTr('newMessagePlaceholder')
|
|
|
|
onDropped: Logic.handleFilesDropped(files)
|
|
onTextChanged: Logic.handleTextChanged(text)
|
|
onValidText: {
|
|
textArea.text = ''
|
|
chat.bindToEnd = true
|
|
if(proxyModel.chatRoomModel)
|
|
proxyModel.sendMessage(text)
|
|
else{
|
|
console.log("Peer : " +proxyModel.peerAddress+ "/"+chat.model.peerAddress)
|
|
proxyModel.chatRoomModel = CallsListModel.createChat(proxyModel.peerAddress)
|
|
proxyModel.sendMessage(text)
|
|
}
|
|
}
|
|
Component.onCompleted: {text = proxyModel.cachedText; cursorPosition=text.length}
|
|
Rectangle{
|
|
anchors.fill:parent
|
|
color:'white'
|
|
opacity: 0.5
|
|
visible:!textArea.enabled
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// Scroll at end if necessary.
|
|
// ---------------------------------------------------------------------------
|
|
|
|
Timer {
|
|
interval: 100
|
|
repeat: true
|
|
running: true
|
|
|
|
onTriggered: chat.bindToEnd && chat.positionViewAtEnd()
|
|
}
|
|
|
|
}
|