From 7928407259b65281f5e171ce47c1d645631dea89 Mon Sep 17 00:00:00 2001 From: Claudio Maggioni Date: Tue, 24 Mar 2020 17:08:19 +0100 Subject: [PATCH] Done real time output device updates --- smart-hut/src/client_server.js | 23 ++++++++++++++---- .../src/components/dashboard/devices/Light.js | 24 +++++++++++++++++-- smart-hut/src/components/modalform.js | 3 +-- 3 files changed, 42 insertions(+), 8 deletions(-) diff --git a/smart-hut/src/client_server.js b/smart-hut/src/client_server.js index b439dcd..fa20cd7 100644 --- a/smart-hut/src/client_server.js +++ b/smart-hut/src/client_server.js @@ -63,9 +63,7 @@ class ServiceSocket { console.error("socket authentication failed"); } } else { - if (data.id && this.callbacks[data.id]) { - this.callbacks[data.id].forEach((f) => f(data)); - } + this.invokeCallbacks(data); } }; @@ -79,6 +77,12 @@ class ServiceSocket { }; } + invokeCallbacks(data) { + if (data.id && this.callbacks[data.id]) { + this.callbacks[data.id].forEach((f) => f(data)); + } + } + /** * Registers a new callback function to be called when updates on the device * with the id given are recieved @@ -226,9 +230,20 @@ export var call = { if (typeDevice) { url = typeDevice; } - return axios.put(config + url, data, { + let promiseRes = axios.put(config + url, data, { headers: { Authorization: "Bearer " + tkn }, }); + + if (typeDevice === "switch/operate") { + promiseRes = promiseRes.then((e) => { + if (e.status === 200) { + e.data.forEach((device) => socket.invokeCallbacks(device)); + } + return e; + }); + } + + return promiseRes; }, deviceDelete: function (data, headers) { return axios.delete(config + data.device + "/" + data.id, { diff --git a/smart-hut/src/components/dashboard/devices/Light.js b/smart-hut/src/components/dashboard/devices/Light.js index bb2195d..18787e5 100644 --- a/smart-hut/src/components/dashboard/devices/Light.js +++ b/smart-hut/src/components/dashboard/devices/Light.js @@ -1,3 +1,5 @@ +// vim: set ts=2 sw=2 et tw=80: + /** * Users can add lights in their rooms. * Lights are devices like bulbs, LED strip lights, lamps. @@ -29,9 +31,27 @@ export default class Light extends Component { super(props); this.state = { turnedOn: false, + intensity: 0, }; this.iconOn = "/img/lightOn.svg"; this.iconOff = "/img/lightOff.svg"; + + this.stateCallback = (e) => { + const update = {}; + if (e.kind === "dimmableLight") { + update.intensity = e.intensity; + } else { + update.turnedOn = e.on; + } + + this.setState(Object.assign(this.state, update)); + }; + + call.socketSubscribe(this.props.device.id, this.stateCallback); + } + + componentWillUnmount() { + call.socketUnsubscribe(this.props.device.id, this.stateCallback); } onClickDevice = () => { @@ -75,7 +95,7 @@ export default class Light extends Component { render() { const intensityLightView = ( @@ -91,7 +111,7 @@ export default class Light extends Component { dy="0.3em" fontWeight="bold" > - {Math.round(this.props.device.intensity)}% + {Math.round(this.state.intensity)}% { - this.state.img = reader.result; - this.setState(this.state); + this.setState(Object.assign(this.state, { img: reader.result })); }; reader.onerror = console.error; }