Remove ImageItem, Paintable and use unified image provider.

imports/Spectral/Component/Avatar.qml

@@ -0,0 +1,63 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+import QtGraphicalEffects 1.0
+
+Item {
+    property string hint: "H"
+    property string source: ""
+    readonly property url realSource: source ? "image://mxc/" + source : ""
+
+    id: root
+
+    Image {
+        anchors.fill: parent
+
+        id: image
+        visible: realSource
+        source: realSource
+        sourceSize.width: width
+        sourceSize.height: width
+        fillMode: Image.PreserveAspectCrop
+        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: stringToColor(hint)
+
+        Label {
+            anchors.centerIn: parent
+
+            color: "white"
+            text: hint[0].toUpperCase()
+            font.pixelSize: root.width / 2
+            font.bold: true
+        }
+    }
+
+    function stringToColor(str) {
+        var hash = 0;
+        for (var i = 0; i < str.length; i++) {
+            hash = str.charCodeAt(i) + ((hash << 5) - hash);
+        }
+        var colour = '#';
+        for (var j = 0; j < 3; j++) {
+            var value = (hash >> (j * 8)) & 0xFF;
+            colour += ('00' + value.toString(16)).substr(-2);
+        }
+        return colour;
+    }
+}

imports/Spectral/Component/ScrollHelper.qml

@@ -66,14 +66,13 @@ MouseArea {
     }
 
     onWheel: {
-        var newPos = calculateNewPosition(flickable, wheel);
         // console.warn("Delta: ", wheel.pixelDelta.y);
         // console.warn("Old position: ", flickable.contentY);
         // console.warn("New position: ", newPos);
 
         // Show the scrollbars
         flickable.flick(0, 0);
-        flickable.contentY = newPos;
+        flickable.contentY = calculateNewPosition(flickable, wheel);
         cancelFlickStateTimer.start()
     }
 

imports/Spectral/Component/Timeline/ImageDelegate.qml

@@ -43,14 +43,14 @@ ColumnLayout {
 
         spacing: 4
 
-        ImageItem {
+        Avatar {
             Layout.preferredWidth: 32
             Layout.preferredHeight: 32
             Layout.alignment: Qt.AlignTop
 
             visible: avatarVisible
             hint: author.displayName
-            source: author.paintable
+            source: author.avatarUrl
         }
 
         Label {

imports/Spectral/Component/Timeline/MessageDelegate.qml

@@ -42,14 +42,14 @@ ColumnLayout {
 
         spacing: 4
 
-        ImageItem {
+        Avatar {
             Layout.preferredWidth: 32
             Layout.preferredHeight: 32
             Layout.alignment: Qt.AlignTop
 
             visible: avatarVisible
             hint: author.displayName
-            source: author.paintable
+            source: author.avatarUrl
         }
 
         Label {
@@ -119,12 +119,12 @@ ColumnLayout {
                     contentItem: RowLayout {
                         spacing: 8
 
-                        ImageItem {
+                        Avatar {
                             Layout.preferredWidth: 36
                             Layout.preferredHeight: 36
                             Layout.alignment: Qt.AlignTop
 
-                            source: replyAuthor ? replyAuthor.paintable : null
+                            source: replyAuthor ? replyAuthor.avatarUrl : ""
                         }
 
                         ColumnLayout {

imports/Spectral/Component/qmldir

@@ -6,3 +6,4 @@ ScrollHelper 2.0 ScrollHelper.qml
 AutoListView 2.0 AutoListView.qml
 AutoTextField 2.0 AutoTextField.qml
 SplitView 2.0 SplitView.qml
+Avatar 2.0 Avatar.qml