diff --git a/src/components/views/messages/MAudioBody.js b/src/components/views/messages/MAudioBody.js
index 6113fa7c6c..375b2431c3 100644
--- a/src/components/views/messages/MAudioBody.js
+++ b/src/components/views/messages/MAudioBody.js
@@ -21,28 +21,75 @@ import MFileBody from './MFileBody';
import MatrixClientPeg from '../../../MatrixClientPeg';
import sdk from '../../../index';
+import { decryptFile } from '../../../utils/DecryptFile';
export default class MAudioBody extends React.Component {
constructor(props) {
super(props);
this.state = {
- playing: false
+ playing: false,
+ decryptedUrl: null,
}
}
-
onPlayToggle() {
this.setState({
playing: !this.state.playing
});
}
+ _getContentUrl() {
+ var content = this.props.mxEvent.getContent();
+ if (content.file !== undefined) {
+ return this.state.decryptedUrl;
+ } else {
+ return MatrixClientPeg.get().mxcUrlToHttp(content.url);
+ }
+ }
+
+ componentDidMount() {
+ var content = this.props.mxEvent.getContent();
+ if (content.file !== undefined && this.state.decryptedUrl === null) {
+ decryptFile(content.file).then((blob) => {
+ if (!this._unmounted) {
+ this.setState({
+ decryptedUrl: window.URL.createObjectURL(blob),
+ });
+ }
+ }).catch((err) => {
+ console.warn("Unable to decrypt attachment: ", err)
+ // Set a placeholder image when we can't decrypt the image.
+ this.refs.image.src = "img/warning.svg";
+ });
+ }
+ }
+
+ componentWillUnmount() {
+ this._unmounted = true;
+ if (this.state.decryptedUrl) {
+ window.URL.revokeObjectURL(this.state.decryptedUrl);
+ }
+ }
+
render() {
var content = this.props.mxEvent.getContent();
- var cli = MatrixClientPeg.get();
+
+ if (content.file !== undefined && this.state.decryptedUrl === null) {
+ // Need to decrypt the attachment
+ // The attachment is decrypted in componentDidMount.
+ // For now add an img tag with a spinner.
+ return (
+
+
+
+ );
+ }
+
+ var contentUrl = this._getContentUrl();
return (
-
+
);