[#2813] Updating chat layout
Switched to StatusAppThreePanelLayout as per new design for members list Closes #2813
This commit is contained in:
parent
07142dc66b
commit
0a01e84b1c
|
@ -21,9 +21,7 @@ import "../Wallet"
|
|||
|
||||
Item {
|
||||
id: chatColumnLayout
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.minimumWidth: 300
|
||||
anchors.fill: parent
|
||||
|
||||
property alias pinnedMessagesPopupComponent: pinnedMessagesPopupComponent
|
||||
property int chatGroupsListViewCount: 0
|
||||
|
@ -46,6 +44,7 @@ Item {
|
|||
property var idMap: ({})
|
||||
property var suggestionsObj: ([])
|
||||
property Timer timer: Timer { }
|
||||
property var userList
|
||||
property var onActivated: function () {
|
||||
chatInput.textInput.forceActiveFocus(Qt.MouseFocusReason)
|
||||
}
|
||||
|
@ -305,11 +304,14 @@ Item {
|
|||
Loader {
|
||||
active: stackLayoutChatMessages.currentIndex === index
|
||||
sourceComponent: ChatMessages {
|
||||
id: chatMessages
|
||||
messageList: model.messages
|
||||
currentTime: chatColumnLayout.currentTime
|
||||
messageContextMenuInst: MessageContextMenu {
|
||||
reactionModel: EmojiReactions { }
|
||||
}
|
||||
Component.onCompleted: {
|
||||
chatColumnLayout.userList = chatMessages.messageList.userList;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,8 +14,10 @@ import "./MessageComponents"
|
|||
import "../ContactsColumn"
|
||||
import "../CommunityComponents"
|
||||
|
||||
SplitView {
|
||||
Item {
|
||||
id: svRoot
|
||||
anchors.fill: parent
|
||||
|
||||
property alias chatLogView: chatLogView
|
||||
property alias scrollToMessage: chatLogView.scrollToMessage
|
||||
|
||||
|
@ -24,21 +26,12 @@ SplitView {
|
|||
property bool loadingMessages: false
|
||||
property real scrollY: chatLogView.visibleArea.yPosition * chatLogView.contentHeight
|
||||
property int newMessages: 0
|
||||
property var currentTime
|
||||
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
handle: SplitViewHandle { implicitWidth: 5}
|
||||
|
||||
ScrollView {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
contentHeight: childrenRect.height
|
||||
contentItem: chatLogView
|
||||
|
||||
SplitView.fillWidth: true
|
||||
SplitView.minimumWidth: 200
|
||||
|
||||
height: parent.height
|
||||
ScrollBar.vertical.policy: chatLogView.contentHeight > chatLogView.height ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff
|
||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||
|
||||
|
@ -342,26 +335,6 @@ SplitView {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
property int defaultWidth: 250
|
||||
SplitView.preferredWidth: active ? defaultWidth : 0
|
||||
SplitView.minimumWidth: active ? 50 : 0
|
||||
active: showUsers && chatsModel.channelView.activeChannel.chatType !== Constants.chatTypeOneToOne
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
sourceComponent:appSettings.communitiesEnabled && chatsModel.communities.activeCommunity.active ? communityUserListComponent : userListComponent
|
||||
}
|
||||
|
||||
Component {
|
||||
id: communityUserListComponent
|
||||
CommunityUserList { }
|
||||
}
|
||||
|
||||
Component {
|
||||
id: userListComponent
|
||||
UserList { }
|
||||
}
|
||||
}
|
||||
|
||||
/*##^##
|
||||
|
|
|
@ -14,21 +14,40 @@ import "./samples/"
|
|||
import "./MessageComponents"
|
||||
import "../ContactsColumn"
|
||||
|
||||
Item {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
property var userList
|
||||
property var currentTime
|
||||
|
||||
Rectangle {
|
||||
id: userList
|
||||
|
||||
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Style.current.secondaryMenuBackground
|
||||
}
|
||||
|
||||
|
||||
StyledText {
|
||||
id: titleText
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: Style.current.padding
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: Style.current.padding
|
||||
opacity: (root.width > 50) ? 1.0 : 0.0
|
||||
visible: (opacity > 0.1)
|
||||
font.pixelSize: Style.current.primaryTextFontSize
|
||||
text: qsTr("Members")
|
||||
}
|
||||
|
||||
ListView {
|
||||
id: userListView
|
||||
anchors.fill: parent
|
||||
anchors.bottomMargin: Style.current.bigPadding
|
||||
spacing: 0
|
||||
anchors {
|
||||
left: parent.left
|
||||
top: titleText.bottom
|
||||
topMargin: Style.current.padding
|
||||
right: parent.right
|
||||
rightMargin: Style.current.halfPadding
|
||||
bottom: parent.bottom
|
||||
bottomMargin: Style.current.bigPadding
|
||||
}
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
model: userListDelegate
|
||||
}
|
||||
|
@ -36,17 +55,17 @@ Rectangle {
|
|||
DelegateModelGeneralized {
|
||||
id: userListDelegate
|
||||
lessThan: [
|
||||
function(left, right) {
|
||||
return left.lastSeen > right.lastSeen
|
||||
function (left, right) {
|
||||
return (left.lastSeen > right.lastSeen);
|
||||
}
|
||||
]
|
||||
model: messageList.userList
|
||||
model: root.userList
|
||||
delegate: User {
|
||||
publicKey: model.publicKey
|
||||
name: model.userName
|
||||
identicon: model.identicon
|
||||
lastSeen: model.lastSeen
|
||||
currentTime: svRoot.currentTime
|
||||
currentTime: root.currentTime
|
||||
}
|
||||
}
|
||||
}
|
|
@ -6,12 +6,16 @@ import "../../../shared"
|
|||
import "../../../shared/status"
|
||||
import "."
|
||||
import "components"
|
||||
import "./ChatColumn"
|
||||
import "./CommunityComponents"
|
||||
|
||||
import StatusQ.Layout 0.1
|
||||
|
||||
StatusAppTwoPanelLayout {
|
||||
StatusAppThreePanelLayout {
|
||||
id: chatView
|
||||
|
||||
handle: SplitViewHandle { implicitWidth: 5 }
|
||||
|
||||
property alias chatColumn: chatColumn
|
||||
property bool stickersLoaded: false
|
||||
property bool profilePopupOpened: false
|
||||
|
@ -31,17 +35,27 @@ StatusAppTwoPanelLayout {
|
|||
|
||||
leftPanel: Loader {
|
||||
id: contactColumnLoader
|
||||
anchors.fill: parent
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
sourceComponent: appSettings.communitiesEnabled && chatsModel.communities.activeCommunity.active ? communtiyColumnComponent : contactsColumnComponent
|
||||
}
|
||||
|
||||
rightPanel: ChatColumn {
|
||||
centerPanel: ChatColumn {
|
||||
id: chatColumn
|
||||
anchors.fill: parent
|
||||
chatGroupsListViewCount: contactColumnLoader.item.chatGroupsListViewCount
|
||||
}
|
||||
|
||||
showRightPanel: chatColumn.showUsers && (chatsModel.channelView.activeChannel.chatType !== Constants.chatTypeOneToOne)
|
||||
rightPanel: appSettings.communitiesEnabled && chatsModel.communities.activeCommunity.active ? communityUserListComponent : userListComponent
|
||||
|
||||
Component {
|
||||
id: communityUserListComponent
|
||||
CommunityUserList { currentTime: chatColumn.currentTime }
|
||||
}
|
||||
|
||||
Component {
|
||||
id: userListComponent
|
||||
UserList { currentTime: chatColumn.currentTime; userList: chatColumn.userList }
|
||||
}
|
||||
|
||||
Component {
|
||||
id: contactsColumnComponent
|
||||
ContactsColumn {
|
||||
|
|
|
@ -15,15 +15,14 @@ import "./CommunityComponents"
|
|||
|
||||
|
||||
Item {
|
||||
id: root
|
||||
width: 304
|
||||
height: parent.height
|
||||
|
||||
// TODO unhardcode
|
||||
property int chatGroupsListViewCount: communityChatListAndCategories.chatList.count
|
||||
property Component pinnedMessagesPopupComponent
|
||||
|
||||
id: root
|
||||
|
||||
Layout.fillHeight: true
|
||||
width: 304
|
||||
|
||||
StatusChatInfoToolBar {
|
||||
id: communityHeader
|
||||
anchors.top: parent.top
|
||||
|
|
|
@ -14,18 +14,42 @@ import "../ChatColumn/MessageComponents"
|
|||
import "../ChatColumn/"
|
||||
import "../ContactsColumn"
|
||||
|
||||
Rectangle {
|
||||
Item {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
property var userList
|
||||
property var currentTime
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Style.current.secondaryMenuBackground
|
||||
}
|
||||
|
||||
property QtObject community: chatsModel.communities.activeCommunity
|
||||
|
||||
id: root
|
||||
|
||||
color: Style.current.secondaryMenuBackground
|
||||
StyledText {
|
||||
id: titleText
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: Style.current.padding
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: Style.current.padding
|
||||
opacity: (root.width > 50) ? 1.0 : 0.0
|
||||
visible: (opacity > 0.1)
|
||||
font.pixelSize: Style.current.primaryTextFontSize
|
||||
text: qsTr("Members")
|
||||
}
|
||||
|
||||
ListView {
|
||||
id: userListView
|
||||
anchors.fill: parent
|
||||
anchors.bottomMargin: Style.current.bigPadding
|
||||
spacing: 0
|
||||
anchors {
|
||||
top: titleText.bottom
|
||||
topMargin: Style.current.padding
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
rightMargin: Style.current.halfPadding
|
||||
bottom: parent.bottom
|
||||
bottomMargin: Style.current.bigPadding
|
||||
}
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
model: userListDelegate
|
||||
}
|
||||
|
@ -45,8 +69,8 @@ Rectangle {
|
|||
name: !model.userName.endsWith(".eth") && !!nickname ? nickname : Utils.removeStatusEns(model.userName)
|
||||
identicon: model.identicon
|
||||
lastSeen: chatsModel.communities.activeCommunity.memberLastSeen(model.pubKey)
|
||||
currentTime: svRoot.currentTime
|
||||
statusType: chatsModel.communities.activeCommunity.memberStatus(model.pubKey)
|
||||
currentTime: root.currentTime
|
||||
}
|
||||
}
|
||||
}
|
|
@ -16,13 +16,13 @@ import StatusQ.Popups 0.1
|
|||
|
||||
Item {
|
||||
id: contactsColumn
|
||||
width: 304
|
||||
height: parent.height
|
||||
|
||||
property int chatGroupsListViewCount: channelList.chatListItems.count
|
||||
property alias searchStr: searchBox.text
|
||||
signal openProfileClicked()
|
||||
|
||||
Layout.fillHeight: true
|
||||
width: 304
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
|
|
Loading…
Reference in New Issue