uwap/mqtt-control-map
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Introduce DropDowns...

Browse source 
By the way, someone surely should cleanup this code...
This commit is contained in:
uwap 2017-09-17 04:13:31 +02:00
parent 021eaac0a2
commit eb96d9d511
5 changed files with 58 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/UiItems.js
View file

@ -1,20 +1,47 @@
// @flow
import React from "react";
import Toggle from "material-ui/Toggle";
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import Config from "./config";
import R from "ramda";
const onToggle = (topic, props, state) => (x, toggled) =>
state.mqtt.publish(Config.topics[topic].command,
toggled ? Config.topics[topic].values[R.propOr("on", "on", props)]
: Config.topics[topic].values[R.propOr("off", "off", props)]);
const getValue = (topic: string, val: string) =>
Config.topics[topic].values[val];
export const toggle = (props: Object) => (
const onToggle = (topic: string, props: ControlUI, state: State) =>
(x, toggled: boolean) => {
if (state.mqtt != null) {
state.mqtt.publish(Config.topics[topic].command,
toggled ? getValue(topic, R.propOr("on", "on", props))
: getValue(topic, R.propOr("off", "off", props)));
}
};
export const toggle = (state: State, props: ControlUI) => (
<Toggle label={props.text}
toggled={
props.state.values[props.topic] ===
Config.topics[props.topic].values[R.propOr("on", "on", props)]
state.values[props.topic] ===
getValue(props.topic, R.propOr("on", "on", props))
}
onToggle={onToggle(props.topic, props, props.state)}
onToggle={onToggle(props.topic, props, state)}
/>
);
const onDropDownChange = (topic: string, props: ControlUI, state: State) =>
(event, index, value) => {
if (state.mqtt != null) {
state.mqtt.publish(Config.topics[topic].command, value);
}
};
const dropDownItem = (topic: string) => (text: string, key: string) => (
<MenuItem value={Config.topics[topic].values[key]} primaryText={text} />
);
export const dropDown = (state: State, props: ControlUI) => (
<SelectField value={state.values[props.topic]}
onChange={onDropDownChange(props.topic, props, state)}>
{R.values(R.mapObjIndexed(dropDownItem(props.topic), props.options))}
</SelectField>
);