frontend/smart-hut/src/components/dashboard/devices/VideocamModal.js

44 lines
995 B
JavaScript

import React from 'react';
import Modal from 'react-modal';
const VideocamModal = (props) => (
<Modal
isOpen={!!props.selectedVideo}
contentLabel="Live Cam"
onRequestClose={props.closeModal}
style={{
overlay: {
position: 'fixed',
top: 0,
left: 0,
right: 0,
bottom: 0,
backgroundColor: 'rgba(0,0,0,0.5)',
},
content: {
position: 'absolute',
top: '40px',
left: '40px',
right: '40px',
bottom: '40px',
border: '1px solid #ccc',
background: '#fff',
overflow: 'auto',
WebkitOverflowScrolling: 'touch',
borderRadius: '4px',
outline: 'none',
padding: '20px',
backgroundColor: 'black',
},
}}
>
{props.selectedVideo && (
<video autoPlay loop muted width="100%" height="90%">
<source src={props.url} type="video/mp4" />
</video>
)}
</Modal>
);
export default VideocamModal;