Added backend source URL for camera
This commit is contained in:
parent
a097ee447c
commit
a15ec55bb4
3 changed files with 36 additions and 36 deletions
Binary file not shown.
|
@ -4,6 +4,7 @@ import React, { Component } from "react";
|
|||
import { StyledDivCamera } from "./styleComponents";
|
||||
import { Grid } from "semantic-ui-react";
|
||||
import { RemoteService } from "../../../remote";
|
||||
import { endpointURL } from "../../../endpoint";
|
||||
import { connect } from "react-redux";
|
||||
import VideocamModal from "./VideocamModal";
|
||||
|
||||
|
@ -25,13 +26,17 @@ class Videocam extends Component {
|
|||
});
|
||||
};
|
||||
|
||||
get url() {
|
||||
return endpointURL() + this.props.device.path;
|
||||
}
|
||||
|
||||
render() {
|
||||
const VideocamView = (
|
||||
<div>
|
||||
<StyledDivCamera>
|
||||
<div onClick={this.openModal}>
|
||||
<video autoPlay loop muted width="100%" height="auto">
|
||||
<source src="paranormal-activity.mp4" type="video/mp4" />
|
||||
<source src={this.url} type="video/mp4" />
|
||||
</video>
|
||||
</div>
|
||||
</StyledDivCamera>
|
||||
|
@ -41,6 +46,7 @@ class Videocam extends Component {
|
|||
<VideocamModal
|
||||
selectedVideo={this.state.selectedVideo}
|
||||
closeModal={this.closeModal}
|
||||
url={this.url}
|
||||
/>
|
||||
</Grid.Column>
|
||||
</Grid.Row>
|
||||
|
|
|
@ -1,41 +1,35 @@
|
|||
import React from 'react';
|
||||
import Modal from 'react-modal';
|
||||
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%)',
|
||||
},
|
||||
};
|
||||
|
||||
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="paranormal-activity.mp4" type='video/mp4' />
|
||||
</video>
|
||||
}
|
||||
<Button
|
||||
fluid
|
||||
primary
|
||||
onClick={props.closeModal}
|
||||
>
|
||||
Close
|
||||
</Button>
|
||||
</Modal>
|
||||
);
|
||||
<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;
|
||||
export default VideocamModal;
|
||||
|
|
Loading…
Reference in a new issue