Add support to play .mov files (#672)

* update allowed mimetypes

* fix .mov files failing to play in Chromium

* add check for  before passing to FileReader

* add missing semi-colon
This commit is contained in:
James 2022-07-18 17:33:11 +01:00 committed by GitHub
parent 1979646b4b
commit e6f395c643
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 2 deletions

View file

@ -12,15 +12,19 @@ import DownloadSVG from '../../../../public/res/ic/outlined/download.svg';
import ExternalSVG from '../../../../public/res/ic/outlined/external.svg'; import ExternalSVG from '../../../../public/res/ic/outlined/external.svg';
import PlaySVG from '../../../../public/res/ic/outlined/play.svg'; import PlaySVG from '../../../../public/res/ic/outlined/play.svg';
// https://github.com/matrix-org/matrix-react-sdk/blob/a9e28db33058d1893d964ec96cd247ecc3d92fc3/src/utils/blobs.ts#L73 // https://github.com/matrix-org/matrix-react-sdk/blob/cd15e08fc285da42134817cce50de8011809cd53/src/utils/blobs.ts#L73
const ALLOWED_BLOB_MIMETYPES = [ const ALLOWED_BLOB_MIMETYPES = [
'image/jpeg', 'image/jpeg',
'image/gif', 'image/gif',
'image/png', 'image/png',
'image/apng',
'image/webp',
'image/avif',
'video/mp4', 'video/mp4',
'video/webm', 'video/webm',
'video/ogg', 'video/ogg',
'video/quicktime',
'audio/mp4', 'audio/mp4',
'audio/webm', 'audio/webm',
@ -38,6 +42,10 @@ function getBlobSafeMimeType(mimetype) {
if (!ALLOWED_BLOB_MIMETYPES.includes(mimetype)) { if (!ALLOWED_BLOB_MIMETYPES.includes(mimetype)) {
return 'application/octet-stream'; return 'application/octet-stream';
} }
// Required for Chromium browsers
if (mimetype === 'video/quicktime') {
return 'video/mp4';
}
return mimetype; return mimetype;
} }

View file

@ -46,7 +46,12 @@ function loadVideo(videoFile) {
reader.onerror = (e) => { reader.onerror = (e) => {
reject(e); reject(e);
}; };
reader.readAsDataURL(videoFile); if (videoFile.type === 'video/quicktime') {
const quicktimeVideoFile = new File([videoFile], videoFile.name, { type: 'video/mp4' });
reader.readAsDataURL(quicktimeVideoFile);
} else {
reader.readAsDataURL(videoFile);
}
}); });
} }
function getVideoThumbnail(video, width, height, mimeType) { function getVideoThumbnail(video, width, height, mimeType) {