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

36 lines
765 B
JavaScript

import React from "react";
import Modal from "react-modal";
import { Button } from "semantic-ui-react";
const ModalStyle = {
content: {
top: "20%",
left: "45%",
right: "auto",
bottom: "auto",
marginRight: "-40%",
width: "80%",
transform: "translate(-40%, -10%)",
},
};
const VideocamModal = (props) => (
<Modal
isOpen={!!props.selectedVideo}
contentLabel="Live Cam"
onRequestClose={props.closeModal}
style={ModalStyle}
>
{props.selectedVideo && (
<video autoPlay loop muted width="100%" height="auto">
<source src={props.url} type="video/mp4" />
</video>
)}
<Button fluid primary onClick={props.closeModal}>
Close
</Button>
</Modal>
);
export default VideocamModal;