[konheko] Add basic audio player and improve video player

qml/pages/Message.qml

@@ -136,6 +136,14 @@ Item {
 
         }
 
+        DelegateChoice {
+            roleValue: EventType.AudioMessage
+
+            AudioMessage {
+            }
+
+        }
+
         DelegateChoice {
             Placeholder {
             }

qml/pages/delegates/AudioMessage.qml

+import QtMultimedia 5.6
+import QtQuick 2.0
+import QtQuick.Layouts 1.0
+import Sailfish.Media 1.0
+import Sailfish.Silica 1.0
+
+ColumnLayout {
+    id: col
+
+    Item {
+        id: videoContainer
+
+        width: bubble.fullMessageWidth
+        height: width / 2
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: {
+                if (player.download == undefined)
+                    player.download = mxcDownloader.download(model.Url);
+
+            }
+        }
+
+        Image {
+            id: downloadButton
+
+            anchors.centerIn: parent
+            visible: player.status == MediaPlayer.NoMedia && player.download == undefined
+            source: "image://theme/icon-m-cloud-download"
+        }
+
+        BusyIndicator {
+            id: busy
+
+            size: BusyIndicatorSize.Medium
+            anchors.centerIn: parent
+            running: player.status == MediaPlayer.NoMedia && player.download != undefined
+        }
+
+        MediaPlayer {
+            id: player
+
+            property var download: mxcDownloader.cached(model.Url) ? mxcDownloader.download(model.Url) : undefined
+
+            source: download ? download.location : undefined
+            autoLoad: true
+        }
+
+        MediaPlayerControlsPanel {
+            id: overlay
+
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.bottom: parent.bottom
+            z: 100
+            duration: player.duration / 1000
+            position: player.position / 1000
+            playing: player.playbackState == MediaPlayer.PlayingState
+            showMenu: false
+            open: player.hasAudio
+            onSliderReleased: {
+                player.seek(value * 1000);
+            }
+            onPreviousClicked: player.seek(0)
+            onPlayPauseClicked: {
+                if (player.playbackState == MediaPlayer.PlayingState)
+                    player.pause();
+                else
+                    player.play();
+            }
+        }
+
+    }
+
+    Text {
+        id: body
+
+        text: model.Body
+        color: Theme.secondaryColor
+        wrapMode: Text.Wrap
+        width: chatView.width
+        font.pixelSize: Theme.fontSizeTiny
+    }
+
+}

qml/pages/delegates/VideoMessage.qml

@@ -31,19 +31,11 @@ ColumnLayout {
                 }
             }
 
-            Rectangle {
-                color: '#00000050'
-                anchors.fill: parent
-                visible: thumb.status == Image.Error
-                height: chatView.width
-            }
-
             Image {
                 id: downloadButton
 
                 anchors.centerIn: thumb
-                visible: thumb.status == Image.Ready || thumb.status == Image.Error
-                //source: "image://theme/icon-m-play"
+                visible: player.status == MediaPlayer.NoMedia && player.download == undefined
                 source: "image://theme/icon-m-cloud-download"
             }
 
@@ -52,15 +44,14 @@ ColumnLayout {
 
                 size: BusyIndicatorSize.Medium
                 anchors.centerIn: thumb
-                running: thumb.status == Image.Loading
+                running: player.status == MediaPlayer.NoMedia && player.download != undefined
             }
 
         }
 
-        Rectangle {
+        Item {
             anchors.fill: parent
-            visible: player.download != undefined
-            color: "black"
+            visible: player.hasVideo
 
             MediaPlayer {
                 id: player
@@ -76,7 +67,7 @@ ColumnLayout {
 
                 source: player
                 anchors.fill: parent
-                visible: player.download != undefined
+                visible: player.hasVideo
 
                 MouseArea {
                     anchors.fill: parent
@@ -118,7 +109,7 @@ ColumnLayout {
     Text {
         id: body
 
-        text: model.FormattedBody + model.Url
+        text: model.Body
         color: Theme.secondaryColor
         wrapMode: Text.Wrap
         width: chatView.width