Implement basic ImageMessages in qml timeline

I suck at sizing so the images in the message are currently hardcoded to
300 pixels in width...

resources/qml/TimelineView.qml

@@ -23,6 +23,8 @@ Rectangle {
 	ListView {
 		id: chat
 
+		cacheBuffer: 4*parent.height
+
 		visible: timelineManager.timeline != null
 		anchors.fill: parent
 
@@ -40,12 +42,14 @@ Rectangle {
 			anchors.left: parent.left
 			anchors.right: parent.right
 			anchors.rightMargin: scrollbar.width
+			height: loader.height
 
 			Loader {
 				id: loader
+				asynchronous: false
 				Layout.fillWidth: true
-				height: item.height
 				Layout.alignment: Qt.AlignTop
+				height: item.height
 
 				source: switch(model.type) {
 					case MtxEvent.Aliases: return "delegates/Aliases.qml"

resources/qml/delegates/ImageMessage.qml

@@ -0,0 +1,14 @@
+import QtQuick 2.6
+
+Item {
+	width: 300
+	height: 300 * eventData.proportionalHeight
+
+	Image {
+		anchors.fill: parent
+
+		source: eventData.url.replace("mxc://", "image://MxcImage/")
+		asynchronous: true
+		fillMode: Image.PreserveAspectFit
+	}
+}

resources/res.qrc

@@ -119,5 +119,6 @@
         <file>qml/Avatar.qml</file>
         <file>qml/delegates/TextMessage.qml</file>
         <file>qml/delegates/NoticeMessage.qml</file>
+        <file>qml/delegates/ImageMessage.qml</file>
     </qresource>
 </RCC>