diff --git a/imports/Spectral/Component/Avatar.qml b/imports/Spectral/Component/Avatar.qml
deleted file mode 100644
index 4df6a3f8f..000000000
--- a/imports/Spectral/Component/Avatar.qml
+++ /dev/null
@@ -1,56 +0,0 @@
-import QtQuick 2.12
-import QtQuick.Controls 2.12
-import QtGraphicalEffects 1.0
-
-import Spectral.Setting 0.1
-
-Item {
- property string hint: "H"
- property string source: ""
- property color color: MPalette.accent
- readonly property url realSource: source ? "image://mxc/" + source : ""
-
- id: root
-
- Image {
- anchors.fill: parent
-
- id: image
- visible: realSource
- source: width < 1 ? "" : realSource
- sourceSize.width: width
- sourceSize.height: width
- fillMode: Image.PreserveAspectCrop
- mipmap: true
- layer.enabled: true
- layer.effect: OpacityMask {
- maskSource: Rectangle {
- width: image.width
- height: image.width
-
- radius: width / 2
- }
- }
- }
-
- Rectangle {
- anchors.fill: parent
-
- visible: !realSource || image.status != Image.Ready
-
- radius: height / 2
- color: root.color
- antialiasing: true
-
- Label {
- anchors.centerIn: parent
-
- color: "white"
- text: hint[0].toUpperCase()
- font.pixelSize: root.width / 2
- font.weight: Font.Medium
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- }
- }
-}
diff --git a/imports/Spectral/Component/Timeline/AudioDelegate.qml b/imports/Spectral/Component/Timeline/AudioDelegate.qml
index 87d2a9119..cb537b609 100644
--- a/imports/Spectral/Component/Timeline/AudioDelegate.qml
+++ b/imports/Spectral/Component/Timeline/AudioDelegate.qml
@@ -5,6 +5,7 @@ import QtQuick.Controls.Material 2.12
import QtGraphicalEffects 1.0
import Qt.labs.platform 1.0 as Platform
import QtMultimedia 5.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral 0.1
import Spectral.Setting 0.1
@@ -25,14 +26,14 @@ RowLayout {
z: -5
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 36
Layout.preferredHeight: 36
Layout.alignment: Qt.AlignBottom
visible: avatarVisible
- hint: author.displayName
- source: author.avatarMediaId
+ name: author.displayName
+ source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
color: author.color
Component {
diff --git a/imports/Spectral/Component/Timeline/FileDelegate.qml b/imports/Spectral/Component/Timeline/FileDelegate.qml
index 997ff895e..f333079e0 100644
--- a/imports/Spectral/Component/Timeline/FileDelegate.qml
+++ b/imports/Spectral/Component/Timeline/FileDelegate.qml
@@ -4,6 +4,7 @@ import QtQuick.Layouts 1.12
import QtQuick.Controls.Material 2.12
import QtGraphicalEffects 1.0
import Qt.labs.platform 1.0 as Platform
+import org.kde.kirigami 2.13 as Kirigami
import Spectral 0.1
import Spectral.Setting 0.1
@@ -29,14 +30,14 @@ RowLayout {
z: -5
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 36
Layout.preferredHeight: 36
Layout.alignment: Qt.AlignBottom
visible: avatarVisible
- hint: author.displayName
- source: author.avatarMediaId
+ name: author.displayName
+ source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
color: author.color
Component {
diff --git a/imports/Spectral/Component/Timeline/MessageDelegate.qml b/imports/Spectral/Component/Timeline/MessageDelegate.qml
index 7ee6de063..06ff02ec6 100644
--- a/imports/Spectral/Component/Timeline/MessageDelegate.qml
+++ b/imports/Spectral/Component/Timeline/MessageDelegate.qml
@@ -1,8 +1,9 @@
import QtQuick 2.12
import QtQuick.Controls 2.12 as Controls
import QtQuick.Layouts 1.12
+import QtGraphicalEffects 1.12
-import org.kde.kirigami 2.4 as Kirigami
+import org.kde.kirigami 2.13 as Kirigami
import Spectral 0.1
import Spectral.Setting 0.1
@@ -25,15 +26,15 @@ RowLayout {
spacing: Kirigami.Units.largeSpacing
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
Layout.alignment: Qt.AlignTop
visible: showAuthor
- hint: author.displayName
- source: author.avatarMediaId
+ name: author.displayName
+ source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
color: author.color
}
@@ -43,71 +44,92 @@ RowLayout {
visible: !showAuthor
}
+
+ Item {
+ Layout.preferredWidth: column.width + 16
+ Layout.preferredHeight: column.height + 16
- ColumnLayout {
- Layout.fillWidth: true
+ /*RectangularGlow {
+ anchors.fill: messageBubble
+ glowRadius: 0.8
+ spread: 0.3
+ cornerRadius: messageBubble.radius + glowRadius
+ color: Qt.darker(messageBubble.color, 1.2)
+ }*/
+
+ // inner area of the message bubble
+ /*Rectangle {
+ id: messageBubble
+ anchors.fill: parent
+ radius: 2
+ color: authorColor
+ }*/
- id: column
- spacing: Kirigami.Units.smallSpacing
-
- Controls.Label {
+ ColumnLayout {
+ id: column
Layout.fillWidth: true
+ anchors.centerIn: parent
+ spacing: Kirigami.Units.smallSpacing
- visible: showAuthor
-
- text: author.displayName
- font.bold: true
- color: Kirigami.Theme.activeTextColor
- wrapMode: Text.Wrap
- }
-
- RowLayout {
- Layout.fillWidth: true
-
- visible: replyVisible
-
- Rectangle {
- Layout.preferredWidth: 4
- Layout.fillHeight: true
-
- color: Kirigami.Theme.highlightColor
- }
-
- Avatar {
- Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
- Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
- Layout.alignment: Qt.AlignTop
-
- source: replyVisible ? reply.author.avatarMediaId : ""
- hint: replyVisible ? reply.author.displayName : "H"
- color: replyVisible ? reply.author.color : MPalette.accent
- }
-
- ColumnLayout {
+ Controls.Label {
Layout.fillWidth: true
- Controls.Label {
- Layout.fillWidth: true
+ visible: showAuthor
- text: replyVisible ? reply.author.displayName : ""
- color: Kirigami.Theme.activeTextColor
- wrapMode: Text.Wrap
+ text: author.displayName
+ font.bold: true
+ color: Kirigami.Theme.activeTextColor
+ wrapMode: Text.Wrap
+ }
+
+ RowLayout {
+ Layout.fillWidth: true
+
+ visible: replyVisible
+
+ Rectangle {
+ Layout.preferredWidth: 4
+ Layout.fillHeight: true
+
+ color: Kirigami.Theme.highlightColor
}
- Text {
+ Kirigami.Avatar {
+ Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
+ Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
+ Layout.alignment: Qt.AlignTop
+
+ source: replyVisible && reply.author.avatarMediaId ? "image://mxc/" + reply.author.avatarMediaId : ""
+ name: replyVisible ? reply.author.displayName : "H"
+ color: replyVisible ? reply.author.color : MPalette.accent
+ }
+
+ ColumnLayout {
Layout.fillWidth: true
- text: "" + (replyVisible ? reply.display : "")
+ Controls.Label {
+ Layout.fillWidth: true
- color: Kirigami.Theme.textColor
-// selectionColor: Kirigami.Theme.highlightColor
-// selectedTextColor: Kirigami.Theme.highlightedTextColor
+ text: replyVisible ? reply.author.displayName : ""
+ color: Kirigami.Theme.activeTextColor
+ wrapMode: Text.Wrap
+ }
-// selectByMouse: true
-// readOnly: true
- wrapMode: Text.WrapAtWordBoundaryOrAnywhere
- textFormat: Text.RichText
+ Text {
+ Layout.fillWidth: true
+
+ text: replyVisible ? reply.display : ""
+
+ color: Kirigami.Theme.textColor
+ // selectionColor: Kirigami.Theme.highlightColor
+ // selectedTextColor: Kirigami.Theme.highlightedTextColor
+
+ // selectByMouse: true
+ // readOnly: true
+ wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+ textFormat: Text.RichText
+ }
}
}
}
diff --git a/imports/Spectral/Component/Timeline/StateDelegate.qml b/imports/Spectral/Component/Timeline/StateDelegate.qml
index 544267396..8325fb405 100644
--- a/imports/Spectral/Component/Timeline/StateDelegate.qml
+++ b/imports/Spectral/Component/Timeline/StateDelegate.qml
@@ -2,6 +2,7 @@ import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls.Material 2.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Dialog 2.0
@@ -11,11 +12,11 @@ import Spectral.Setting 0.1
RowLayout {
id: row
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 24
Layout.preferredHeight: 24
- hint: author.displayName
+ name: author.displayName
source: author.avatarMediaId
color: author.color
diff --git a/imports/Spectral/Component/Timeline/TimelineContainer.qml b/imports/Spectral/Component/Timeline/TimelineContainer.qml
index 97b7dc50b..d1fdd3510 100644
--- a/imports/Spectral/Component/Timeline/TimelineContainer.qml
+++ b/imports/Spectral/Component/Timeline/TimelineContainer.qml
@@ -7,18 +7,12 @@ import org.kde.kirigami 2.4 as Kirigami
Item {
default property alias innerObject : column.children
- readonly property int horizontalPadding: Kirigami.Units.largeSpacing
- readonly property int verticalPadding: Kirigami.Units.smallSpacing
-
- height: column.implicitHeight + verticalPadding * 2
+ height: column.implicitHeight
ColumnLayout {
- x: horizontalPadding
- y: verticalPadding
-
- width: parent.width - horizontalPadding * 2
-
id: column
+ x: horizontalPadding
+ width: parent.width - Kirigami.Units.largeSpacing * 2
SectionDelegate {
Layout.maximumWidth: parent.width
@@ -27,10 +21,4 @@ Item {
visible: showSection
}
}
-
- Controls.ItemDelegate {
- anchors.fill: parent
-
- z: -1
- }
}
diff --git a/imports/Spectral/Component/Timeline/VideoDelegate.qml b/imports/Spectral/Component/Timeline/VideoDelegate.qml
index bd22120c6..3967d875e 100644
--- a/imports/Spectral/Component/Timeline/VideoDelegate.qml
+++ b/imports/Spectral/Component/Timeline/VideoDelegate.qml
@@ -5,6 +5,7 @@ import QtQuick.Controls.Material 2.12
import QtGraphicalEffects 1.0
import QtMultimedia 5.12
import Qt.labs.platform 1.0 as Platform
+import org.kde.kirigami 2.13 as Kirigami
import Spectral 0.1
import Spectral.Setting 0.1
@@ -46,14 +47,14 @@ RowLayout {
}
}
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 36
Layout.preferredHeight: 36
Layout.alignment: Qt.AlignBottom
visible: avatarVisible
- hint: author.displayName
- source: author.avatarMediaId
+ name: author.displayName
+ source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
color: author.color
Component {
diff --git a/imports/Spectral/Component/qmldir b/imports/Spectral/Component/qmldir
index dd821c5c3..4ec3b1ecd 100644
--- a/imports/Spectral/Component/qmldir
+++ b/imports/Spectral/Component/qmldir
@@ -5,6 +5,5 @@ SideNavButton 2.0 SideNavButton.qml
ScrollHelper 2.0 ScrollHelper.qml
AutoListView 2.0 AutoListView.qml
AutoTextField 2.0 AutoTextField.qml
-Avatar 2.0 Avatar.qml
FullScreenImage 2.0 FullScreenImage.qml
AutoRectangle 2.0 AutoRectangle.qml
diff --git a/imports/Spectral/Dialog/AccountDetailDialog.qml b/imports/Spectral/Dialog/AccountDetailDialog.qml
index a72d31da5..5b7298b34 100644
--- a/imports/Spectral/Dialog/AccountDetailDialog.qml
+++ b/imports/Spectral/Dialog/AccountDetailDialog.qml
@@ -1,6 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Effect 2.0
@@ -34,12 +35,12 @@ Dialog {
controller: spectralController
}
- delegate: Avatar {
+ delegate: Kirigami.Avatar {
width: 48
height: 48
- source: user.avatarMediaId
- hint: user.displayName ?? ""
+ source: urser.avatarMediaId ? "image://mxc/" + user.avatarMediaId : ""
+ name: user.displayName ?? ""
Menu {
id: contextMenu
diff --git a/imports/Spectral/Dialog/InviteUserDialog.qml b/imports/Spectral/Dialog/InviteUserDialog.qml
index 0291fe58d..9735ebca9 100644
--- a/imports/Spectral/Dialog/InviteUserDialog.qml
+++ b/imports/Spectral/Dialog/InviteUserDialog.qml
@@ -1,6 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Effect 2.0
@@ -86,11 +87,11 @@ Dialog {
contentItem: RowLayout {
spacing: 8
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
- source: avatar
+ source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
hint: name
}
diff --git a/imports/Spectral/Dialog/JoinRoomDialog.qml b/imports/Spectral/Dialog/JoinRoomDialog.qml
index 9134b98e0..687637fe1 100644
--- a/imports/Spectral/Dialog/JoinRoomDialog.qml
+++ b/imports/Spectral/Dialog/JoinRoomDialog.qml
@@ -1,6 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Effect 2.0
@@ -119,11 +120,11 @@ Dialog {
contentItem: RowLayout {
spacing: 8
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
- source: avatar
+ source: model.avatarMediaId ? "image://mxc/" + model.avatarMediaId : ""
hint: name
}
diff --git a/imports/Spectral/Dialog/RoomSettingsDialog.qml b/imports/Spectral/Dialog/RoomSettingsDialog.qml
index db8cda7da..1091e5c3e 100644
--- a/imports/Spectral/Dialog/RoomSettingsDialog.qml
+++ b/imports/Spectral/Dialog/RoomSettingsDialog.qml
@@ -1,6 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Effect 2.0
@@ -30,13 +31,13 @@ Dialog {
spacing: 16
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 72
Layout.preferredHeight: 72
Layout.alignment: Qt.AlignTop
- hint: room.displayName
- source: room.avatarMediaId
+ name: room.displayName
+ source: room.avatarMediaId ? "image://mxc/" + room.avatarMediaId : ""
RippleEffect {
anchors.fill: parent
diff --git a/imports/Spectral/Dialog/StartChatDialog.qml b/imports/Spectral/Dialog/StartChatDialog.qml
index f572bccf5..e427eb34d 100644
--- a/imports/Spectral/Dialog/StartChatDialog.qml
+++ b/imports/Spectral/Dialog/StartChatDialog.qml
@@ -82,12 +82,12 @@ Dialog {
contentItem: RowLayout {
spacing: 8
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
source: avatar
- hint: name
+ name: name
}
ColumnLayout {
diff --git a/imports/Spectral/Dialog/UserDetailDialog.qml b/imports/Spectral/Dialog/UserDetailDialog.qml
index a7e42921d..0ef1bbf43 100644
--- a/imports/Spectral/Dialog/UserDetailDialog.qml
+++ b/imports/Spectral/Dialog/UserDetailDialog.qml
@@ -1,6 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Effect 2.0
@@ -27,12 +28,12 @@ Dialog {
spacing: 16
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 72
Layout.preferredHeight: 72
- hint: displayName
- source: avatarMediaId
+ name: displayName
+ source: avatarMediaId ? "image://mxc/" + avatarMediaId : ""
RippleEffect {
anchors.fill: parent
diff --git a/imports/Spectral/Panel/.RoomListPanel.qml.swo b/imports/Spectral/Panel/.RoomListPanel.qml.swo
new file mode 100644
index 000000000..3cb1660a9
Binary files /dev/null and b/imports/Spectral/Panel/.RoomListPanel.qml.swo differ
diff --git a/imports/Spectral/Panel/RoomListPanel.qml b/imports/Spectral/Panel/RoomListPanel.qml
index 2801dc501..082f5c9cb 100644
--- a/imports/Spectral/Panel/RoomListPanel.qml
+++ b/imports/Spectral/Panel/RoomListPanel.qml
@@ -2,7 +2,7 @@ import QtQuick 2.12
import QtQuick.Controls 2.12 as Controls
import QtQuick.Layouts 1.12
-import org.kde.kirigami 2.4 as Kirigami
+import org.kde.kirigami 2.13 as Kirigami
import SortFilterProxyModel 0.2
@@ -10,20 +10,25 @@ import Spectral.Component 2.0
import Spectral 0.1
Kirigami.ScrollablePage {
+ id: page
property var roomListModel
property var enteredRoom
+ property var searchText
signal enterRoom(var room)
signal leaveRoom(var room)
title: "Rooms"
- actions {
- main: Kirigami.Action {
- iconName: "document-edit"
- }
- contextualActions: []
+
+ titleDelegate: Kirigami.SearchField {
+ Layout.topMargin: Kirigami.Units.smallSpacing
+ Layout.bottomMargin: Kirigami.Units.smallSpacing
+ Layout.fillHeight: true
+ Layout.fillWidth: true
+ onTextChanged: page.searchText = text
}
+
ListView {
id: messageListView
@@ -66,6 +71,11 @@ Kirigami.ScrollablePage {
filters: [
ExpressionFilter {
expression: joinState != "upgraded"
+ },
+ RegExpFilter {
+ roleName: "name"
+ pattern: searchText
+ caseSensitivity: Qt.CaseInsensitive
}
]
}
@@ -89,12 +99,12 @@ Kirigami.ScrollablePage {
contentItem: RowLayout {
spacing: Kirigami.Units.largeSpacing
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: height
Layout.fillHeight: true
- source: avatar
- hint: name || "No Name"
+ source: avatar ? "image://mxc/" + avatar : ""
+ name: model.name || "No Name"
}
ColumnLayout {
@@ -108,11 +118,17 @@ Kirigami.ScrollablePage {
Layout.fillWidth: true
Layout.fillHeight: true
+ text: name || "No Name"
+ font.pixelSize: 16
+ font.bold: unreadCount >= 0
+ elide: Text.ElideRight
+ wrapMode: Text.NoWrap
}
Controls.Label {
Layout.fillWidth: true
Layout.fillHeight: true
+ Layout.alignment: Qt.AlignHCenter
text: (lastEvent == "" ? topic : lastEvent).replace(/(\r\n\t|\n|\r\t)/gm," ")
font.pixelSize: 13
diff --git a/imports/Spectral/Panel/RoomPanel.qml b/imports/Spectral/Panel/RoomPanel.qml
index 9bbcde9ab..cd79ee823 100644
--- a/imports/Spectral/Panel/RoomPanel.qml
+++ b/imports/Spectral/Panel/RoomPanel.qml
@@ -1,7 +1,8 @@
import QtQuick 2.12
-import QtQuick.Controls 2.12 as Controls
+import QtQuick.Controls 2.12 as QQC2
import QtQuick.Layouts 1.12
import Qt.labs.qmlmodels 1.0
+import QtQuick.Controls.Material 2.12
import org.kde.kirigami 2.4 as Kirigami
@@ -9,6 +10,8 @@ import SortFilterProxyModel 0.2
import Spectral.Component 2.0
import Spectral.Component.Timeline 2.0
+import Spectral.Dialog 2.0
+import Spectral.Effect 2.0
import Spectral 0.1
Kirigami.ScrollablePage {
@@ -18,18 +21,73 @@ Kirigami.ScrollablePage {
title: "Messages"
- actions {
- main: Kirigami.Action {
- iconName: "document-edit"
- }
- contextualActions: []
- }
-
MessageEventModel {
id: messageEventModel
room: currentRoom
}
+
+ ImageClipboard {
+ id: imageClipboard
+ }
+
+ QQC2.Popup {
+ anchors.centerIn: parent
+
+ id: attachDialog
+
+ padding: 16
+
+ contentItem: RowLayout {
+ QQC2.ToolButton {
+ Layout.preferredWidth: 160
+ Layout.fillHeight: true
+
+ icon.name: 'mail-attachment'
+
+ text: "Choose local file"
+
+ onClicked: {
+ attachDialog.close()
+
+ var fileDialog = openFileDialog.createObject(ApplicationWindow.overlay)
+
+ fileDialog.chosen.connect(function(path) {
+ if (!path) return
+
+ roomPanelInput.attach(path)
+ })
+
+ fileDialog.open()
+ }
+ }
+
+ Kirigami.Separator {}
+
+ QQC2.ToolButton {
+ Layout.preferredWidth: 160
+ Layout.fillHeight: true
+
+ padding: 16
+
+ icon.name: 'insert-image'
+ text: "Clipboard image"
+ onClicked: {
+ var localPath = StandardPaths.writableLocation(StandardPaths.CacheLocation) + "/screenshots/" + (new Date()).getTime() + ".png"
+ if (!imageClipboard.saveImage(localPath)) return
+ roomPanelInput.attach(localPath)
+ attachDialog.close()
+ }
+ }
+ }
+ }
+
+ Component {
+ id: openFileDialog
+
+ OpenFileDialog {}
+ }
+
SortFilterProxyModel {
id: sortedMessageEventModel
@@ -232,16 +290,9 @@ Kirigami.ScrollablePage {
}
}
- footer: RowLayout {
- Controls.ToolButton {
- contentItem: Kirigami.Icon {
- source: "mail-attachment"
- }
- }
-
- Controls.TextField {
- Layout.fillWidth: true
- }
+ footer: RoomPanelInput {
+ id: roomPanelInput
+ Layout.fillWidth: true
}
background: Item {}
diff --git a/imports/Spectral/Panel/RoomPanelInput.qml b/imports/Spectral/Panel/RoomPanelInput.qml
index a3ffa1ebe..86c27dd3a 100644
--- a/imports/Spectral/Panel/RoomPanelInput.qml
+++ b/imports/Spectral/Panel/RoomPanelInput.qml
@@ -1,7 +1,7 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
-import QtQuick.Controls.Material 2.12
+import org.kde.kirigami 2.13 as Kirigami
import Spectral.Component 2.0
import Spectral.Component.Emoji 2.0
@@ -30,14 +30,20 @@ Control {
id: root
padding: 0
-
+
background: Rectangle {
- color: MSettings.darkTheme ? "#303030" : "#fafafa"
- radius: 24
-
- layer.enabled: true
- layer.effect: ElevationEffect {
- elevation: 1
+ color: Kirigami.Theme.backgroundColor
+ Kirigami.Separator {
+ Rectangle {
+ anchors.fill: parent
+ color: Kirigami.Theme.focusColor
+ visible: chatTextInput.activeFocus
+ }
+ anchors {
+ left: parent.left
+ right: parent.right
+ top: parent.top
+ }
}
}
@@ -59,18 +65,13 @@ Control {
padding: 4
- background: Rectangle {
- radius: height / 2
- color: replyUser ? Qt.darker(replyUser.color, 1.1) : MPalette.accent
- }
-
contentItem: RowLayout {
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 24
Layout.preferredHeight: 24
- source: replyUser ? replyUser.avatarMediaId : ""
- hint: replyUser ? replyUser.displayName : "No name"
+ source: replyUser ? "image://mxc/" + replyUser.avatarMediaId: ""
+ name: replyUser ? replyUser.displayName : "No name"
}
Label {
@@ -87,7 +88,6 @@ Control {
TextEdit {
Layout.fillWidth: true
- color: MPalette.foreground
text: "" + replyContent
font.family: window.font.family
@@ -96,7 +96,6 @@ Control {
readOnly: true
wrapMode: Label.Wrap
selectedTextColor: "white"
- selectionColor: MPalette.accent
textFormat: Text.RichText
}
}
@@ -159,21 +158,19 @@ Control {
horizontalAlignment: Text.AlignHCenter
}
- Avatar {
+ Kirigami.Avatar {
Layout.preferredWidth: 24
Layout.preferredHeight: 24
- visible: !isEmoji
- source: modelData.avatarMediaId ?? null
- color: modelData.color ? Qt.darker(modelData.color, 1.1) : MPalette.accent
+ source: modelData.avatarMediaId ? "image://mxc/" + modelData.avatarMediaId : ""
+ color: modelData.color ? Qt.darker(modelData.color, 1.1) : null
}
-
Label {
Layout.fillHeight: true
visible: !isEmoji
text: autoCompleteText
- color: highlighted ? "white" : MPalette.foreground
+ color: highlighted ? Kirigami.Theme.highlightTextColor : Kirigami.Theme.textColor
verticalAlignment: Text.AlignVCenter
rightPadding: 8
}
@@ -196,8 +193,6 @@ Control {
Layout.rightMargin: 12
visible: emojiPicker.visible || replyItem.visible || autoCompleteListView.visible
-
- color: MSettings.darkTheme ? "#424242" : "#e7ebeb"
}
RowLayout {
@@ -213,9 +208,7 @@ Control {
id: uploadButton
visible: !isReply && !hasAttachment
- contentItem: MaterialIcon {
- icon: "\ue226"
- }
+ icon.name: "mail-attachment"
onClicked: {
if (imageClipboard.hasImage) {
@@ -264,13 +257,7 @@ Control {
visible: hasAttachment
rightPadding: 8
-
- background: Rectangle {
- color: MPalette.accent
- radius: height / 2
- antialiasing: true
- }
-
+
contentItem: RowLayout {
spacing: 0
@@ -280,15 +267,11 @@ Control {
id: cancelAttachmentButton
- contentItem: MaterialIcon {
- icon: "\ue5cd"
- color: "white"
- font.pixelSize: 18
- }
+ icon.name: "mail-attachement"
onClicked: {
- hasAttachment = false
- attachmentPath = ""
+ hasAttachment = false;
+ attachmentPath = "";
}
}
@@ -448,19 +431,13 @@ Control {
}
}
- MaterialIcon {
+ ToolButton {
+ flat: true
Layout.alignment: Qt.AlignVCenter
- icon: "\ue165"
+ icon.name: "format-text-code"
font.pixelSize: 16
- color: MPalette.foreground
- opacity: MSettings.markdownFormatting ? 1 : 0.3
-
- MouseArea {
- anchors.fill: parent
-
- onClicked: MSettings.markdownFormatting = !MSettings.markdownFormatting
- }
+ onClicked: MSettings.markdownFormatting = !MSettings.markdownFormatting
}
ToolButton {
@@ -469,10 +446,7 @@ Control {
Layout.alignment: Qt.AlignBottom
id: emojiButton
-
- contentItem: MaterialIcon {
- icon: "\ue24e"
- }
+ icon.name: "document-send"
onClicked: emojiPicker.visible = !emojiPicker.visible
}
diff --git a/imports/Spectral/Panel/SpectralSidebar.qml b/imports/Spectral/Panel/SpectralSidebar.qml
new file mode 100644
index 000000000..1eb4b93fa
--- /dev/null
+++ b/imports/Spectral/Panel/SpectralSidebar.qml
@@ -0,0 +1,20 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+import QtQuick.Layouts 1.12
+import Qt.labs.qmlmodels 1.0
+
+import org.kde.kirigami 2.12 as Kirigami
+
+import SortFilterProxyModel 0.2
+
+import Spectral.Component 2.0
+import Spectral.Component.Timeline 2.0
+import Spectral 0.1
+
+Kirigami.GlobalDrawer {
+ id: root
+
+ modal: true
+ collapsible: true
+ collapsed: Kirigami.Settings.isMobile
+}
diff --git a/imports/Spectral/Panel/qmldir b/imports/Spectral/Panel/qmldir
index a36677f3c..b405d340d 100644
--- a/imports/Spectral/Panel/qmldir
+++ b/imports/Spectral/Panel/qmldir
@@ -2,3 +2,4 @@ module Spectral.Panel
RoomPanel 2.0 RoomPanel.qml
RoomListPanel 2.0 RoomListPanel.qml
RoomDrawer 2.0 RoomDrawer.qml
+SpectralSidebar 2.0 SpectralSidebar.qml
diff --git a/qml/main.qml b/qml/main.qml
index 3db0ef072..468af2fd9 100644
--- a/qml/main.qml
+++ b/qml/main.qml
@@ -2,7 +2,7 @@ import QtQuick 2.12
import QtQuick.Controls 2.12 as Controls
import QtQuick.Layouts 1.12
-import org.kde.kirigami 2.4 as Kirigami
+import org.kde.kirigami 2.12 as Kirigami
import Spectral 0.1
import Spectral.Component 2.0
@@ -11,28 +11,7 @@ import Spectral.Panel 2.0
Kirigami.ApplicationWindow {
id: root
- globalDrawer: Kirigami.GlobalDrawer {
- title: "Hello App"
- titleIcon: "applications-graphics"
- actions: [
- Kirigami.Action {
- text: "View"
- iconName: "view-list-icons"
- Kirigami.Action {
- text: "action 1"
- }
- Kirigami.Action {
- text: "action 2"
- }
- Kirigami.Action {
- text: "action 3"
- }
- },
- Kirigami.Action {
- text: "action 3"
- }
- ]
- }
+ globalDrawer: SpectralSidebar { }
contextDrawer: Kirigami.ContextDrawer {
id: contextDrawer
@@ -48,18 +27,18 @@ Kirigami.ApplicationWindow {
onErrorOccured: showPassiveNotification(error + ": " + detail)
}
- RoomListModel {
- id: spectralRoomListModel
-
- connection: spectralController.connection
- }
-
Binding {
target: imageProvider
property: "connection"
value: spectralController.connection
}
+ RoomListModel {
+ id: spectralRoomListModel
+
+ connection: spectralController.connection
+ }
+
Component {
id: roomPanelComponent
diff --git a/res.qrc b/res.qrc
index 871f0b376..3ca297a06 100644
--- a/res.qrc
+++ b/res.qrc
@@ -21,6 +21,7 @@
imports/Spectral/Panel/RoomListPanel.qml
imports/Spectral/Panel/RoomPanel.qml
imports/Spectral/Panel/RoomHeader.qml
+ imports/Spectral/Panel/SpectralSidebar.qml
imports/Spectral/Component/ScrollHelper.qml
imports/Spectral/Component/AutoListView.qml
imports/Spectral/Component/AutoTextField.qml
@@ -30,7 +31,6 @@
imports/Spectral/Effect/RippleEffect.qml
imports/Spectral/Effect/CircleMask.qml
imports/Spectral/Component/Timeline/ImageDelegate.qml
- imports/Spectral/Component/Avatar.qml
imports/Spectral/Setting/Palette.qml
imports/Spectral/Component/Timeline/FileDelegate.qml
imports/Spectral/Component/FullScreenImage.qml