Lights can be modified by a guest

This commit is contained in:
Claudio Maggioni (maggicl) 2020-05-04 11:13:19 +02:00
parent 770469ade3
commit c145be02b4
10 changed files with 56 additions and 14 deletions

View file

@ -101,6 +101,7 @@ class Curtain extends Component {
{Math.round(this.props.stateOrDevice.intensity)}%
</span>
<input
disabled={this.props.disabled}
onChange={this.handleChange}
value={this.props.stateOrDevice.intensity}
className="slider"

View file

@ -105,7 +105,7 @@ export class KnobDimmerComponent extends Component {
<CircularInput
style={KnobDimmerStyle}
value={+(Math.round(this.state.intensity / 100 + "e+2") + "e-2")}
onChange={this.setIntensity}
onChange={this.props.disabled ? null : this.setIntensity}
>
<text
style={textStyle}

View file

@ -68,9 +68,12 @@ class Light extends Component {
onClickDevice = () => {
const on = !this.turnedOn;
if (this.props.tab === "Devices") {
if (this.props.tab !== "Scenes") {
this.props
.saveDevice({ ...this.props.stateOrDevice, on })
.saveDevice(
{ ...this.props.stateOrDevice, on },
this.props.tab === "Hosts" ? this.props.activeHost : null
)
.catch((err) => console.error("regular light update error", err));
} else {
if (this.props.device.kind === "regularLight") {
@ -115,10 +118,13 @@ class Light extends Component {
saveIntensity = () => {
const intensity = Math.round(this.state.intensity);
if (this.props.tab === "Devices") {
if (this.props.tab !== "Scenes") {
this.props
.saveDevice({ ...this.props.stateOrDevice, intensity })
.catch((err) => console.error("regular light update error", err));
.saveDevice(
{ ...this.props.stateOrDevice, intensity },
this.props.tab === "Hosts" ? this.props.activeHost : null
)
.catch((err) => console.error("dimmable light update error", err));
} else {
this.props
.updateState(
@ -137,8 +143,8 @@ class Light extends Component {
<CircularInput
style={LightDimmerStyle}
value={+(Math.round(this.intensity / 100 + "e+2") + "e-2")}
onChange={this.setIntensity}
onMouseUp={this.saveIntensity}
onChange={this.props.disabled ? null : this.setIntensity}
onMouseUp={this.props.disabled ? null : this.saveIntensity}
>
<text
style={textStyle}

View file

@ -52,7 +52,7 @@ class SmartPlug extends Component {
render() {
return (
<StyledDiv onClick={this.onClickDevice}>
<StyledDiv onClick={this.props.disabled ? () => {} : this.onClickDevice}>
<Image src={this.getIcon()} style={imageStyle} />
<span style={nameStyle}>Smart Plug</span>

View file

@ -38,7 +38,7 @@ class Switch extends Component {
render() {
return (
<StyledDiv onClick={this.onClickDevice}>
<StyledDiv onClick={this.props.disabled ? () => {} : this.onClickDevice}>
<Image src={this.getIcon()} style={imageStyle} />
<span style={nameStyle}>Switch</span>

View file

@ -99,6 +99,7 @@ class Thermostats extends Component {
<h3 style={deviceName}>
Thermostat
<Checkbox
disabled={this.props.disabled}
checked={
this.props.tab === "Devices"
? this.props.device.mode !== "OFF"
@ -118,6 +119,7 @@ class Thermostats extends Component {
</div>
{this.props.tab === "Devices" ? (
<Slider
disabled={this.props.disabled}
min={10}
max={30}
step={0.1}

View file

@ -45,6 +45,7 @@ function getRoomName(state, ownProps) {
export default function mapStateToProps(state, ownProps) {
return {
activeHost: state.active.activeHost,
get stateOrDevice() {
return getStateOrDevice(state, ownProps);
},
@ -57,5 +58,12 @@ export default function mapStateToProps(state, ownProps) {
get type() {
return getDevice(state, ownProps).kind;
},
get disabled() {
return (
ownProps.tab === "Hosts" &&
["dimmableLight", "light"].indexOf(getDevice(state, ownProps).kind) ===
-1
);
},
};
}

View file

@ -529,16 +529,24 @@ export const RemoteService = {
* @returns {Promise<Device, RemoteError>} promise that resolves to the saved device and rejects
* with user-fiendly errors as a RemoteError
*/
saveDevice: (data) => {
saveDevice: (data, hostId = null) => {
return (dispatch) => {
let url = "/device";
if ((data.id && data.flowType === "OUTPUT") || !data.id) {
url = "/" + data.kind;
}
return Endpoint[data.id ? "put" : "post"](url, {}, data)
return Endpoint[data.id ? "put" : "post"](
url,
hostId ? { hostId } : {},
data
)
.then((res) => {
dispatch(actions.deviceSave(res.data));
dispatch(
hostId
? actions.hostDeviceSave(hostId, res.data)
: actions.deviceSave(res.data)
);
return res.data;
})
.catch((err) => {

View file

@ -3,6 +3,7 @@ import thunk from "redux-thunk";
import update from "immutability-helper";
import reduxWebSocket, { connect } from "@giantmachines/redux-websocket";
import { socketURL } from "./endpoint";
import actions from "./storeActions";
function reducer(previousState, action) {
let newState, change;
@ -333,6 +334,18 @@ function reducer(previousState, action) {
}
newState = update(previousState, change);
break;
case "HOST_DEVICE_SAVE":
change = {
hostDevices: {
[action.hostId]: {
[action.device.id]: {
$set: action.device,
},
},
},
};
newState = update(previousState, change);
break;
case "AUTOMATION_SAVE":
change = {
@ -491,7 +504,6 @@ function reducer(previousState, action) {
a[hostId].push(e);
return a;
}, {});
newState = reducer(previousState, {
type: "DEVICES_UPDATE",
partial: true,

View file

@ -25,6 +25,11 @@ const actions = {
type: "DEVICE_SAVE",
device,
}),
hostDeviceSave: (hostId, device) => ({
type: "HOST_DEVICE_SAVE",
hostId,
device,
}),
triggerSave: (automation) => ({
type: "TRIGGER_SAVE",
automation,