70 lines
1.6 KiB
JavaScript
70 lines
1.6 KiB
JavaScript
// vim: set ts=2 sw=2 et tw=80:
|
|
|
|
|
|
import React, { Component } from "react";
|
|
import {
|
|
StyledDiv
|
|
} from "./VideocmStyle";
|
|
import {Grid } from "semantic-ui-react";
|
|
import { RemoteService } from "../../../remote";
|
|
import { connect } from "react-redux";
|
|
import VideocamModal from "./VideocamModal";
|
|
|
|
|
|
class Videocam extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = { selectedVideo: undefined};
|
|
}
|
|
|
|
openModal = () => {
|
|
this.setState((state) => {
|
|
return {selectedVideo: true}
|
|
|
|
});
|
|
};
|
|
|
|
closeModal = () => {
|
|
this.setState((state) => {
|
|
return {selectedVideo:undefined}
|
|
})
|
|
}
|
|
|
|
render() {
|
|
|
|
const VideocamView = (
|
|
<div>
|
|
<StyledDiv>
|
|
<div onClick={this.openModal}>
|
|
<video autoPlay loop muted width= "100%" height="auto">
|
|
<source src="paranormal-activity.mp4" type='video/mp4' />
|
|
</video>
|
|
</div>
|
|
</StyledDiv>
|
|
<Grid columns="equal" divide padded>
|
|
<Grid.Row textAlign="center">
|
|
<Grid.Column>
|
|
<VideocamModal
|
|
selectedVideo = {this.state.selectedVideo}
|
|
closeModal = {this.closeModal}
|
|
/>
|
|
</Grid.Column>
|
|
</ Grid.Row>
|
|
</Grid>
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<div>
|
|
{VideocamView}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state, ownProps) => ({
|
|
device: state.devices[ownProps.id],
|
|
});
|
|
const VideocamContainer = connect(mapStateToProps, RemoteService)(Videocam);
|
|
export default VideocamContainer;
|