import React, { memo } from 'react';
import { Player, BigPlayButton } from 'video-react';
import './index.css';
import { IVideoConfig } from './schema';
import logo from 'editorAssets/14-视频.png';

const VideoPlayer = memo((props: IVideoConfig) => {
  const { poster, url, isTpl } = props;
  return (
    <>
      {isTpl ? (
        <div>
          <img src={logo} alt=""></img>
        </div>
      ) : (
          <div style={{ width: '100%', height: 'inherit' }}>
            <video
              style={{
                width: '100%', height: '100%', objectFit: 'cover', zIndex: -100, right: 0, bottom: 0,
                background: `url(${poster[0].url}) no-repeat center center`, backgroundSize: 'cover', overflow: 'hidden'
              }}
              controls={true}
              preload="auto" poster={poster[0].url}
              src={url}>
            </video>
          </div>
        )}
    </>
  );
});

export default VideoPlayer;