import React, { useState, useEffect, useRef } from "react";
import { connect } from "react-redux";
import moment from 'moment'
import { Button, Modal, } from "@douyinfe/semi-ui";
import VideoPlay from './videoPlay.jsx'
import './videoPlayModal.less';

const VideoPlayModal = ({ visible, close, videoObj, name }) => {

    return (
        <Modal
            visible={visible}
            header={null}
            footer={null}
            size={'large'}
            style={{}}
            bodyStyle={{}}
            onCancel={() => { close() }}
            className="videoModal"
        >
            <div id="video_local" style={{ width: '100%' }}>
                <VideoPlay sizeWh={{
                    width: '100%',
                    height: 460,
                    parentWidth: '100%',
                    parentHeight: '100%',
                }}
                    videoObj={videoObj}
                    name={name}
                    height={460}
                    local={true} />
            </div>
        </Modal>
    )
}

function mapStateToProps (state) {
    const { auth } = state;
    return {
        user: auth.user,
    };
}

export default connect(mapStateToProps)(VideoPlayModal);