RetroShare/retroshare-qml-app/src/ChatView.qml

283 lines
5.8 KiB
QML
Raw Normal View History

/*
* RetroShare Android QML App
* Copyright (C) 2016-2017 Gioacchino Mazzurco <gio@eigenlab.org>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.2
import org.retroshare.qml_components.LibresapiLocalClient 1.0
import "." //Needed for TokensManager singleton
import "./components"
2017-06-12 10:14:47 -04:00
Item
{
id: chatView
property string chatId
2017-06-12 10:14:47 -04:00
property var gxsInfo: ""
property int token: 0
property string objectName:"chatView"
function refreshData()
{
console.log("chatView.refreshData()", visible)
if(!visible) return
rsApi.request( "/chat/messages/"+chatId, "", function(par)
{
chatModel.json = par.response
token = JSON.parse(par.response).statetoken
TokensManager.registerToken(token, refreshData)
ChatCache.lastMessageCache.updateLastMessageCache(chatId, chatModel.json)
if(chatListView.visible)
{
chatListView.positionViewAtEnd()
rsApi.request("/chat/mark_chat_as_read/"+chatId)
}
} )
}
Component.onCompleted: {
refreshData()
toolBar.state = "CHATVIEW"
2017-06-12 10:14:47 -04:00
gxsInfo= ChatCache.lastMessageCache.getGxsFromChatId(chatView.chatId)
toolBar.titleText = gxsInfo.name
toolBar.loaderSource = userHash
}
onFocusChanged: focus && refreshData()
2017-06-12 10:14:47 -04:00
Component {
id: userHash
ColorHash
{
id: colorHash
hash: gxsInfo.gxs
height: toolBar.height - 4
anchors.leftMargin: 2
}
}
JSONListModel
{
id: chatModel
query: "$.data[*]"
}
ListView
{
2017-06-09 13:00:15 -04:00
property var styles: StyleChat.chat
id: chatListView
2017-06-09 13:00:15 -04:00
width: parent.width - styles.bubbleMargin
height: parent.height - inferiorPanel.height
2017-06-07 12:58:11 -04:00
anchors.horizontalCenter: parent.horizontalCenter
model: chatModel.model
2017-06-07 12:58:11 -04:00
delegate: ChatBubbleDelegate {}
2017-06-09 13:00:15 -04:00
spacing: styles.bubbleSpacing
2017-06-07 12:58:11 -04:00
preferredHighlightBegin: 1
2017-06-09 13:00:15 -04:00
onHeightChanged: {
chatListView.currentIndex = count - 1
}
}
Item {
property var styles: StyleChat.inferiorPanel
id: inferiorPanel
2017-06-09 13:00:15 -04:00
height: ( msgComposer.height > styles.height)? msgComposer.height: styles.height
width: parent.width
anchors.bottom: parent.bottom
Rectangle {
id: backgroundRectangle
anchors.fill: parent.fill
width: parent.width
height: parent.height
color:inferiorPanel.styles.backgroundColor
border.color: inferiorPanel.styles.borderColor
}
BtnIcon {
id: attachButton
property var styles: StyleChat.inferiorPanel.btnIcon
height: styles.height
width: styles.width
anchors.left: parent.left
anchors.bottom: parent.bottom
anchors.margins: styles.margin
imgUrl: styles.attachIconUrl
}
RowLayout {
id: msgComposer
property var styles: StyleChat.inferiorPanel.msgComposer
anchors.verticalCenter: parent.verticalCenter
anchors.left: attachButton.right
width: chatView.width -
(sendButton.width + sendButton.anchors.margins) -
(attachButton.width + attachButton.anchors.margins) -
(emojiButton.width + emojiButton.anchors.margins)
height: (flickable.contentHeight < styles.maxHeight)? flickable.contentHeight : styles.maxHeight
2017-06-09 13:00:15 -04:00
Flickable {
id: flickable
anchors.fill: parent
flickableDirection: Flickable.VerticalFlick
width: parent.width
contentWidth: msgField.width
contentHeight: msgField.height
contentY: contentHeight - height
ScrollBar.vertical: ScrollBar {}
clip: true
TextArea
{
property var styles: StyleChat.inferiorPanel.msgComposer
id: msgField
height: contentHeight + font.pixelSize
width: parent.width
placeholderText: styles.placeHolder
background: styles.background
wrapMode: TextEdit.Wrap
onTextChanged: {
if (msgField.length == 0)
{
sendButton.state = ""
}
else if (msgField.length > 0)
{
sendButton.state = "SENDBTN"
}
}
}
2017-06-09 13:00:15 -04:00
}
}
BtnIcon {
id: emojiButton
property var styles: StyleChat.inferiorPanel.btnIcon
height: styles.height
width: styles.width
anchors.right: sendButton.left
anchors.bottom: parent.bottom
anchors.margins: styles.margin
imgUrl: styles.emojiIconUrl
}
BtnIcon {
id: sendButton
property var styles: StyleChat.inferiorPanel.btnIcon
property alias icon: sendButton.imgUrl
height: styles.height
width: styles.width
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.margins: styles.margin
imgUrl: styles.microIconUrl
onClicked:
{
if (sendButton.state == "SENDBTN" ) {
var jsonData = {"chat_id":chatView.chatId, "msg":msgField.text}
rsApi.request( "/chat/send_message", JSON.stringify(jsonData),
function(par) { msgField.text = ""; } )
}
}
onPressed:
{
if (sendButton.state == "RECORDING" )
{
sendButton.state = ""
}
else if (sendButton.state == "" )
{
sendButton.state = "RECORDING"
}
}
onReleased:
{
if (sendButton.state == "RECORDING" )
{
sendButton.state = ""
}
}
states: [
State {
name: ""
PropertyChanges { target: sendButton; icon: styles.microIconUrl}
},
State {
name: "RECORDING"
PropertyChanges { target: sendButton; icon: styles.microMuteIconUrl}
},
State {
name: "SENDBTN"
PropertyChanges { target: sendButton; icon: styles.sendIconUrl}
}
]
}
}
}