Use a page for invitation instead of popup

This generally work better on a mobile device
This commit is contained in:
Carl Schwan
2020-11-16 22:45:41 +00:00
parent 8c3e5b2b48
commit 28c965a40d
5 changed files with 141 additions and 183 deletions

View File

@@ -1,175 +0,0 @@
/**
* SPDX-FileCopyrightText: 2019 Black Hat <bhat@encom.eu.org>
*
* SPDX-License-Identifier: GPL-3.0-only
*/
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import org.kde.kirigami 2.13 as Kirigami
import NeoChat.Component 1.0
import NeoChat.Effect 1.0
import NeoChat.Setting 1.0
import org.kde.neochat 1.0
Dialog {
property var room
anchors.centerIn: parent
width: 360
height: Math.min(window.height - 100, 640)
id: root
title: "Invite a User"
contentItem: ColumnLayout {
spacing: 0
RowLayout {
Layout.fillWidth: true
AutoTextField {
property bool isUserID: text.match(/@(.+):(.+)/g)
Layout.fillWidth: true
id: identifierField
placeholderText: "Find a user..."
onAccepted: {
userDictListModel.search()
}
}
Button {
visible: identifierField.isUserID
text: "Add"
highlighted: true
onClicked: {
room.inviteToRoom(identifierField.text)
}
}
}
MenuSeparator {
Layout.fillWidth: true
}
AutoListView {
Layout.fillWidth: true
Layout.fillHeight: true
id: userDictListView
clip: true
spacing: 4
model: UserDirectoryListModel {
id: userDictListModel
connection: root.room.connection
keyword: identifierField.text
}
delegate: Control {
property bool inRoom: room && room.containsUser(userID)
width: userDictListView.width
height: 48
id: delegate
padding: 8
contentItem: RowLayout {
spacing: 8
Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
name: name
}
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
spacing: 0
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: name
color: MPalette.foreground
font.pixelSize: 13
textFormat: Text.PlainText
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: userID
color: MPalette.lighter
font.pixelSize: 10
textFormat: Text.PlainText
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
}
Control {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
visible: inRoom
background: RippleEffect {
circular: true
}
}
Control {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
visible: !inRoom
background: RippleEffect {
circular: true
onClicked: {
room.inviteToRoom(userID)
}
}
}
}
}
ScrollBar.vertical: ScrollBar {}
Label {
anchors.centerIn: parent
visible: userDictListView.count < 1
text: "No users available"
color: MPalette.foreground
}
}
}
onClosed: destroy()
}

View File

@@ -0,0 +1,134 @@
/**
* SPDX-FileCopyrightText: 2019 Black Hat <bhat@encom.eu.org>
*
* SPDX-License-Identifier: GPL-3.0-only
*/
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import org.kde.kirigami 2.14 as Kirigami
import org.kde.neochat 1.0
Kirigami.ScrollablePage {
id: root
property var room
parent: applicationWindow().overlay
title: i18n("Invite a User")
actions {
main: Kirigami.Action {
icon.name: "dialog-close"
text: i18nc("@action", "Cancel")
onTriggered: applicationWindow().pageStack.pop()
}
}
header: RowLayout {
Layout.fillWidth: true
Layout.margins: Kirigami.Units.largeSpacing
Kirigami.SearchField {
id: identifierField
property bool isUserID: text.match(/@(.+):(.+)/g)
Layout.fillWidth: true
placeholderText: i18n("Find a user...")
onAccepted: userDictListModel.search()
}
Button {
visible: identifierField.isUserID
text: i18n("Add")
highlighted: true
onClicked: {
room.inviteToRoom(identifierField.text)
}
}
}
ListView {
Layout.fillWidth: true
Layout.fillHeight: true
id: userDictListView
clip: true
model: UserDirectoryListModel {
id: userDictListModel
connection: root.room.connection
keyword: identifierField.text
}
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
visible: userDictListView.count < 1
text: i18n("No users available")
}
delegate: Kirigami.AbstractListItem {
id: delegate
property bool inRoom: room && room.containsUser(userID)
topPadding: Kirigami.Units.largeSpacing
bottomPadding: Kirigami.Units.largeSpacing
contentItem: RowLayout {
Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
source: avatar ? "image://mxc/" + avatar : ""
name: name
}
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
spacing: 0
Kirigami.Heading {
Layout.fillWidth: true
Layout.fillHeight: true
level: 3
text: name
textFormat: Text.PlainText
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: userID
textFormat: Text.PlainText
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
}
ToolButton {
visible: !inRoom
icon.name: "document-send"
text: i18n("Send invitation")
onClicked: {
room.inviteToRoom(userID);
applicationWindow().pageStack.pop();
}
}
}
}
}
}

View File

@@ -4,3 +4,5 @@ LoginPage 1.0 LoginPage.qml
RoomListPage 1.0 RoomListPage.qml
RoomPage 1.0 RoomPage.qml
JoinRoomPage 1.0 JoinRoomPage.qml
InviteUserPage 1.0 InviteUserPage.qml

View File

@@ -130,7 +130,10 @@ Kirigami.OverlayDrawer {
ToolButton {
icon.name: "list-add-user"
text: i18n("Invite")
onClicked: inviteUserDialog.createObject(ApplicationWindow.overlay, {"room": room}).open()
onClicked: {
applicationWindow().pageStack.push("qrc:/imports/NeoChat/Page/InviteUserPage.qml", {"room": room})
roomDrawer.close();
}
}
}
}
@@ -222,10 +225,4 @@ Kirigami.OverlayDrawer {
UserDetailDialog {}
}
Component {
id: inviteUserDialog
InviteUserDialog {}
}
}

View File

@@ -10,6 +10,7 @@
<file>imports/NeoChat/Page/RoomPage.qml</file>
<file>imports/NeoChat/Page/AccountsPage.qml</file>
<file>imports/NeoChat/Page/JoinRoomPage.qml</file>
<file>imports/NeoChat/Page/InviteUserPage.qml</file>
<file>imports/NeoChat/Component/qmldir</file>
<file>imports/NeoChat/Component/ChatTextInput.qml</file>
<file>imports/NeoChat/Component/AutoMouseArea.qml</file>
@@ -47,7 +48,6 @@
<file>imports/NeoChat/Dialog/UserDetailDialog.qml</file>
<file>imports/NeoChat/Dialog/MessageSourceDialog.qml</file>
<file>imports/NeoChat/Dialog/CreateRoomDialog.qml</file>
<file>imports/NeoChat/Dialog/InviteUserDialog.qml</file>
<file>imports/NeoChat/Dialog/AcceptInvitationDialog.qml</file>
<file>imports/NeoChat/Dialog/StartChatDialog.qml</file>
<file>imports/NeoChat/Dialog/FontFamilyDialog.qml</file>