LogalDeveloper/owncast
0
Fork 0
Code Activity

Add initiallyMuted query parameter to embed player (#2539)

Browse Source 
* Add query param to initially mute embed player

* Add stories for embed player

* Improve VideoJS typing
This commit is contained in:
Michael David Kuckuk
2023-01-01 01:08:54 +01:00
committed by GitHub
parent db3e20b480
commit 2f2300db8d
6 changed files with 117 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/components/video/VideoJS/VideoJS.tsx
View File

@@ -1,17 +1,17 @@
import React, { FC } from 'react';
import videojs from 'video.js';
import videojs, { VideoJsPlayer, VideoJsPlayerOptions } from 'video.js';
import styles from './VideoJS.module.scss';
require('video.js/dist/video-js.css');
export type VideoJSProps = {
options: any;
onReady: (player: videojs.Player, vjsInstance: videojs) => void;
options: VideoJsPlayerOptions;
onReady: (player: videojs.Player, vjsInstance: typeof videojs) => void;
};
export const VideoJS: FC<VideoJSProps> = ({ options, onReady }) => {
const videoRef = React.useRef(null);
const playerRef = React.useRef(null);
const videoRef = React.useRef<HTMLVideoElement | null>(null);
const playerRef = React.useRef<VideoJsPlayer | null>(null);
React.useEffect(() => {
// Make sure Video.js player is only initialized once
@@ -19,7 +19,7 @@ export const VideoJS: FC<VideoJSProps> = ({ options, onReady }) => {
const videoElement = videoRef.current;
// eslint-disable-next-line no-multi-assign
const player = (playerRef.current = videojs(videoElement, options, () => {
const player: VideoJsPlayer = (playerRef.current = videojs(videoElement, options, () => {
console.debug('player is ready');
return onReady && onReady(player, videojs);
}));