diff --git a/smart-hut/src/components/dashboard/devices/Curtain.js b/smart-hut/src/components/dashboard/devices/Curtain.js new file mode 100644 index 0000000..40b6b52 --- /dev/null +++ b/smart-hut/src/components/dashboard/devices/Curtain.js @@ -0,0 +1,102 @@ +import React, {Component} from "react"; + +import { RemoteService } from "../../../remote"; +import { connect } from "react-redux"; +import {Slider} from "@material-ui/core"; + +class Curtain extends Component { + constructor (props){ + super(props); + this.state = { intensity: this.props.device.intensity, timeout: null }; + + this.setIntensity = this.setIntensity.bind(this); + } + + //getters + get turnedOn() { + return this.props.device.on; + } + + get intensity() { + return this.props.device.intensity || 0; + } + + onClickDevice = () => { + const on = !this.turnedOn; + this.props + .saveDevice({ ...this.props.device, on }) + .catch((err) => console.error("curtains update error", err)); + }; + + setIntensity(intensity) { + intensity *= 100; + + if (this.state.timeout) { + clearTimeout(this.state.timeout); + } + + this.setState({ + intensity, + timeout: setTimeout(() => { + this.saveIntensity(); + this.setState({ + intensity: this.state.intensity, + timeout: null, + }); + }, 100), + }); + } + + saveIntensity = () => { + const intensity = Math.round(this.state.intensity); + this.props + .saveDevice({ ...this.props.device, intensity }) + .catch((err) => console.error("curtains update error", err)); + }; + + helper=()=>{ + if(this.props.device.intensity>=90){ + this.setIntensity(1); + this.saveIntensity(); + }else { + this.setIntensity(this.props.device.intensity / 100 + 0.10); + this.saveIntensity(); + } + }; + + helper2=()=>{ + if(this.props.device.intensity<=10){ + this.setIntensity(0); + this.saveIntensity(); + }else { + this.setIntensity(this.props.device.intensity / 100 - 0.10); + this.saveIntensity(); + } + }; + + helper3=(a)=>{ + //console.log(a); + this.setIntensity(a/100); + this.saveIntensity(); + }; +///*this took me way too much more time than it should have*/ + render(){ + return

{this.props.device.intensity}

+ + {this.helper3(val)}} + /> + + + +
; + } +} + + +const mapStateToProps = (state, ownProps) => ({ + device: state.devices[ownProps.id], +}); +const CurtainContainer = connect(mapStateToProps, RemoteService)(Curtain); +export default CurtainContainer; \ No newline at end of file diff --git a/smart-hut/src/components/dashboard/devices/Device.js b/smart-hut/src/components/dashboard/devices/Device.js index a267ce0..b02d9a2 100644 --- a/smart-hut/src/components/dashboard/devices/Device.js +++ b/smart-hut/src/components/dashboard/devices/Device.js @@ -5,6 +5,8 @@ import Sensor from "./Sensor"; import { ButtonDimmer, KnobDimmer } from "./Dimmer"; import Switcher from "./Switch"; import Videocam from "./Videocam"; +import Curtains from "./Curtain"; +import Thermostat from "./Thermostats"; import { Segment, Grid, Header, Button, Icon } from "semantic-ui-react"; import { RemoteService } from "../../../remote"; import { connect } from "react-redux"; @@ -32,6 +34,10 @@ class Device extends React.Component { renderDeviceComponent() { switch (this.props.stateOrDevice.kind) { + case "curtains": + return + case "thermostat": + return case "regularLight": return ; case "sensor": diff --git a/smart-hut/src/components/dashboard/devices/NewDevice.js b/smart-hut/src/components/dashboard/devices/NewDevice.js index d5fa59c..d150a50 100644 --- a/smart-hut/src/components/dashboard/devices/NewDevice.js +++ b/smart-hut/src/components/dashboard/devices/NewDevice.js @@ -117,10 +117,10 @@ class NewDevice extends Component { switch (this.state.typeOfDevice) { //trying to make securityCamera work - case "securityCamera": + //case "securityCamera": // data.path="/security_camera_videos/security_camera_1.mp4"; // data.on=false; - break; + //break; //trying to make thermostat work case "thermostat": data.targetTemperature=0; @@ -158,10 +158,6 @@ class NewDevice extends Component { render() { const deviceOptions = [ //stuff - {key:"securityCamera", - text:"SecurityCamera", - value:"securityCamera", - image:{}}, {key:"thermostat", text:"Thermostat", value:"thermostat", diff --git a/smart-hut/src/components/dashboard/devices/SecurityCamera b/smart-hut/src/components/dashboard/devices/SecurityCamera new file mode 100644 index 0000000..c1ed4f8 --- /dev/null +++ b/smart-hut/src/components/dashboard/devices/SecurityCamera @@ -0,0 +1,36 @@ +import React, {Component} from "react"; + +import { RemoteService } from "../../../remote"; +import { connect } from "react-redux"; + + + + +class SecurityCamera extends Component{ + constructor (props){ + super(props); + this.state = { path: this.props.device.path, on:this.props.device.on, timeout: null }; + + // this.setIntensity = this.setIntensity.bind(this); + } + + + + render(){ + return

"mode is: "{this.props.device.mode}

+

"internalsensortemperature is: "{this.props.device.internalSensorTemperature}

+

"targetTemperature is: "{this.props.device.targetTemperature}

+

"measuredtemperature is: "{this.props.device.measuredTemperature}

+

{this.props.device.on}

+ +
; + } +} + + +const mapStateToProps = (state, ownProps) => ({ + device: state.devices[ownProps.id], +}); + +const SecurityCameraContainer = connect(mapStateToProps, RemoteService)(SecurityCamera); +export default SecurityCameraContainer; \ No newline at end of file diff --git a/smart-hut/src/components/dashboard/devices/Thermostats.js b/smart-hut/src/components/dashboard/devices/Thermostats.js new file mode 100644 index 0000000..eeba407 --- /dev/null +++ b/smart-hut/src/components/dashboard/devices/Thermostats.js @@ -0,0 +1,133 @@ +import React, {Component} from "react"; + +import { RemoteService } from "../../../remote"; +import { connect } from "react-redux"; + + +//not quite working yet +class Thermostats extends Component{ + constructor (props){ + super(props); + this.state = {targetTemperature: this.props.device.targetTemperature, + internalSensorTemperature: this.props.device.internalSensorTemperature, + mode: this.props.device.mode, + measuredTemperature: this.props.device.measuredTemperature, + useExternalSensors: this.props.device.useExternalSensors, + timeout: null }; + this.setMode=this.setMode.bind(this); + this.setTargetTemperature=this.setTargetTemperature.bind(this); + this.setInternalSensorTemperature=this.setInternalSensorTemperature.bind(this); + } + + //getters + get getMode(){ + return this.props.device.mode; + } + + get getTargetTemperature(){ + return this.props.device.targetTemperature; + } + + get getInternalSensorTemperature(){ + return this.props.device.internalSensorTemperature; + } + + get getMeasuredTemperature(){ + return this.props.device.measuredTemperature; + } + + get getUseExternalSensors(){ + return this.props.device.useExternalSensors; + } + + setMode(mode){ + if (this.state.timeout) { + clearTimeout(this.state.timeout); + } + + //i came to the conclusion that is not possible to set mode. + this.mode="HEATING"; + + } + + onClickDevice = () => { + const on = !this.turnedOn; + this.props + .saveDevice({ ...this.props.device, on }) + .catch((err) => console.error("regular light update error", err)); + }; + + + //It seems to work + saveTargetTemperature(targetTemperature){ + this.props + .saveDevice({ ...this.props.device, targetTemperature }) + .catch((err) => console.error(" update error", err)); + + } + + setTargetTemperature(newTemp){ + if (this.state.timeout) { + clearTimeout(this.state.timeout); + } + + this.setState({ + newTemp, + timeout: setTimeout(() => { + this.saveTargetTemperature(newTemp); + this.setState({ + targetTemperature: this.state.targetTemperature, + timeout: null, + }); + }, 100), + }); + } + + //I have no idea why it doesn't want to update the temperature + saveInternalSensorTemperature(internalSensorTemperature){ + this.props + .saveDevice({ ...this.props.device, internalSensorTemperature }) + .catch((err) => console.error(" update error", err)); + } + + setInternalSensorTemperature(newTemp){ + if (this.state.timeout) { + clearTimeout(this.state.timeout); + } + + this.setState({ + newTemp, + timeout: setTimeout(() => { + this.saveInternalSensorTemperature(newTemp); + this.setState({ + internalSensorTemperature: this.state.internalSensorTemperature, + timeout: null, + }); + }, 100), + }); + } + + helperMode=()=>{ + //this.setMode("HEATING"); + this.setTargetTemperature(20); + //this.setInternalSensorTemperature(42); + } + + render(){ + return

"mode is: "{this.props.device.mode}

+

"internalsensortemperature is: "{this.props.device.internalSensorTemperature}

+

"targetTemperature is: "{this.props.device.targetTemperature}

+

"measuredtemperature is: "{this.props.device.measuredTemperature}

+

{this.props.device.on}

+ +
; + } + +} + +const mapStateToProps = (state, ownProps) => ({ + device: state.devices[ownProps.id], +}); + +const ThermostatContainer = connect(mapStateToProps, RemoteService)(Thermostats); +export default ThermostatContainer; \ No newline at end of file