actually disable autoplay in embeds

This commit is contained in:
jessop 2020-01-31 13:25:48 -05:00 committed by Sean Yesmunt
parent bf0ff8ee84
commit a1e24d6dcc
2 changed files with 27 additions and 4 deletions

View file

@ -1,11 +1,12 @@
// @flow
import React, { useRef, useEffect, useState } from 'react';
import React, { useRef, useEffect, useState, useContext } from 'react';
import { stopContextMenu } from 'util/context-menu';
import videojs from 'video.js/dist/alt/video.core.novtt.min.js';
import 'video.js/dist/alt/video-js-cdn.min.css';
import eventTracking from 'videojs-event-tracking';
import isUserTyping from 'util/detect-typing';
import analytics from 'analytics';
import { EmbedContext } from 'page/embedWrapper/view';
const F11_KEYCODE = 122;
const SPACE_BAR_KEYCODE = 32;
@ -21,8 +22,15 @@ const SEEK_FORWARD_KEYCODE = ARROW_RIGHT_KEYCODE;
const SEEK_BACKWARD_KEYCODE = ARROW_LEFT_KEYCODE;
const SEEK_STEP = 10; // time to seek in seconds
const VIDEO_JS_OPTIONS: { poster?: string } = {
type VideoJSOptions = {
controls: boolean,
autoplay: boolean,
preload: string,
playbackRates: Array<number>,
responsive: boolean,
poster?: string,
};
const VIDEO_JS_OPTIONS: VideoJSOptions = {
controls: true,
autoplay: true,
preload: 'auto',
@ -51,6 +59,11 @@ function VideoViewer(props: Props) {
const claimId = claim && claim.claim_id;
const videoRef = useRef();
const isAudio = contentType.includes('audio');
const embedded = useContext(EmbedContext);
if (embedded) {
VIDEO_JS_OPTIONS.autoplay = false;
}
let forceTypes = [
'video/quicktime',
'application/x-ext-mkv',

View file

@ -7,6 +7,8 @@ type Props = {
resolveUri: string => void,
claim: Claim,
};
// $FlowFixMe apparently flow thinks this is wrong.
export const EmbedContext = React.createContext();
const EmbedWrapperPage = (props: Props) => {
const { resolveUri, claim, uri } = props;
useEffect(() => {
@ -15,7 +17,15 @@ const EmbedWrapperPage = (props: Props) => {
}
}, []);
return <div className={'embed__wrapper'}>{claim && <FileRender uri={uri} embedded />}</div>;
return (
<div className={'embed__wrapper'}>
{claim && (
<EmbedContext.Provider value>
<FileRender uri={uri} embedded />
</EmbedContext.Provider>
)}
</div>
);
};
export default EmbedWrapperPage;