Merge branch '52-added-switches-creation-and-updates' into 'dev'

addes switches creation and update

Closes #52

See merge request sa4-2020/the-sanmarinoes/frontend!51

smart-hut/src/client_server.js

@@ -63,13 +63,22 @@ export var call  = {
         return axios.post(config + 'room', data, { headers: { Authorization : "Bearer " + tkn } }) 
     },
     updateRoom: function(data, headers) {
-        return axios.put(config + 'room?name='+ data.name, data, { headers: { Authorization : "Bearer " + tkn } })
+        return axios.put(config + 'room/'+ data.id, data, { headers: { Authorization : "Bearer " + tkn } })
     },
     deleteRoom: function(data, headers) {
         return axios.delete(config + 'room/'+data.id, { headers: { Authorization : "Bearer " + tkn } });
     }, 
     devicePost: function(data, headers) {
         return axios.post(config + data.device, data.params, { headers: { Authorization : "Bearer " + tkn } })
+                .then(res => {
+                    if (res.status === 200 && (data.device === "switch")) {
+                        data.params.lights.forEach(e => {
+                            let urlUp = config + data.device + '/' + res.data.id + '/lights?switchableId=' + e;
+                            axios.post(urlUp, {}, { headers: { Authorization : "Bearer " + tkn } })
+                        });
+                    }
+                    return res;
+                })
     },
     deviceUpdate: function(data, typeDevice) {
         let url = 'device';
@@ -79,7 +88,7 @@ export var call  = {
         return axios.put(config + url, data, { headers: { Authorization : "Bearer " + tkn } })
     },
     deviceDelete: function(data, headers) {
-        return axios.delete(config + data.device + '/' + data.id, {}, { headers: { Authorization : "Bearer " + tkn } })
+        return axios.delete(config + data.device + '/' + data.id, { headers: { Authorization : "Bearer " + tkn } })
     },
     deviceGetById: function(data, headers) {
         return axios.get(config + data.device + '/' + data.id)

smart-hut/src/components/SelectIcons.js

@@ -13,7 +13,6 @@ export default class SelectIcons extends Component {
   selectIcon = (e) => {
     let el = e.target.name;
     if (e.target.tagName === "I"){
-      console.log(e.target.parentNode);
       el = e.target.parentNode.name;
     }
     this.props.updateIcon(el);

smart-hut/src/components/dashboard/DevicePanel.js

@@ -108,7 +108,6 @@ export default class DevicePanel extends Component {
 
     removeDevice = () => {
         const item = this.props.devices.filter(d => d.id === this.state.settingsDeviceId)[0];
-        console.log(item)
         const data = {
             device: item.kind,
             id: this.state.settingsDeviceId
@@ -116,9 +115,10 @@ export default class DevicePanel extends Component {
 
         call.deviceDelete(data)
             .then(res => {
-                console.log(res)
                 if (res.status === 200) {
+                    this.openModal();
                     this.getDevices();
+                    this.forceUpdate();
                 }
             }).catch(err => {
 

smart-hut/src/components/dashboard/devices/DeviceTypeController.js

@@ -12,9 +12,9 @@ const DeviceType = (props) => {
       return (<Light onChangeData={props.changeDeviceData}  device={props.device} edit={props.edit} />)
     case "sensor":
       return <Sensor onChangeData={props.changeDeviceData}  device={props.device} edit={props.edit} />
-    case "dimmer":
+    case "buttonDimmer":
       return <DefaultDimmer onChangeData={props.changeDeviceData}  device={props.device} edit={props.edit} />
-    case "smartplug":
+    case "smartPlug":
       return <SmartPlug onChangeData={props.changeDeviceData}  device={props.device} edit={props.edit} />
     case "switch":
       return <Switcher onChangeData={props.changeDeviceData}  device={props.device} edit={props.edit} />

smart-hut/src/components/dashboard/devices/Light.js

@@ -99,7 +99,7 @@ export default class Light extends Component {
           deviceId={this.props.device.id}
           edit={this.props.edit}
           onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
-        {this.props.device.intensity ? (intensityLightView) : (normalLightView)}
+        {this.props.device.intensity >= 0  ? (intensityLightView) : (normalLightView)}
       </StyledDiv>
     )
   }

smart-hut/src/components/dashboard/devices/NewDevice.js

@@ -79,9 +79,17 @@ export default class NewDevice extends Component {
       case "dimmableLight":
         data.params["intensity"] = 1;
         break;
+      case "sensor":
+        data.params["sensor"] = this.state.typeOfSensor;
+        data.params["value"] = 0;
+        break;
+      case "switch":
+        data.params["lights"] = this.state.lightsAttached;
+        break;
       default: 
         break;
     }
+    console.log(data)
     this.props.addDevice(data);
     this.resetState();
   };
@@ -122,7 +130,7 @@ export default class NewDevice extends Component {
       {
         key: 'dimmer',
         text: 'Dimmer',
-        value: 'dimmer',
+        value: 'buttonDimmer',
         image: {avatar: true, src: '/img/dimmer.svg'},
       },
     ];

smart-hut/src/components/dashboard/devices/Sensor.js

@@ -6,9 +6,22 @@
  * For this story, make the sensors return a constant value with some small random error.
  */
 
+ /*
+
+  OPTIONAL STATE
+  error: 2.4 
+  
+  <text style={errorStyle} x={100} y={100} textAnchor="middle" dy="0.6em" fontWeight="bold">
+    &#177;{this.state.error}
+  </text>
+
+
+  errorStyle,
+ */
+
 import React, {Component} from "react";
 import {CircularInput, CircularProgress, CircularTrack} from "react-circular-input";
-import {errorStyle, sensorText, style, valueStyle} from "./SensorStyle";
+import { sensorText, style, valueStyle} from "./SensorStyle";
 import Settings from "./DeviceSettings";
 import {StyledDiv} from "./styleComponents";
 
@@ -17,10 +30,9 @@ export default class Sensor extends Component {
     super(props);
     this.state = {
       turnedOn: false,
-      value: 20,
+      value: 0,
-      error: 2.4
     };
-    this.units = "ºC"
+    this.units = ""
   }
 
   setName = () => {
@@ -31,6 +43,23 @@ export default class Sensor extends Component {
   };
 
   componentDidMount() {
+    switch(this.props.device.sensor) {
+      case "TEMPERATURE":
+        this.units = "ºC";
+        break;
+      case "HUMIDITY" :
+        this.units = "%";
+        break;
+      case "LIGHT":
+        this.units = "lm";
+        break;
+      default:
+        this.units = "";
+
+    }
+    this.setState({
+      value : this.props.device.value
+    });
   }
 
 
@@ -51,9 +80,6 @@ export default class Sensor extends Component {
           <text style={valueStyle} x={100} y={80} textAnchor="middle" dy="0.3em" fontWeight="bold">
             {Math.round(this.state.value)}{this.units}
           </text>
-          <text style={errorStyle} x={100} y={100} textAnchor="middle" dy="0.6em" fontWeight="bold">
-            &#177;{this.state.error}
-          </text>
           <text style={sensorText} x={100} y={150} textAnchor="middle" dy="0.3em" fontWeight="bold">
             {this.setName()}
           </text>

smart-hut/src/components/dashboard/devices/SmartPlug.js

@@ -9,6 +9,7 @@ import {StyledDiv} from "./styleComponents";
 import Settings from "./DeviceSettings";
 import {Image} from "semantic-ui-react";
 import {energyConsumedStyle, imageStyle, nameStyle} from "./SmartPlugStyle";
+import { call } from '../../../client_server';
 
 export default class SmartPlug extends Component {
     constructor(props){
@@ -22,7 +23,13 @@ export default class SmartPlug extends Component {
     }
 
     onClickDevice = () => {
+        this.props.device.on = !this.state.turnedOn;
+        call.deviceUpdate(this.props.device, 'smartPlug')
+        .then(res => {
+            if (res.status === 200 ){
                 this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
+            }
+        })
     };
 
     getIcon = () => {
@@ -33,6 +40,10 @@ export default class SmartPlug extends Component {
     };
 
     componentDidMount() {
+        this.setState({
+            turnedOn : this.props.device.on,
+            energyConsumed : this.props.device.totalConsumption
+        })
     }
 
     render(){

smart-hut/src/components/dashboard/devices/Switch.js

@@ -10,6 +10,7 @@ import {StyledDiv} from "./styleComponents";
 import Settings from "./DeviceSettings";
 import {Image} from "semantic-ui-react";
 import {imageStyle, nameStyle} from "./SwitchStyle";
+import { call } from '../../../client_server';
 
 export default class Switch extends Component {
   constructor(props){
@@ -23,7 +24,23 @@ export default class Switch extends Component {
   }
 
   onClickDevice = () => {
+    this.props.device.on = !this.state.turnedOn;
+    let state = "";
+    if(this.props.device.on) {
+      state = "ON"
+    } else {
+      state = "OFF"
+    }
+    let data = {
+      "type" : state,
+      "id" : this.props.device.id
+    }
+    call.deviceUpdate(data, 'switch/operate')
+      .then(res => {
+        if (res.status === 200 ){
           this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
+        }
+      })
   };
 
   getIcon = () => {
@@ -34,7 +51,9 @@ export default class Switch extends Component {
   };
 
   componentDidMount() {
-
+    this.setState({
+      turnedOn: this.props.device.on
+    })
   }
 
   render(){

smart-hut/src/views/Dashboard.js

@@ -99,7 +99,7 @@ getRooms() {
   }
 
   updateRoom(data) {
-    console.log(data)
+    data.id = this.state.activeItem;
     call.updateRoom(data)
       .then(res => {
         if (res.status === 200 && res.data) {

smart-hut/src/views/Navbar.js

@@ -17,7 +17,6 @@ class Navbar extends Component {
   editModeController = (e) => this.setState((prevState) => ({ editMode: !prevState.editMode }));
 
   handleClick = (e, {id, name}) => {
-    console.log(id);
     let obj = undefined;
     this.props.rooms.forEach((e) => {
       if (e.id === id) {