39 lines
851 B
JavaScript
39 lines
851 B
JavaScript
import React from 'react';
|
|
import Modal from 'react-modal';
|
|
import { Button } from 'semantic-ui-react';
|
|
|
|
const modal = {
|
|
opacity: 0,
|
|
alignItems: 'center',
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
transition: 'opacity 200ms ease-in-out',
|
|
background: 'grey',
|
|
color: 'white',
|
|
maxWidth: '2rem',
|
|
outline: 'none',
|
|
padding: '2rem',
|
|
textAlign: 'center',
|
|
maxHeight: '50vh',
|
|
};
|
|
|
|
const VideocamModal = (props) => (
|
|
<Modal
|
|
isOpen={!!props.selectedVideo}
|
|
contentLabel="Live Cam"
|
|
onRequestClose={props.closeModal}
|
|
style={modal}
|
|
>
|
|
{props.selectedVideo && (
|
|
<video autoPlay loop muted width="100%" height="90%">
|
|
<source src={props.url} type="video/mp4" />
|
|
</video>
|
|
)}
|
|
<Button fluid primary onClick={props.closeModal}>
|
|
Close
|
|
</Button>
|
|
</Modal>
|
|
);
|
|
|
|
export default VideocamModal;
|