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

refacor all the things \o/

Browse source
This commit is contained in:
uwap 2017-09-19 10:12:32 +02:00
parent d729d949bd
commit 538162d38c
15 changed files with 721 additions and 402 deletions
Download patch file Download diff file Expand all files Collapse all files

93
src/index.jsx
View file

@ -4,8 +4,7 @@ import ReactDOM from "react-dom";
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import Drawer from 'material-ui/Drawer';
import injectTapEventPlugin from 'react-tap-event-plugin';
import { createStore } from "redux";
import { MQTT_CONNECT } from "./stateActions";
import { store } from "./state";
import connectMqtt from "./mqtt";
import AppBar from "./appbar";
import Toggle from "material-ui/Toggle";
@ -17,47 +16,48 @@ import { Toolbar, ToolbarGroup, ToolbarTitle } from "material-ui/Toolbar";
injectTapEventPlugin();
const appState : State = {
mqtt: null,
ui: null,
values: R.map(R.prop("value"), Config.topics)
};
console.log(appState.values);
const handleEvent = (state = appState, action) => {
switch (action.type) {
case "CONNECT":
return R.merge(state, { mqtt: action.mqtt });
case "uiopen":
return R.merge(state, { ui: action.ui });
case "uiclose":
return R.merge(state, { ui: null });
case "mqtt_message":
console.log(action.topic + ": " + action.message.toString());
const val = (topic: string) =>
Config.topics[topic].parseState == null ?
action.message.toString() :
Config.topics[topic].parseState(action.message);
const keysToUpdate = R.keys(R.pickBy(val => val.state == action.topic,
Config.topics));
return R.mergeDeepRight(state, R.objOf("values", R.mergeAll(R.map(
k => R.objOf(k, val(k)), keysToUpdate))));
/*
return R.merge(state, R.objOf("topics", R.merge(state.topics,
R.map(R.merge(R.__, { value: val }),
R.pickBy(val => val.state == action.topic, Config.topics)))));
*/
}
return state;
};
const store = createStore(handleEvent);
// const appState : State = {
// mqtt: null,
// ui: null,
// values: R.map(R.prop("value"), Config.topics)
// };
//
// console.log(appState.values);
//
// const handleEvent = (state = appState, action) => {
// switch (action.type) {
// case "CONNECT":
// return R.merge(state, { mqtt: action.mqtt });
// case "uiopen":
// return R.merge(state, { ui: action.ui });
// case "uiclose":
// return R.merge(state, { ui: null });
// case "mqtt_message":
// console.log(action.topic + ": " + action.message.toString());
// const val = (topic: string) =>
// Config.topics[topic].parseState == null ?
// action.message.toString() :
// Config.topics[topic].parseState(action.message);
// const keysToUpdate = R.keys(R.pickBy(val => val.state == action.topic,
// Config.topics));
// return R.mergeDeepRight(state, R.objOf("values", R.mergeAll(R.map(
// k => R.objOf(k, val(k)), keysToUpdate))));
// /*
// return R.merge(state, R.objOf("topics", R.merge(state.topics,
// R.map(R.merge(R.__, { value: val }),
// R.pickBy(val => val.state == action.topic, Config.topics)))));
// */
// }
// return state;
// };
//
// const store = createStore(handleEvent);
const UiItem = (state) => (props : ControlUI) =>
UiItems[props.type](state, props);
const renderUi = (state, key) => key != null && Config.controls[key] != null ?
const renderUi = (state: State, key: ?string) =>
key != null && Config.controls[key] != null ?
R.map(UiItem(state), Config.controls[key].ui) : null;
const App = (state: State) => (
@ -65,16 +65,17 @@ const App = (state: State) => (
<MuiThemeProvider>
<div>
<AppBar title="RZL Map" {...state} />
<Drawer open={state.ui != null} openSecondary={true} disableSwipeToOpen={true}>
<Drawer open={state.uiOpened != null}
openSecondary={true} disableSwipeToOpen={true}>
<Toolbar>
<ToolbarGroup firstChild={true}>
<ToolbarTitle text={
state.ui == null ? "" : Config.controls[state.ui].name}
state.uiOpened == null ? "" : Config.controls[state.uiOpened].name}
style={{"marginLeft": 10}} />
</ToolbarGroup>
</Toolbar>
<div id="drawer_uiComponents">
{renderUi(state, state.ui)}
{renderUi(state, state.uiOpened)}
</div>
</Drawer>
</div>
@ -84,9 +85,9 @@ const App = (state: State) => (
</div>
);
store.dispatch({type: null});
store.subscribe(() => ReactDOM.render(<App {...store.getState()} />, document.getElementById("content")));
store.dispatch({type: null});
store.dispatch({type: "mqtt_message", topic: "/service/openhab/out/pca301_ledstrips/state", message: "ON"});
connectMqtt("ws://172.22.36.207:1884", store); // wss://mqtt.starletp9.de/mqtt", store);
// 192.168.178.6
connectMqtt("ws:192.168.178.6:1884", store); // "ws://172.22.36.207:1884", store); // wss://mqtt.starletp9.de/mqtt", store);