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

More detailed RZL

Browse source
This commit is contained in:
uwap 2017-09-21 18:22:58 +02:00
parent 03a58e918a
commit a65e937623
5 changed files with 22 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -2,6 +2,7 @@
<head>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin=""/>
<meta charset="utf-8" />
<title>Space Map</title>
<style>
#content {
height: 100%;
@ -19,6 +20,7 @@
}
body .leaflet-div-icon {
border: 0;
background: transparent;
}
@font-face {
font-family: 'Material Icons';

2
rzl.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 40 KiB

Before After
Before After

20
src/config.js
View file

@ -45,7 +45,7 @@ const config : Config = {
command: "/service/onkyo/command",
defaultValue: "SLI00",
values: { tisch: "SLI11", chromecast: "SLI01", pult: "SLI10" },
parseState: msg => JSON.parse(msg.toString()).val
parseState: msg => JSON.parse(msg.toString()).onkyo_raw
},
rundumleuchte: {
state: "/service/openhab/out/pca301_rundumleuchte/state",
@ -69,7 +69,7 @@ const config : Config = {
controls: {
led_stahltrager: {
name: "LED Stahlträger",
position: [360, 80],
position: [390, 100],
icon: "wb_incandescent",
iconColor: state => state.led_stahltraeger == "on" ? "#CCCC00" : "#000000",
ui: [
@ -82,7 +82,7 @@ const config : Config = {
},
snackbar: {
name: "Snackbar",
position: [560, 200],
position: [560, 465],
icon: "kitchen",
iconColor: state => state.snackbar == "on" ? "#E20074" : "#000000",
ui: [
@ -95,7 +95,7 @@ const config : Config = {
},
twinkle: {
name: "Twinkle",
position: [500, 280],
position: [500, 540],
icon: "wb_incandescent",
iconColor: state => state.twinkle == "on" ? "#CCCC00" : "#000000",
ui: [
@ -108,7 +108,7 @@ const config : Config = {
},
flyfry: {
name: "Fliegenbratgerät",
position: [450, 320],
position: [450, 560],
icon: "whatshot",
iconColor: state => state.flyfry == "on" ? "#6666FF" : "#000000",
ui: [
@ -121,7 +121,7 @@ const config : Config = {
},
artnet: {
name: "Artnet",
position: [560,165],
position: [560,430],
icon: "wb_incandescent",
iconColor: state =>
({
@ -157,7 +157,7 @@ const config : Config = {
},
onkyo: {
name: "Onkyo",
position: [350, 380],
position: [350, 620],
icon: "volume_up",
ui: [
{
@ -181,7 +181,7 @@ const config : Config = {
},
rundumleuchte: {
name: "Rundumleuchte",
position: [225,220],
position: [310,220],
icon: "wb_sunny",
iconColor: state => state.rundumleuchte == "on" ? "#CCCC00" : "#000000",
ui: [
@ -194,14 +194,14 @@ const config : Config = {
},
door: {
name: "Tür",
position: [480,20],
position: [480,300],
icon: "swap_vert",
iconColor: state => state.door_status == "on" ? "#00FF00" : "#FF0000",
ui: []
},
infoscreen: {
name: "Infoscreen",
position: [255, 195],
position: [255, 455],
icon: "developer_board",
iconColor: state => state.infoscreen == "on" ? "#4444FF" : "#000000",
ui: [

13
src/index.jsx
View file

@ -23,7 +23,9 @@ 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) => (
const App = (state: State) => {
if (state == null) return (<div></div>);
return (
<div>
<MuiThemeProvider>
<div>
@ -43,14 +45,15 @@ const App = (state: State) => (
</Drawer>
</div>
</MuiThemeProvider>
<SpaceMap width={640} height={400} image="rzl.svg" zoom={0.1}
<SpaceMap width={640} height={640} image="rzl.svg" zoom={0.1}
store={store} state={state} />
</div>
);
);}
store.dispatch({type: null});
store.subscribe(() => ReactDOM.render(<App {...store.getState()} />, document.getElementById("content")));
store.dispatch({type:null});
// 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);
connectMqtt("ws://172.22.36.207:1884", store); // wss://mqtt.starletp9.de/mqtt", store);

2
src/map.js
View file

@ -18,7 +18,7 @@ const color = (iconColor, state: State) => {
return iconColor == null ? "#000000" :
iconColor(
R.map(x => x.internal == null ?
x.actual : x.internal, state.values)
x.actual : x.internal, state.values == null ? {} : state.values)
);
}
const iconHtml = (el, state: State) =>