diff --git a/TODO.md b/TODO.md
index 504536c2..29cc5c27 100644
--- a/TODO.md
+++ b/TODO.md
@@ -1,3 +1,11 @@
+- Qt 5.12
+ - New input handlers
+ - ECMAScript 7
+ - .mjs modules
+ - inset properties
+ - `ToolTip.hide()`/`show()`
+ - horizontal & vertical padding props
+
- Refactoring
- Don't bake in size properties for components
diff --git a/src/qml/Base/HAvatar.qml b/src/qml/Base/HAvatar.qml
index aa0ed438..fe49c27e 100644
--- a/src/qml/Base/HAvatar.qml
+++ b/src/qml/Base/HAvatar.qml
@@ -6,7 +6,7 @@ import QtQuick.Controls 2.0
import "../Base"
import "../utils.js" as Utils
-Rectangle {
+HRectangle {
property string name: ""
property var imageUrl: null
property var toolTipImageUrl: imageUrl
diff --git a/src/qml/Base/HHighlightRectangle.qml b/src/qml/Base/HHighlightRectangle.qml
new file mode 100644
index 00000000..5e094507
--- /dev/null
+++ b/src/qml/Base/HHighlightRectangle.qml
@@ -0,0 +1,26 @@
+// Copyright 2019 miruka
+// This file is part of harmonyqml, licensed under LGPLv3.
+
+import QtQuick 2.12
+
+HRectangle {
+ property bool checkable: false // TODO
+ property bool checked: false
+
+ property color normalColor: theme.controls.listEntry.background
+ property color hoveredColor: theme.controls.listEntry.hoveredBackground
+ property color pressedColor: theme.controls.listEntry.pressedBackground
+ property color checkedColor: theme.controls.listEntry.checkedBackground
+
+ color: checked ? checkedColor :
+ // tap.pressed ? pressedColor :
+ hover.hovered ? hoveredColor :
+ normalColor
+
+ Behavior on color {
+ ColorAnimation { duration: theme.animationDuration / 1.5 }
+ }
+
+ HoverHandler { id: hover }
+ TapHandler { id: tap }
+}
diff --git a/src/qml/Base/HRichLabel.qml b/src/qml/Base/HRichLabel.qml
index 31f3a523..ee612824 100644
--- a/src/qml/Base/HRichLabel.qml
+++ b/src/qml/Base/HRichLabel.qml
@@ -24,11 +24,5 @@ HLabel {
mouse.accepted = Boolean(link)
if (link) { Qt.openUrlExternally(link) }
}
-
- onPressAndHold: mouse.accepted = false
- onDoubleClicked: mouse.accepted = false
- onPressed: mouse.accepted = false
- onReleased: mouse.accepted = false
- onWheel: mouse.accepted = false
}
}
diff --git a/src/qml/SidePane/AccountDelegate.qml b/src/qml/SidePane/AccountDelegate.qml
index ad9ed039..3ec9b055 100644
--- a/src/qml/SidePane/AccountDelegate.qml
+++ b/src/qml/SidePane/AccountDelegate.qml
@@ -13,53 +13,60 @@ Column {
property bool expanded: true
- HRowLayout {
+ HHighlightRectangle {
width: parent.width
height: childrenRect.height
- id: row
- HUserAvatar {
- id: avatar
- // Need to do this because conflict with the model property
- Component.onCompleted: userId = model.userId
- }
+ normalColor: theme.sidePane.account.background
- HColumnLayout {
- Layout.fillWidth: true
- Layout.fillHeight: true
+ HRowLayout {
+ id: row
+ width: parent.width
- HLabel {
- id: accountLabel
- text: userInfo.displayName || model.userId
- elide: HLabel.ElideRight
- maximumLineCount: 1
- Layout.fillWidth: true
- leftPadding: 6
- rightPadding: leftPadding
+ HUserAvatar {
+ id: avatar
+ // Need to do this because conflict with the model property
+ Component.onCompleted: userId = model.userId
}
- HTextField {
- id: statusEdit
- text: userInfo.statusMessage
- placeholderText: qsTr("Set status message")
- font.pixelSize: theme.fontSize.small
- background: null
-
- padding: 0
- leftPadding: accountLabel.leftPadding
- rightPadding: leftPadding
+ HColumnLayout {
Layout.fillWidth: true
+ Layout.fillHeight: true
- onEditingFinished: {
- //Backend.setStatusMessage(model.userId, text) TODO
- pageStack.forceActiveFocus()
+ HLabel {
+ id: accountLabel
+ text: userInfo.displayName || model.userId
+ elide: HLabel.ElideRight
+ maximumLineCount: 1
+ Layout.fillWidth: true
+ leftPadding: sidePane.currentSpacing
+ rightPadding: leftPadding
+ }
+
+ HTextField {
+ id: statusEdit
+ text: userInfo.statusMessage
+ placeholderText: qsTr("Set status message")
+ font.pixelSize: theme.fontSize.small
+ background: null
+
+ padding: 0
+ leftPadding: accountLabel.leftPadding
+ rightPadding: leftPadding
+ Layout.fillWidth: true
+
+ onEditingFinished: {
+ //Backend.setStatusMessage(model.userId, text) TODO
+ pageStack.forceActiveFocus()
+ }
}
}
- }
- ExpandButton {
- expandableItem: accountDelegate
- Layout.preferredHeight: row.height
+ ExpandButton {
+ id: expandButton
+ expandableItem: accountDelegate
+ Layout.preferredHeight: row.height
+ }
}
}
diff --git a/src/qml/SidePane/RoomCategoryDelegate.qml b/src/qml/SidePane/RoomCategoryDelegate.qml
index 910721e9..a5dc5f24 100644
--- a/src/qml/SidePane/RoomCategoryDelegate.qml
+++ b/src/qml/SidePane/RoomCategoryDelegate.qml
@@ -30,6 +30,7 @@ Column {
elide: Text.ElideRight
maximumLineCount: 1
+ Layout.leftMargin: sidePane.currentSpacing
Layout.fillWidth: true
}
diff --git a/src/qml/SidePane/RoomDelegate.qml b/src/qml/SidePane/RoomDelegate.qml
index 84d7aca1..0201a458 100644
--- a/src/qml/SidePane/RoomDelegate.qml
+++ b/src/qml/SidePane/RoomDelegate.qml
@@ -1,71 +1,82 @@
// Copyright 2019 miruka
// This file is part of harmonyqml, licensed under LGPLv3.
-import QtQuick 2.7
+import QtQuick 2.12
import QtQuick.Layouts 1.3
import "../Base"
import "../utils.js" as Utils
-MouseArea {
+HHighlightRectangle {
id: roomDelegate
width: roomList.width
height: childrenRect.height
- onClicked:
- pageStack.showRoom(roomList.userId, roomList.category, model.roomId)
+ TapHandler {
+ onTapped: pageStack.showRoom(
+ roomList.userId, roomList.category, model.roomId
+ )
+ }
- HRowLayout {
- width: parent.width
- spacing: sidePane.collapsed ? 0 : sidePane.normalSpacing
+ Row {
+ width: parent.width - sidePane.currentSpacing * 2
+ padding: sidePane.currentSpacing / 2
+ leftPadding: sidePane.currentSpacing
+ rightPadding: 0
- HRoomAvatar {
- id: roomAvatar
- roomId: model.roomId
- }
+ HRowLayout {
+ width: parent.width
+ spacing: sidePane.currentSpacing
- HColumnLayout {
- Layout.fillWidth: true
- Layout.maximumWidth:
- parent.width - parent.totalSpacing - roomAvatar.width
-
- HLabel {
- id: roomLabel
- text: model.displayName || "Empty room"
- textFormat: model.displayName? Text.PlainText : Text.StyledText
- elide: Text.ElideRight
- maximumLineCount: 1
- verticalAlignment: Qt.AlignVCenter
-
- Layout.maximumWidth: parent.width
+ HRoomAvatar {
+ id: roomAvatar
+ roomId: model.roomId
}
- HRichLabel {
- function getText(ev) {
- if (! ev) { return "" }
+ HColumnLayout {
+ Layout.fillWidth: true
+ Layout.maximumWidth:
+ parent.width - parent.totalSpacing - roomAvatar.width
- if (! Utils.eventIsMessage(ev)) {
- return Utils.translatedEventContent(ev)
- }
+ HLabel {
+ id: roomLabel
+ text: model.displayName || "Empty room"
+ textFormat:
+ model.displayName? Text.PlainText : Text.StyledText
+ elide: Text.ElideRight
+ maximumLineCount: 1
+ verticalAlignment: Qt.AlignVCenter
- return Utils.coloredNameHtml(
- users.find(ev.senderId).displayName,
- ev.senderId
- ) + ": " + py.callSync("inlinify", [ev.content])
+ Layout.maximumWidth: parent.width
}
- // Have to do it like this to avoid binding loop
- property var lastEv: timelines.lastEventOf(model.roomId)
- onLastEvChanged: text = getText(lastEv)
+ HRichLabel {
+ function getText(ev) {
+ if (! ev) { return "" }
- id: subtitleLabel
- visible: Boolean(text)
- textFormat: Text.StyledText
+ if (! Utils.eventIsMessage(ev)) {
+ return Utils.translatedEventContent(ev)
+ }
- font.pixelSize: theme.fontSize.small
- elide: Text.ElideRight
- maximumLineCount: 1
+ return Utils.coloredNameHtml(
+ users.find(ev.senderId).displayName,
+ ev.senderId
+ ) + ": " + py.callSync("inlinify", [ev.content])
+ }
- Layout.maximumWidth: parent.width
+ // Have to do it like this to avoid binding loop
+ property var lastEv: timelines.lastEventOf(model.roomId)
+ onLastEvChanged: text = getText(lastEv)
+
+ id: subtitleLabel
+ visible: Boolean(text)
+ textFormat: Text.StyledText
+
+ font.pixelSize: theme.fontSize.small
+ elide: Text.ElideRight
+ maximumLineCount: 1
+
+ Layout.maximumWidth: parent.width
+ }
}
}
}
diff --git a/src/qml/SidePane/RoomList.qml b/src/qml/SidePane/RoomList.qml
index b6129ed9..71f90f76 100644
--- a/src/qml/SidePane/RoomList.qml
+++ b/src/qml/SidePane/RoomList.qml
@@ -8,12 +8,11 @@ import "../Base"
import "../utils.js" as Utils
HListView {
+ id: roomList
+
property string userId: ""
property string category: ""
- id: roomList
- spacing: sidePane.collapsed ? 0 : sidePane.normalSpacing
-
model: SortFilterProxyModel {
sourceModel: rooms
filters: AllOf {
diff --git a/src/qml/SidePane/SidePane.qml b/src/qml/SidePane/SidePane.qml
index 49a87e19..f5cf581e 100644
--- a/src/qml/SidePane/SidePane.qml
+++ b/src/qml/SidePane/SidePane.qml
@@ -12,6 +12,7 @@ HRectangle {
clip: true
property int normalSpacing: 8
+ property int currentSpacing: collapsed ? 0 : normalSpacing
property bool collapsed: false
HColumnLayout {
@@ -21,10 +22,8 @@ HRectangle {
Layout.fillWidth: true
Layout.fillHeight: true
- spacing: collapsed ? 0 : normalSpacing * 3
- topMargin: collapsed ? 0 : normalSpacing
- bottomMargin: topMargin
- Layout.leftMargin: topMargin
+ spacing: currentSpacing
+ bottomMargin: currentSpacing
Behavior on spacing { HNumberAnimation {} }
}
diff --git a/src/qml/Theme.qml b/src/qml/Theme.qml
index f16ecc43..9a12b9cb 100644
--- a/src/qml/Theme.qml
+++ b/src/qml/Theme.qml
@@ -41,6 +41,13 @@ QtObject {
property color background: colors.background2
}
+ property QtObject listEntry: QtObject {
+ property color background: "transparent"
+ property color hoveredBackground: Qt.hsla(0, 0, 0, 0.2)
+ property color pressedBackground: Qt.hsla(0, 0, 0, 0.4)
+ property color checkedBackground: Qt.hsla(0, 0, 0, 0.4)
+ }
+
property QtObject textField: QtObject {
property color background: colors.background2
}
@@ -53,6 +60,10 @@ QtObject {
property QtObject sidePane: QtObject {
property color background: colors.background2
+ property QtObject account: QtObject {
+ property color background: Qt.lighter(colors.background2, 1.05)
+ }
+
property QtObject settingsButton: QtObject {
property color background: colors.background2
}
diff --git a/src/qml/Window.qml b/src/qml/Window.qml
index 2db6a42d..b671a8b3 100644
--- a/src/qml/Window.qml
+++ b/src/qml/Window.qml
@@ -28,6 +28,7 @@ ApplicationWindow {
Python { id: py }
+ // Models
Accounts { id: accounts }
Devices { id: devices }
RoomCategories { id: roomCategories }