{} : this.onClickDevice}>
+
-
- {this.props.device.name} ({this.props.device.id})
-
+ Light
@@ -155,3 +183,23 @@ export default class Light extends Component {
);
}
}
+
+const mapStateToProps = (state, ownProps) => ({
+ get stateOrDevice() {
+ if (state.active.activeTab === "Devices") {
+ return state.devices[ownProps.id];
+ } else {
+ return state.sceneStates[ownProps.id];
+ }
+ },
+ get device() {
+ if (state.active.activeTab === "Devices") {
+ return state.devices[ownProps.id];
+ } else {
+ return state.devices[state.sceneStates[ownProps.id].deviceId];
+ }
+ },
+});
+
+const LightContainer = connect(mapStateToProps, RemoteService)(Light);
+export default LightContainer;
diff --git a/smart-hut/src/components/dashboard/devices/NewDevice.js b/smart-hut/src/components/dashboard/devices/NewDevice.js
index 5616ae0..7897c9e 100644
--- a/smart-hut/src/components/dashboard/devices/NewDevice.js
+++ b/smart-hut/src/components/dashboard/devices/NewDevice.js
@@ -9,6 +9,8 @@ import {
Input,
Modal,
} from "semantic-ui-react";
+import { RemoteService } from "../../../remote";
+import { connect } from "react-redux";
const StyledDiv = styled.div`
background-color: #505bda;
@@ -29,7 +31,7 @@ const StyledDiv = styled.div`
}
`;
-export default class NewDevice extends Component {
+class NewDevice extends Component {
constructor(props) {
super(props);
this.state = {
@@ -86,69 +88,79 @@ export default class NewDevice extends Component {
this.setState({ lightsAttached: d.value });
};
- createDevice() {
+ async createDevice() {
// Connect to the backend and create device here.
const data = {
- params: {
- name: this.state.deviceName,
- },
- device: this.state.motion ? "motionSensor" : this.state.typeOfDevice,
+ id: null,
+ roomId: this.props.activeRoom,
+ name: this.state.deviceName,
+ kind: this.state.motion ? "motionSensor" : this.state.typeOfDevice,
+ };
+ let outputs = null;
+
+ const defaultNames = {
+ regularLight: "New regular light",
+ dimmableLight: "New intensity light",
+ smartPlug: "New smart Plug",
+ sensor: "New sensor",
+ switch: "New switch",
+ buttonDimmer: "New button dimmer",
+ knobDimmer: "New knob dimmer",
+ securityCamera: "New security camera",
};
+ if (this.state.deviceName === "") {
+ data.name = defaultNames[this.state.typeOfDevice];
+ }
+ console.log("-------------------------");
+ console.log(this.state.typeOfDevice);
+
switch (this.state.typeOfDevice) {
- case "regularLight":
- if (this.state.deviceName === "") {
- data.params["name"] = "Regular Light";
- }
- break;
- case "smartPlug":
- if (this.state.deviceName === "") {
- data.params["name"] = "Smart Plug";
- }
+ //trying to make securityCamera work
+ //case "securityCamera":
+ // data.path="/security_camera_videos/security_camera_1.mp4";
+ // data.on=false;
+ //break;
+ //trying to make thermostat work
+ case "thermostat":
+ data.targetTemperature = 0;
+ data.measuredTemperature = 0;
break;
case "dimmableLight":
- if (this.state.deviceName === "") {
- data.params["name"] = "Dimmable Light";
- }
- data.params["intensity"] = 0;
+ data.intensity = 0;
break;
case "sensor":
- if (this.state.deviceName === "") {
- data.params["name"] = "Sensor";
- }
if (!this.state.motion) {
- data.params["sensor"] = this.state.typeOfSensor;
- data.params["value"] = 0;
+ data.sensor = this.state.typeOfSensor;
+ data.value = 0;
}
break;
case "switch":
- if (this.state.deviceName === "") {
- data.params["name"] = "Switch";
- }
- data.params["lights"] = this.state.lightsAttached;
- break;
case "buttonDimmer":
- if (this.state.deviceName === "") {
- data.params["name"] = "Button Dimmer";
- }
- data.params["lights"] = this.state.lightsAttached;
- break;
case "knobDimmer":
- if (this.state.deviceName === "") {
- data.params["name"] = "Knob Dimmer";
- }
- data.params["lights"] = this.state.lightsAttached;
+ outputs = this.state.lightsAttached;
break;
default:
break;
}
- this.props.addDevice(data);
- this.resetState();
+ try {
+ let newDevice = await this.props.saveDevice(data);
+ if (outputs) {
+ await this.props.connectOutputs(newDevice, outputs);
+ }
+ this.resetState();
+ } catch (e) {
+ console.error("device creation error: ", e);
+ }
}
render() {
const deviceOptions = [
+ //stuff
+ { key: "thermostat", text: "Thermostat", value: "thermostat", image: {} },
+ { key: "curtains", text: "Curtain", value: "curtains", image: {} },
+ //stuff ends
{
key: "light",
text: "Normal Light",
@@ -191,6 +203,12 @@ export default class NewDevice extends Component {
value: "buttonDimmer",
image: { avatar: true, src: "/img/plusMinus.svg" },
},
+ {
+ key: "securityCamera",
+ text: "Security Camera",
+ value: "securityCamera",
+ image: { avatar: true, src: "/img/plusMinus.svg" },
+ },
];
const sensorOptions = [
{
@@ -376,3 +394,10 @@ export default class NewDevice extends Component {
);
}
}
+
+const mapStateToProps = (state, _) => ({
+ devices: Object.values(state.devices),
+ activeRoom: state.active.activeRoom,
+});
+const NewDeviceContainer = connect(mapStateToProps, RemoteService)(NewDevice);
+export default NewDeviceContainer;
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/Sensor.js b/smart-hut/src/components/dashboard/devices/Sensor.js
index f927ffb..ad80a4c 100644
--- a/smart-hut/src/components/dashboard/devices/Sensor.js
+++ b/smart-hut/src/components/dashboard/devices/Sensor.js
@@ -35,11 +35,11 @@ import {
humiditySensorColors,
iconSensorStyle,
} from "./SensorStyle";
-import Settings from "./DeviceSettings";
-import { call } from "../../../client_server";
import { Image } from "semantic-ui-react";
+import { RemoteService } from "../../../remote";
+import { connect } from "react-redux";
-export default class Sensor extends Component {
+class Sensor extends Component {
constructor(props) {
super(props);
this.state = {
@@ -53,48 +53,63 @@ export default class Sensor extends Component {
this.colors = temperatureSensorColors;
this.icon = "temperatureIcon.svg";
-
- call.socketSubscribe(this.props.device.id, this.stateCallback);
+ this.name = "Sensor";
}
- componentWillUnmount() {
- call.socketUnsubscribe(this.props.device.id, this.stateCallback);
- }
+ // setName = () => {
+ // if (this.props.device.name.length > 15) {
+ // return this.props.device.name.slice(0, 12) + "...";
+ // }
+ // return this.props.device.name;
+ // };
- setName = () => {
- if (this.props.device.name.length > 15) {
- return this.props.device.name.slice(0, 12) + "...";
+ componentDidUpdate(prevProps) {
+ if (
+ this.props.stateOrDevice.kind === "sensor" &&
+ this.props.stateOrDevice.value !== prevProps.stateOrDevice.value
+ ) {
+ this.setState({ value: this.props.stateOrDevice.value });
+ } else if (
+ this.props.stateOrDevice.kind === "motionSensor" &&
+ this.props.stateOrDevice.detected !== prevProps.stateOrDevice.detected
+ ) {
+ this.setState({
+ motion: true,
+ detected: this.props.stateOrDevice.detected,
+ });
}
- return this.props.device.name;
- };
+ }
componentDidMount() {
- if (this.props.device.kind === "sensor") {
- switch (this.props.device.sensor) {
+ if (this.props.stateOrDevice.kind === "sensor") {
+ switch (this.props.stateOrDevice.sensor) {
case "TEMPERATURE":
this.units = "ºC";
this.colors = temperatureSensorColors;
this.icon = "temperatureIcon.svg";
+ this.name = "Temperature Sensor";
break;
case "HUMIDITY":
this.units = "%";
this.colors = humiditySensorColors;
this.icon = "humidityIcon.svg";
+ this.name = "Humidity Sensor";
break;
case "LIGHT":
this.units = "lm";
this.colors = lightSensorColors;
this.icon = "lightSensorIcon.svg";
+ this.name = "Light Sensor";
break;
default:
this.units = "";
}
this.setState({
- value: this.props.device.value,
+ value: this.props.stateOrDevice.value,
});
} else {
this.setState({
- detected: this.props.device.detected,
+ detected: this.props.stateOrDevice.detected,
motion: true,
});
}
@@ -123,7 +138,7 @@ export default class Sensor extends Component {
}}
>
-
{this.props.device.name}
+
Motion Sensor