From bfec6d4ed9beab7709f1cc9d6e5175294c0d617e Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Wed, 13 Apr 2016 00:00:24 +0100
Subject: [PATCH] merge aviral's audio player

---
 src/ContentMessages.js                        |  5 +-
 src/component-index.js                        |  1 +
 src/components/views/messages/MAudioBody.js   | 50 +++++++++++++++++++
 src/components/views/messages/MessageEvent.js |  4 ++
 4 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 src/components/views/messages/MAudioBody.js

diff --git a/src/ContentMessages.js b/src/ContentMessages.js
index bbd714fa57..56e3499eae 100644
--- a/src/ContentMessages.js
+++ b/src/ContentMessages.js
@@ -74,10 +74,13 @@ class ContentMessages {
         var def = q.defer();
         if (file.type.indexOf('image/') == 0) {
             content.msgtype = 'm.image';
-            infoForImageFile(file).then(function(imageInfo) {
+            infoForImageFile(file).then(function (imageInfo) {
                 extend(content.info, imageInfo);
                 def.resolve();
             });
+        } else if (file.type.indexOf('audio/') == 0) {
+            content.msgtype = 'm.audio';
+            def.resolve();
         } else {
             content.msgtype = 'm.file';
             def.resolve();
diff --git a/src/component-index.js b/src/component-index.js
index b5f5dd0a53..0cb7e257a0 100644
--- a/src/component-index.js
+++ b/src/component-index.js
@@ -68,6 +68,7 @@ module.exports.components['views.messages.MFileBody'] = require('./components/vi
 module.exports.components['views.messages.MImageBody'] = require('./components/views/messages/MImageBody');
 module.exports.components['views.messages.MVideoBody'] = require('./components/views/messages/MVideoBody');
 module.exports.components['views.messages.MessageEvent'] = require('./components/views/messages/MessageEvent');
+module.exports.components['views.messages.MAudioBody'] = require('./components/views/messages/MAudioBody');
 module.exports.components['views.messages.TextualBody'] = require('./components/views/messages/TextualBody');
 module.exports.components['views.messages.TextualEvent'] = require('./components/views/messages/TextualEvent');
 module.exports.components['views.messages.UnknownBody'] = require('./components/views/messages/UnknownBody');
diff --git a/src/components/views/messages/MAudioBody.js b/src/components/views/messages/MAudioBody.js
new file mode 100644
index 0000000000..6113fa7c6c
--- /dev/null
+++ b/src/components/views/messages/MAudioBody.js
@@ -0,0 +1,50 @@
+/*
+ Copyright 2016 OpenMarket Ltd
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+
+'use strict';
+
+import React from 'react';
+import MFileBody from './MFileBody';
+
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import sdk from '../../../index';
+
+export default class MAudioBody extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            playing: false
+        }
+    }
+
+    onPlayToggle() {
+        this.setState({
+            playing: !this.state.playing
+        });
+    }
+
+    render() {
+        var content = this.props.mxEvent.getContent();
+        var cli = MatrixClientPeg.get();
+
+        return (
+            <span className="mx_MAudioBody">
+                <audio src={cli.mxcUrlToHttp(content.url)} controls />
+                <MFileBody {...this.props} />
+            </span>
+        );
+    }
+}
diff --git a/src/components/views/messages/MessageEvent.js b/src/components/views/messages/MessageEvent.js
index 6dcc8de627..35eafbff22 100644
--- a/src/components/views/messages/MessageEvent.js
+++ b/src/components/views/messages/MessageEvent.js
@@ -55,6 +55,7 @@ module.exports = React.createClass({
             'm.emote': sdk.getComponent('messages.TextualBody'),
             'm.image': sdk.getComponent('messages.MImageBody'),
             'm.file': sdk.getComponent('messages.MFileBody'),
+            'm.audio': sdk.getComponent('messages.MAudioBody'),
             'm.video': sdk.getComponent('messages.MVideoBody')
         };
 
@@ -63,6 +64,9 @@ module.exports = React.createClass({
         var BodyType = UnknownBody;
         if (msgtype && bodyTypes[msgtype]) {
             BodyType = bodyTypes[msgtype];
+        } else if (content.url) {
+            // Fallback to MFileBody if there's a content URL
+            BodyType = bodyTypes['m.file'];
         }
 
         return <BodyType ref="body" mxEvent={this.props.mxEvent} highlights={this.props.highlights}