Merge pull request #1394 from Nheko-Reborn/uiTweaks

Some small UI changes

resources/qml/EncryptionIndicator.qml

@@ -14,10 +14,12 @@ Image {
     property int trust: Crypto.Unverified
     property string unencryptedIcon: ":/icons/icons/ui/shield-filled-cross.svg"
     property color unencryptedColor: Nheko.theme.error
+    property color unencryptedHoverColor: unencryptedColor
+    property bool hovered: ma.hovered
 
     property string sourceUrl: {
         if (!encrypted)
-        return "image://colorimage/"+unencryptedIcon+"?";
+        return "image://colorimage/" + unencryptedIcon + "?";
 
         switch (trust) {
             case Crypto.Verified:
@@ -46,10 +48,10 @@ Image {
                 return sourceUrl + Nheko.theme.error;
             }
         } else {
-            return sourceUrl + unencryptedColor;
+            return sourceUrl + (stateImg.hovered ? unencryptedHoverColor : unencryptedColor);
         }
     }
-    ToolTip.visible: ma.hovered
+    ToolTip.visible: stateImg.hovered
     ToolTip.text: {
         if (!encrypted)
             return qsTr("This message is not encrypted!");

resources/qml/MessageInput.qml

@@ -4,6 +4,7 @@
 
 import "./emoji"
 import "./voip"
+import "./ui"
 import QtQuick 2.12
 import QtQuick.Controls 2.3
 import QtQuick.Layouts 1.2
@@ -90,8 +91,9 @@ Rectangle {
                 color: Nheko.colors.window
                 visible: room && room.input.uploading
 
-                NhekoBusyIndicator {
+                Spinner {
-                    anchors.fill: parent
+                    anchors.centerIn: parent
+                    height: parent.height / 2
                     running: parent.visible
                 }
 

resources/qml/MessageView.qml

@@ -206,7 +206,7 @@ Item {
         Shortcut {
             sequence: StandardKey.MoveToPreviousPage
             onActivated: {
-                chat.contentY = chat.contentY - chat.height / 2;
+                chat.contentY = chat.contentY - chat.height * 0.9;
                 chat.returnToBounds();
             }
         }
@@ -214,7 +214,7 @@ Item {
         Shortcut {
             sequence: StandardKey.MoveToNextPage
             onActivated: {
-                chat.contentY = chat.contentY + chat.height / 2;
+                chat.contentY = chat.contentY + chat.height * 0.9;
                 chat.returnToBounds();
             }
         }

resources/qml/NhekoBusyIndicator.qml

@@ -1,69 +0,0 @@
-// SPDX-FileCopyrightText: Nheko Contributors
-//
-// SPDX-License-Identifier: GPL-3.0-or-later
-
-import QtQuick 2.9
-import QtQuick.Controls 2.3
-import QtQuick.Layouts 1.2
-import im.nheko 1.0
-
-BusyIndicator {
-    id: control
-
-    contentItem: Item {
-        implicitWidth: 64
-        implicitHeight: 64
-
-        Item {
-            id: item
-
-            height: Math.min(parent.height, parent.width)
-            width: height
-            opacity: control.running ? 1 : 0
-
-            RotationAnimator {
-                target: item
-                running: control.visible && control.running
-                from: 0
-                to: 360
-                loops: Animation.Infinite
-                duration: 2000
-            }
-
-            Repeater {
-                id: repeater
-
-                model: 6
-
-                Rectangle {
-                    implicitWidth: radius * 2
-                    implicitHeight: radius * 2
-                    radius: item.height / 8
-                    color: Nheko.colors.text
-                    opacity: (index + 2) / (repeater.count + 2)
-                    transform: [
-                        Translate {
-                            y: item.height / 2
-                        },
-                        Rotation {
-                            angle: index / repeater.count * 360
-                            origin.x: item.height / 2
-                            origin.y: item.height / 2
-                        }
-                    ]
-                }
-
-            }
-
-            Behavior on opacity {
-                OpacityAnimator {
-                    duration: 250
-                }
-
-            }
-
-        }
-
-    }
-
-}

resources/qml/Root.qml

@@ -268,8 +268,6 @@ Pane {
             var component = Qt.createComponent("qrc:/qml/dialogs/InviteDialog.qml")
             if (component.status == Component.Ready) {
                 var dialog = component.createObject(timelineRoot, {
-                    "roomId": Rooms.currentRoom.roomId,
-                    "plainRoomName": Rooms.currentRoom.plainRoomName,
                     "invitees": invitees
                 });
                 dialog.show();

resources/qml/TimelineView.qml

@@ -279,6 +279,13 @@ Item {
             onClicked: Rooms.declineInvite(roomPreview.roomid)
         }
 
+        FlatButton {
+            visible: !!room
+            Layout.alignment: Qt.AlignHCenter
+            text: qsTr("leave")
+            onClicked: TimelineManager.openLeaveRoomDialog(room.roomId)
+        }
+
         ScrollView {
             id: reasonField
             property bool showReason: false

resources/qml/ToggleButton.qml

@@ -25,7 +25,7 @@ Switch {
             width: parent.width - height
             x: radius
             y: parent.height / 2 - height / 2
-            color: toggleButton.checked ? "skyblue" : "grey"
+            color: toggleButton.checked ? Nheko.colors.highlight : "grey"
             border.color: "#cccccc"
         }
 

resources/qml/TopBar.qml

@@ -242,9 +242,8 @@ Pane {
                     enabled: false
                     unencryptedIcon: ":/icons/icons/ui/people.svg"
                     unencryptedColor: Nheko.colors.buttonText
-                }
+                    unencryptedHoverColor: Nheko.colors.highlight
-
+                    hovered: parent.hovered
-                background: null
 
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: {
@@ -260,8 +259,9 @@ Pane {
                             return qsTr("This room contains unverified devices!");
                         }
                     }
-                ToolTip.visible: hovered
+                }
 
+                background: null
                 onClicked: TimelineManager.openRoomMembers(room)
             }
 

resources/qml/dialogs/InviteDialog.qml

@@ -12,8 +12,6 @@ import im.nheko 1.0
 ApplicationWindow {
     id: inviteDialogRoot
 
-    property string roomId
-    property string plainRoomName
     property InviteesModel invitees
     property var friendsCompleter
     property var profile
@@ -39,7 +37,7 @@ ApplicationWindow {
         close();
     }
 
-    title: qsTr("Invite users to %1").arg(plainRoomName)
+    title: qsTr("Invite users to %1").arg(invitees.room.plainRoomName)
     height: 380
     width: 340
     palette: Nheko.colors

resources/qml/dialogs/ReadReceipts.qml

@@ -78,6 +78,8 @@ ApplicationWindow {
                         anchors.margins: Nheko.paddingSmall
 
                         Avatar {
+                            id: avatar
+
                             width: Nheko.avatarSize
                             height: Nheko.avatarSize
                             userid: model.mxid
@@ -88,27 +90,28 @@ ApplicationWindow {
 
                         ColumnLayout {
                             spacing: Nheko.paddingSmall
+                            Layout.fillWidth: true
 
-                            Label {
+                            ElidedLabel {
                                 text: model.displayName
                                 color: TimelineManager.userColor(model ? model.mxid : "", Nheko.colors.window)
                                 font.pointSize: fontMetrics.font.pointSize
+                                elideWidth: del.width - Nheko.paddingMedium - avatar.width
+                                Layout.fillWidth: true
                             }
 
-                            Label {
+                            ElidedLabel {
                                 text: model.timestamp
                                 color: Nheko.colors.buttonText
                                 font.pointSize: fontMetrics.font.pointSize * 0.9
-                            }
+                                elideWidth: del.width - Nheko.paddingMedium - avatar.width
-
-                        }
-
-                        Item {
                                 Layout.fillWidth: true
                             }
 
                         }
 
+                    }
+
                     CursorShape {
                         anchors.fill: parent
                         cursorShape: Qt.PointingHandCursor

resources/qml/dialogs/RoomMembers.qml

@@ -146,12 +146,14 @@ ApplicationWindow {
 
                         ColumnLayout {
                             spacing: Nheko.paddingSmall
+                            Layout.fillWidth: true
 
                             ElidedLabel {
                                 fullText: model.displayName
                                 color: TimelineManager.userColor(model ? model.mxid : "", del.background.color)
                                 font.pixelSize: fontMetrics.font.pixelSize
                                 elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
+                                Layout.fillWidth: true
                             }
 
                             ElidedLabel {
@@ -159,14 +161,11 @@ ApplicationWindow {
                                 color: del.hovered ? Nheko.colors.brightText : Nheko.colors.buttonText
                                 font.pixelSize: Math.ceil(fontMetrics.font.pixelSize * 0.9)
                                 elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
-                            }
-
-                        }
-
-                        Item {
                                 Layout.fillWidth: true
                             }
 
+                        }
+
                         Image {
                             property bool isAdmin: room.permissions.changeLevel(MtxEvent.PowerLevels) <= model.powerlevel
                             property bool isModerator: room.permissions.redactLevel() <= model.powerlevel

resources/qml/dialogs/RoomSettings.qml

@@ -395,6 +395,7 @@ ApplicationWindow {
                             checked = true;
                             return ;
                         }
+                        if (checked === true)
                             confirmEncryptionDialog.open();
                     }
                     Layout.alignment: Qt.AlignRight

resources/res.qrc

@@ -111,7 +111,6 @@
         <file>qml/UploadBox.qml</file>
         <file>qml/MessageInput.qml</file>
         <file>qml/MessageView.qml</file>
-        <file>qml/NhekoBusyIndicator.qml</file>
         <file>qml/PrivacyScreen.qml</file>
         <file>qml/Reactions.qml</file>
         <file>qml/ReplyPopup.qml</file>

src/InviteesModel.cpp

@@ -9,8 +9,9 @@
 #include "MatrixClient.h"
 #include "mtx/responses/profile.hpp"
 
-InviteesModel::InviteesModel(QObject *parent)
+InviteesModel::InviteesModel(TimelineModel *room, QObject *parent)
   : QAbstractListModel{parent}
+  , room_{room}
 {
 }
 

src/InviteesModel.h

@@ -8,6 +8,8 @@
 #include <QAbstractListModel>
 #include <QVector>
 
+class TimelineModel;
+
 class Invitee final : public QObject
 {
     Q_OBJECT
@@ -34,6 +36,7 @@ class InviteesModel final : public QAbstractListModel
     Q_OBJECT
 
     Q_PROPERTY(int count READ rowCount NOTIFY countChanged)
+    Q_PROPERTY(TimelineModel *room READ room CONSTANT)
 
 public:
     enum Roles
@@ -43,7 +46,9 @@ public:
         AvatarUrl,
     };
 
-    InviteesModel(QObject *parent = nullptr);
+    InviteesModel(TimelineModel *room, QObject *parent = nullptr);
+
+    TimelineModel *room() const { return room_; }
 
     Q_INVOKABLE void addUser(QString mxid, QString displayName = "", QString avatarUrl = "");
     Q_INVOKABLE void removeUser(QString mxid);
@@ -63,6 +68,7 @@ signals:
 
 private:
     QVector<Invitee *> invitees_;
+    TimelineModel *room_;
 };
 
 #endif // INVITEESMODEL_H

src/Utils.cpp

@@ -141,7 +141,9 @@ utils::replaceEmoji(const QString &body)
         if (!insideTag && utils::codepointIsEmoji(code)) {
             if (!insideFontBlock) {
                 fmtBody += QStringLiteral("<font face=\"") % UserSettings::instance()->emojiFont() %
-                           QStringLiteral("\">");
+                           (UserSettings::instance()->enlargeEmojiOnlyMessages()
+                              ? QStringLiteral("\" size=\"4\">")
+                              : QStringLiteral("\">"));
                 insideFontBlock = true;
             } else if (code == 0xfe0f) {
                 // BUG(Nico):

src/timeline/TimelineViewManager.cpp

@@ -180,7 +180,7 @@ TimelineViewManager::openRoomSettings(QString room_id)
 void
 TimelineViewManager::openInviteUsers(QString roomId)
 {
-    InviteesModel *model = new InviteesModel{};
+    InviteesModel *model = new InviteesModel{rooms_->getRoomById(roomId).data()};
     connect(model, &InviteesModel::accept, this, [this, model, roomId]() {
         emit inviteUsers(roomId, model->mxids());
     });