imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Enable support for image, video and audio files

Browse source
This commit is contained in:
Jaiwanth 2021-05-31 21:01:19 +05:30
parent 409213ceb4
commit 59c1b67b7d
8 changed files with 86 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/views/messages/MVideoBody.tsx
View file

@ -29,6 +29,8 @@ interface IProps {
mxEvent: any;
/* called when the video has loaded */
onHeightChanged: () => void;
/* used to refer to the local file while exporting */
mediaSrc?: string;
}
interface IState {
@ -76,6 +78,7 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
}
private getContentUrl(): string|null {
if (this.props.mediaSrc) return this.props.mediaSrc;
const media = mediaFromContent(this.props.mxEvent.getContent());
if (media.isEncrypted) {
return this.state.decryptedUrl;
@ -90,6 +93,9 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
}
private getThumbUrl(): string|null {
// there's no need of thumbnail when the content is local
if (this.props.mediaSrc) return null;
const content = this.props.mxEvent.getContent();
const media = mediaFromContent(content);
if (media.isEncrypted) {
@ -184,6 +190,11 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
this.props.onHeightChanged();
}
private getFileBody = () => {
if (this.props.mediaSrc) return null;
return <MFileBody {...this.props} decryptedBlob={this.state.decryptedBlob} showGenericPlaceholder={false} />;
}
render() {
const content = this.props.mxEvent.getContent();
const autoplay = SettingsStore.getValue("autoplayGifsAndVideos");
@ -197,7 +208,7 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
);
}
// Important: If we aren't autoplaying and we haven't decrypred it yet, show a video with a poster.
// Important: If we aren't autoplaying and we haven't decrypted it yet, show a video with a poster.
if (content.file !== undefined && this.state.decryptedUrl === null && autoplay) {
// Need to decrypt the attachment
// The attachment is decrypted in componentDidMount.
@ -229,6 +240,8 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
preload = "none";
}
}
const fileBody = this.getFileBody();
return (
<span className="mx_MVideoBody">
<video
@ -246,7 +259,7 @@ export default class MVideoBody extends React.PureComponent<IProps, IState> {
onPlay={this.videoOnPlay}
>
</video>
<MFileBody {...this.props} decryptedBlob={this.state.decryptedBlob} showGenericPlaceholder={false} />
{ fileBody }
</span>
);
}