Fix linter + merge
This commit is contained in:
parent
12d7be2b6a
commit
a5a4f2ed7d
6 changed files with 7 additions and 119 deletions
|
@ -118,6 +118,6 @@ export default class AudioPlayer extends React.PureComponent<IProps, IState> {
|
||||||
/>
|
/>
|
||||||
<PlaybackClock playback={this.props.playback} defaultDisplaySeconds={0} />
|
<PlaybackClock playback={this.props.playback} defaultDisplaySeconds={0} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,7 +46,7 @@ export default class DurationClock extends React.PureComponent<IProps, IState> {
|
||||||
}
|
}
|
||||||
|
|
||||||
private onTimeUpdate = (time: number[]) => {
|
private onTimeUpdate = (time: number[]) => {
|
||||||
this.setState({durationSeconds: time[1]});
|
this.setState({ durationSeconds: time[1] });
|
||||||
};
|
};
|
||||||
|
|
||||||
public render() {
|
public render() {
|
||||||
|
|
|
@ -15,7 +15,7 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { Playback, PlaybackState } from "../../../voice/Playback";
|
import { Playback, PlaybackState } from "../../../voice/Playback";
|
||||||
import React, {ReactNode} from "react";
|
import React, { ReactNode } from "react";
|
||||||
import { UPDATE_EVENT } from "../../../stores/AsyncStore";
|
import { UPDATE_EVENT } from "../../../stores/AsyncStore";
|
||||||
import PlaybackWaveform from "./PlaybackWaveform";
|
import PlaybackWaveform from "./PlaybackWaveform";
|
||||||
import PlayPauseButton from "./PlayPauseButton";
|
import PlayPauseButton from "./PlayPauseButton";
|
||||||
|
@ -51,7 +51,7 @@ export default class RecordingPlayback extends React.PureComponent<IProps, IStat
|
||||||
}
|
}
|
||||||
|
|
||||||
private onPlaybackUpdate = (ev: PlaybackState) => {
|
private onPlaybackUpdate = (ev: PlaybackState) => {
|
||||||
this.setState({playbackPhase: ev});
|
this.setState({ playbackPhase: ev });
|
||||||
};
|
};
|
||||||
|
|
||||||
public render(): ReactNode {
|
public render(): ReactNode {
|
||||||
|
@ -59,6 +59,6 @@ export default class RecordingPlayback extends React.PureComponent<IProps, IStat
|
||||||
<PlayPauseButton playback={this.props.playback} playbackPhase={this.state.playbackPhase} />
|
<PlayPauseButton playback={this.props.playback} playbackPhase={this.state.playbackPhase} />
|
||||||
<PlaybackClock playback={this.props.playback} />
|
<PlaybackClock playback={this.props.playback} />
|
||||||
<PlaybackWaveform playback={this.props.playback} />
|
<PlaybackWaveform playback={this.props.playback} />
|
||||||
</div>
|
</div>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -105,7 +105,7 @@ export default class SeekBar extends React.PureComponent<IProps, IState> {
|
||||||
max={1}
|
max={1}
|
||||||
value={this.state.percentage}
|
value={this.state.percentage}
|
||||||
step={0.001}
|
step={0.001}
|
||||||
style={{'--fillTo': this.state.percentage} as ISeekCSS}
|
style={{ '--fillTo': this.state.percentage } as ISeekCSS}
|
||||||
disabled={this.props.playbackPhase === PlaybackState.Decoding}
|
disabled={this.props.playbackPhase === PlaybackState.Decoding}
|
||||||
/>;
|
/>;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,112 +0,0 @@
|
||||||
/*
|
|
||||||
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.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React from 'react';
|
|
||||||
import MFileBody from './MFileBody';
|
|
||||||
|
|
||||||
import { decryptFile } from '../../../utils/DecryptFile';
|
|
||||||
import { _t } from '../../../languageHandler';
|
|
||||||
import InlineSpinner from '../elements/InlineSpinner';
|
|
||||||
import { replaceableComponent } from "../../../utils/replaceableComponent";
|
|
||||||
import { mediaFromContent } from "../../../customisations/Media";
|
|
||||||
|
|
||||||
@replaceableComponent("views.messages.MAudioBody")
|
|
||||||
export default class MAudioBody extends React.Component {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.state = {
|
|
||||||
playing: false,
|
|
||||||
decryptedUrl: null,
|
|
||||||
decryptedBlob: null,
|
|
||||||
error: null,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
onPlayToggle() {
|
|
||||||
this.setState({
|
|
||||||
playing: !this.state.playing,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
_getContentUrl() {
|
|
||||||
const media = mediaFromContent(this.props.mxEvent.getContent());
|
|
||||||
if (media.isEncrypted) {
|
|
||||||
return this.state.decryptedUrl;
|
|
||||||
} else {
|
|
||||||
return media.srcHttp;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
const content = this.props.mxEvent.getContent();
|
|
||||||
if (content.file !== undefined && this.state.decryptedUrl === null) {
|
|
||||||
let decryptedBlob;
|
|
||||||
decryptFile(content.file).then(function(blob) {
|
|
||||||
decryptedBlob = blob;
|
|
||||||
return URL.createObjectURL(decryptedBlob);
|
|
||||||
}).then((url) => {
|
|
||||||
this.setState({
|
|
||||||
decryptedUrl: url,
|
|
||||||
decryptedBlob: decryptedBlob,
|
|
||||||
});
|
|
||||||
}, (err) => {
|
|
||||||
console.warn("Unable to decrypt attachment: ", err);
|
|
||||||
this.setState({
|
|
||||||
error: err,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount() {
|
|
||||||
if (this.state.decryptedUrl) {
|
|
||||||
URL.revokeObjectURL(this.state.decryptedUrl);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const content = this.props.mxEvent.getContent();
|
|
||||||
|
|
||||||
if (this.state.error !== null) {
|
|
||||||
return (
|
|
||||||
<span className="mx_MAudioBody">
|
|
||||||
<img src={require("../../../../res/img/warning.svg")} width="16" height="16" />
|
|
||||||
{ _t("Error decrypting audio") }
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
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 16x16 spinner.
|
|
||||||
// Not sure how tall the audio player is so not sure how tall it should actually be.
|
|
||||||
return (
|
|
||||||
<span className="mx_MAudioBody">
|
|
||||||
<InlineSpinner />
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const contentUrl = this._getContentUrl();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span className="mx_MAudioBody">
|
|
||||||
<audio src={contentUrl} controls />
|
|
||||||
<MFileBody {...this.props} decryptedBlob={this.state.decryptedBlob} showGenericPlaceholder={false} />
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -105,6 +105,6 @@ export default class MAudioBody extends React.PureComponent<IProps, IState> {
|
||||||
<AudioPlayer playback={this.state.playback} mediaName={this.props.mxEvent.getContent().body} />
|
<AudioPlayer playback={this.state.playback} mediaName={this.props.mxEvent.getContent().body} />
|
||||||
<MFileBody {...this.props} decryptedBlob={this.state.decryptedBlob} showGenericPlaceholder={false} />
|
<MFileBody {...this.props} decryptedBlob={this.state.decryptedBlob} showGenericPlaceholder={false} />
|
||||||
</span>
|
</span>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue