video element styles updated

This commit is contained in:
nklhrstv 2020-04-30 13:38:13 +03:00
parent 82dd0b33a4
commit 0e64751ac7
2 changed files with 17 additions and 3 deletions

View file

@ -2,8 +2,10 @@
const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const { useLiveRef } = require('stremio/common');
const selectVideoImplementation = require('./selectVideoImplementation');
const styles = require('./styles');
const Video = React.forwardRef(({ className, ...props }, ref) => {
const onEndedRef = useLiveRef(props.onEnded);
@ -12,7 +14,7 @@ const Video = React.forwardRef(({ className, ...props }, ref) => {
const onPropChangedRef = useLiveRef(props.onPropChanged);
const onSubtitlesTrackLoadedRef = useLiveRef(props.onSubtitlesTrackLoaded);
const onImplementationChangedRef = useLiveRef(props.onImplementationChanged);
const containerElementRef = React.useRef(null);
const videoElementRef = React.useRef(null);
const videoRef = React.useRef(null);
const dispatch = React.useCallback((args) => {
if (args && args.commandName === 'load' && args.commandArgs) {
@ -22,7 +24,7 @@ const Video = React.forwardRef(({ className, ...props }, ref) => {
} else if (videoRef.current === null || videoRef.current.constructor !== Video) {
dispatch({ commandName: 'destroy' });
videoRef.current = new Video({
containerElement: containerElementRef.current,
containerElement: videoElementRef.current,
shell: args.commandArgs.shell
});
videoRef.current.on('ended', () => {
@ -72,7 +74,9 @@ const Video = React.forwardRef(({ className, ...props }, ref) => {
};
}, []);
return (
<div ref={containerElementRef} className={className} />
<div className={classnames(className, styles['video-container'])}>
<div ref={videoElementRef} className={styles['video']} />
</div>
);
});

View file

@ -0,0 +1,10 @@
.video-container {
.video {
width: 100%;
height: 100%;
* {
font-size: inherit;
}
}
}