Split HButton into HBaseButton and HButton

TODO.md

@@ -49,6 +49,7 @@
   - Links preview
 
 - Client improvements
+  - More intelligent thumbnails downloading for different sizes
   - Filtering rooms: search more than display names?
   - Initial sync filter and lazy load, see weechat-matrix `_handle_login()`
     - See also `handle_response()`'s `keys_query` request

src/qml/Base/HBaseButton.qml

@@ -0,0 +1,76 @@
+// Copyright 2019 miruka
+// This file is part of harmonyqml, licensed under LGPLv3.
+
+import QtQuick 2.7
+import QtQuick.Controls 2.2
+import QtQuick.Layouts 1.3
+
+Button {
+    property bool circle: false
+
+    property color backgroundColor: theme.controls.button.background
+    property alias overlayOpacity: buttonBackgroundOverlay.opacity
+    property bool checkedLightens: false
+
+    signal canceled
+    signal clicked
+    signal doubleClicked
+    signal entered
+    signal exited
+    signal pressAndHold
+    signal pressed
+    signal released
+
+    id: button
+
+    background: Rectangle {
+        id: buttonBackground
+        color: Qt.lighter(
+            backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0
+        )
+        radius: circle ? height : 0
+
+        Behavior on color {
+            ColorAnimation { duration: theme.animationDuration / 2 }
+        }
+
+        Rectangle {
+            id: buttonBackgroundOverlay
+            anchors.fill: parent
+            radius: parent.radius
+            color: "black"
+            opacity: 0
+
+            Behavior on opacity {
+                HNumberAnimation { duration: theme.animationDuration / 2 }
+            }
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        hoverEnabled: true
+
+        onCanceled: button.canceled()
+        onClicked: button.clicked()
+        onDoubleClicked: button.doubleClicked()
+        onEntered: {
+            overlayOpacity = checked ? 0 : 0.15
+            button.entered()
+        }
+        onExited: {
+            overlayOpacity = 0
+            button.exited()
+        }
+        onPressAndHold: button.pressAndHold()
+        onPressed: {
+            overlayOpacity += 0.15
+            button.pressed()
+        }
+        onReleased: {
+            if (checkable) { checked = ! checked }
+            overlayOpacity = checked ? 0 : 0.15
+            button.released()
+        }
+    }
+}

src/qml/Base/HButton.qml

@@ -5,19 +5,15 @@ import QtQuick 2.7
 import QtQuick.Controls 2.2
 import QtQuick.Layouts 1.3
 
-Button {
+HBaseButton {
     property int horizontalMargin: 0
     property int verticalMargin: 0
 
     property string iconName: ""
     property var iconDimension: null
     property var iconTransform: null
-    property bool circle: false
 
     property int fontSize: theme.fontSize.normal
-    property color backgroundColor: theme.controls.button.background
-    property alias overlayOpacity: buttonBackgroundOverlay.opacity
-    property bool checkedLightens: false
 
     property bool loading: false
 
@@ -26,41 +22,8 @@ Button {
     readonly property alias visibility: button.visible
     onVisibilityChanged: if (! visibility) { loading = false }
 
-    signal canceled
-    signal clicked
-    signal doubleClicked
-    signal entered
-    signal exited
-    signal pressAndHold
-    signal pressed
-    signal released
-
     id: button
 
-    background: Rectangle {
-        id: buttonBackground
-        color: Qt.lighter(
-            backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0
-        )
-        radius: circle ? height : 0
-
-        Behavior on color {
-            ColorAnimation { duration: theme.animationDuration / 2 }
-        }
-
-        Rectangle {
-            id: buttonBackgroundOverlay
-            anchors.fill: parent
-            radius: parent.radius
-            color: "black"
-            opacity: 0
-
-            Behavior on opacity {
-                HNumberAnimation { duration: theme.animationDuration / 2 }
-            }
-        }
-    }
-
     Component {
         id: buttonContent
 
@@ -106,31 +69,4 @@ Button {
         sourceComponent:
             loading && ! iconName ? loadingOverlay : buttonContent
     }
-
-    MouseArea {
-        anchors.fill: parent
-        hoverEnabled: true
-
-        onCanceled: button.canceled()
-        onClicked: button.clicked()
-        onDoubleClicked: button.doubleClicked()
-        onEntered: {
-            overlayOpacity = checked ? 0 : 0.15
-            button.entered()
-        }
-        onExited: {
-            overlayOpacity = 0
-            button.exited()
-        }
-        onPressAndHold: button.pressAndHold()
-        onPressed: {
-            overlayOpacity += 0.15
-            button.pressed()
-        }
-        onReleased: {
-            if (checkable) { checked = ! checked }
-            overlayOpacity = checked ? 0 : 0.15
-            button.released()
-        }
-    }
 }

src/qml/Base/HEntityButton.qml

@@ -0,0 +1,136 @@
+// Copyright 2019 miruka
+// This file is part of harmonyqml, licensed under LGPLv3.
+
+import QtQuick 2.7
+import QtQuick.Controls 2.2
+import QtQuick.Layouts 1.3
+
+Button {
+    property int horizontalMargin: 0
+    property int verticalMargin: 0
+
+    property string iconName: ""
+    property var iconDimension: null
+    property var iconTransform: null
+    property bool circle: false
+
+    property int fontSize: theme.fontSize.normal
+    property color backgroundColor: theme.controls.button.background
+    property alias overlayOpacity: buttonBackgroundOverlay.opacity
+    property bool checkedLightens: false
+
+    property bool loading: false
+
+    property int contentWidth: 0
+
+    readonly property alias visibility: button.visible
+    onVisibilityChanged: if (! visibility) { loading = false }
+
+    signal canceled
+    signal clicked
+    signal doubleClicked
+    signal entered
+    signal exited
+    signal pressAndHold
+    signal pressed
+    signal released
+
+    id: button
+
+    background: Rectangle {
+        id: buttonBackground
+        color: Qt.lighter(
+            backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0
+        )
+        radius: circle ? height : 0
+
+        Behavior on color {
+            ColorAnimation { duration: theme.animationDuration / 2 }
+        }
+
+        Rectangle {
+            id: buttonBackgroundOverlay
+            anchors.fill: parent
+            radius: parent.radius
+            color: "black"
+            opacity: 0
+
+            Behavior on opacity {
+                HNumberAnimation { duration: theme.animationDuration / 2 }
+            }
+        }
+    }
+
+    Component {
+        id: buttonContent
+
+        HRowLayout {
+            id: contentLayout
+            spacing: button.text && iconName ? 5 : 0
+            Component.onCompleted: contentWidth = implicitWidth
+
+            HIcon {
+                svgName: loading ? "hourglass" : iconName
+                dimension: iconDimension || contentLayout.height
+                transform: iconTransform
+
+                Layout.topMargin: verticalMargin
+                Layout.bottomMargin: verticalMargin
+                Layout.leftMargin: horizontalMargin
+                Layout.rightMargin: horizontalMargin
+            }
+
+            HLabel {
+                text: button.text
+                font.pixelSize: fontSize
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+
+                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+            }
+        }
+    }
+
+    Component {
+        id: loadingOverlay
+        HRowLayout {
+            HIcon {
+                svgName: "hourglass"
+                Layout.preferredWidth: contentWidth || -1
+                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+            }
+        }
+    }
+
+    contentItem: Loader {
+        sourceComponent:
+            loading && ! iconName ? loadingOverlay : buttonContent
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        hoverEnabled: true
+
+        onCanceled: button.canceled()
+        onClicked: button.clicked()
+        onDoubleClicked: button.doubleClicked()
+        onEntered: {
+            overlayOpacity = checked ? 0 : 0.15
+            button.entered()
+        }
+        onExited: {
+            overlayOpacity = 0
+            button.exited()
+        }
+        onPressAndHold: button.pressAndHold()
+        onPressed: {
+            overlayOpacity += 0.15
+            button.pressed()
+        }
+        onReleased: {
+            if (checkable) { checked = ! checked }
+            overlayOpacity = checked ? 0 : 0.15
+            button.released()
+        }
+    }
+}