I really wanted a dashboard in the wall to control everything I want. Last couple of week’s I’ve discovered homey-dash. Great I thought, and build an old iPad 2 inside the wall. Sadly, the dashboard was very limited. I could only start some flows, and control some switches. To see information on some devices, I needed to press them several times, and to use a slider I needed to long press a device. I thought I could adjust my electric blinds, but sadly the slider didn’t work for blinds… Anyway, I was hoping for some kind of really adjustable widget dashboard… And last week I’ve found it.
Dashboard from DeepBlueNine with custom CSS (Get it here)
It’s called “Node Red”. A free and open source complete framework to create and compile any dashboard you want: https://nodered.org/
It’s even capable replacing all the flows from Homey. It’s quite an intuitive mechanic. You build structures in the back end with nodes and wires. But it’s not that complicated and you can go as complicated as you want. It took me one weekend of research to get an interesting dashboard with all the items that I want. I’ve made this quick start guide to help someone else trying to do the same thing and save them for some of the hurdles I need to go trough. (note all screenshots are in Dutch)
With my current dashboard I can:
- Activate lighting (or other) flows directly to set a mood
- Control lights directly (on/of, brightness, mode… but haven’t figured out how to control the hue)
- Control the curtains and blinds with slider controls
- See the state of security like open doors
- Control the heater
- See all kinds of data like humidity, temperature (outside inside) air pressure
- Can even create graphs, dials and other interesting gauges
- If I’m not home, it displays a list of doorbell ringers
- Show a camera feed if someone presses the doorbell
- Multiple pages or hide / show elements based on
- Other non-homey elements like a online rain radar etc.
Where do you install Node-red?
You need to install it on a dedicated server. Like a Raspberry pi, an Q-nap Nas or like I did, on a Synology NAS. On the NAS I installed “Docker” a virtualization app, and installed Node-red on it. (Google for your preferred platform)
So how does it communicate with homey?
First I thought I could use / reverse engineer the Homey dash JavaScript communication. (I actually still think it’s a better solution but more on that later). It uses MQTT “Message Queuing Telemetry Transport” Luckily there are apps for homey to send and receive these messages.
To use MQTT you need to install at least 2 apps on Homey: The “client”:
and the “hub”:
The client receives MQTT communication from Node Red, the Hub pushes communication to Node Red.
Then you also need a broker… This is the main MQTT server. There’s also a MQTT broker app for homey, so you can run it on Homey if you like:
There’s only one BIG drawback… It uses a lot of Homey RAM. I discovered the client uses 38MB, the Broker 41 and the Hub 35… that’s 115MB. So its advisable to run the broker somewhere else. (Like where Node red is hosted.)
[EDIT 30-10-2019] The memory usage seems to be going down after a couple weeks of usage. Maybe its the new Homey V3.0 but my current memory usage is now:
MQTT Hub: 23.8 MB
MQTT Client: 22 MB
Dont know about the Broker (I’m running this on my Synology NAS now)
Now find the ip address of the broker and connect the client and the hub (see settings app) to it. The port is usually 1883
Go to the hub and change the “topic” to something more understandable like “homie/homey-topic” (apparently “homie” is some kind of MQTT device).
If the broker does not transmit Homey MQTT data, you might restart the client and the hub. Also, if you install a new device on Homey, you need to restart the hub. It also can take a couple of minutes for the broker to discover devices.
Now go into the backend of node-red. The address is usually [Ip address of the node red server]+port 1880. Like http://192.168.178.26:1880
Inside this backend you can past node code snippets. For every example I made a JSON code snippet you can paste on the form:
Press the hamburger menu (upper right): import => clipboard. Paste the code and add it to the form.
First of all you need to install the dashboard UI elements:
Here’s a video with some basic understanding:
Another one:
After that, add a MQTT node and link it to a debug node
Double click the MQTT node and add a server (pencil icon). Fill in the ip address and port and save / update. Give the node a name and press done. And fill in a # at the Topic (this is a wildcard).
JSON CODE (remember to change Ip address):
[{"id":"3b132935.45f326","type":"mqtt in","z":"82ee69e8.f9757","name":"MQTT receiver","topic":"#","qos":"2","datatype":"auto","broker":"d094d3b7.a558a8","x":424.20001220703125,"y":724.2000122070312,"wires":[["9a46ebd1.1b884"]]},{"id":"9a46ebd1.1b884","type":"debug","z":"82ee69e8.f9757","name":"Output debug","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":777.2000732421875,"y":723.2000122070312,"wires":[]},{"id":"d094d3b7.a558a8","type":"mqtt-broker","z":"","name":"Homey MQTT","broker":"192.168.178.15","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""}]
Now watch the debug window and press activate some lights inside homey. If all went well, you should see some information like:
homie/homey-topic/light/onoff : msg.payload : string[4] "true"
Great! You’ve received some info.
With this info you can create all kinds of widgets. Like connect this to a switch or use a switch to switch the light:
Add a switch node to the nodefield and create a group.
Add a MQTT Output node and connect it to the switch
Double click the Output node, select the MQTT server (previous created) and fill in the topic (from the debug window): homie/homey-topic/light/onoff/set
NOTE!: you NEED to add “/set” behind to topic to control it.
The node will automatically use the parameter that the switch generates (msg.payload).
JSON CODE (remember to set the right topic and ip address):
[{"id":"663c4f31.504ed","type":"ui_switch","z":"82ee69e8.f9757","name":"Light switch","label":"Light","tooltip":"","group":"2b0d2624.525502","order":9,"width":"3","height":"1","passthru":false,"decouple":"false","topic":"homie/homey-topic/binnenring/onoff/set","style":"","onvalue":"true","onvalueType":"bool","onicon":"","oncolor":"","offvalue":"false","offvalueType":"bool","officon":"","offcolor":"","x":411.20001220703125,"y":878.2000122070312,"wires":[["9e05359f.40d86"]]},{"id":"9e05359f.40d86","type":"mqtt out","z":"82ee69e8.f9757","name":"MQTT Light transmit","topic":"","qos":"","retain":"","broker":"d094d3b7.a558a8","x":668.2000122070312,"y":878.3333740234375,"wires":[]},{"id":"2b0d2624.525502","type":"ui_group","z":"","name":"Lampen","tab":"2f1cda12.393b96","order":1,"disp":true,"width":"6","collapse":false},{"id":"d094d3b7.a558a8","type":"mqtt-broker","z":"","name":"Homey MQTT","broker":"192.168.178.15","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""},{"id":"2f1cda12.393b96","type":"ui_tab","z":"","name":"Homey Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]
Go in the webbrowser to the node-red front end UI (this is the dashboard): ip adress + port + /ui. Like http://192.167.178.10:1880/ui
Switch the switch and the light should go on or off.
Now, we want to switch the virtual UI switch also when we control the light outside of node-red. We can connect the already placed MQTT receiver to the switch. But… the switch needs a Boolean, and everything MQTT sends are strings. (some nodes convert these automatically, like gauges) So it needs an extra step to convert a string Boolean to a real Boolean.
Connect the MQTT receiver to a function node (this is a node where you can add a piece of javascript) double click and add:
if(msg.payload === "true"){ msg.payload = true; }else{ msg.payload = false; } return msg;
This converts a string to a Boolean (I know there are shorter smarter ways to do this, but this is more understandable)
Now connect the function node to the switch and it should switch on and of with the light outside of node red. (You might want to uncheck the pass through, otherwise you get a continuous loop).
JSON CODE (again, remember to set the correct ip / topic) :
[{"id":"1d187528.c409e3","type":"ui_switch","z":"82ee69e8.f9757","name":"Light Switch","label":"Light Switch","tooltip":"","group":"2b0d2624.525502","order":9,"width":"3","height":"1","passthru":false,"decouple":"true","topic":"homie/homey-topic/binnenring/onoff/set","style":"","onvalue":"true","onvalueType":"bool","onicon":"","oncolor":"","offvalue":"false","offvalueType":"bool","officon":"","offcolor":"","x":780.1666259765625,"y":956.2000122070312,"wires":[["f0575ce5.e23a58"]]},{"id":"f0575ce5.e23a58","type":"mqtt out","z":"82ee69e8.f9757","name":"MQTT Transmitter","topic":"","qos":"","retain":"","broker":"d094d3b7.a558a8","x":990.1666870117188,"y":956.3333740234375,"wires":[]},{"id":"de41fdc2.8f4218","type":"mqtt in","z":"82ee69e8.f9757","name":"MQTT receiver light","topic":"homie/homey-topic/light/onoff","qos":"2","datatype":"auto","broker":"d094d3b7.a558a8","x":294,"y":957.2667236328125,"wires":[["80c8f8f1.e28b9"]]},{"id":"80c8f8f1.e28b9","type":"function","z":"82ee69e8.f9757","name":"Convert String to Boolean","func":"if(msg.payload === \"true\"){\n msg.payload = true; \n}else{\n msg.payload = false;\n}\nreturn msg;","outputs":1,"noerr":0,"x":555.3333282470703,"y":956.800048828125,"wires":[["1d187528.c409e3"]]},{"id":"2b0d2624.525502","type":"ui_group","z":"","name":"Lampen","tab":"2f1cda12.393b96","order":1,"disp":true,"width":"6","collapse":false},{"id":"d094d3b7.a558a8","type":"mqtt-broker","z":"","name":"Homey MQTT","broker":"192.168.178.15","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""},{"id":"2f1cda12.393b96","type":"ui_tab","z":"","name":"Homey Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]
If you want to know every homey device and “subject” go to the homey mqtt hub configuration and press “broadcast”. (make sure you monitor the MQTT debug output) this will send all MQTT options. If there’s too many (te debug window can only hold a limited amount of lines) add a function between the MQTT server and debugger with the code (replace “filter” with a keyword you want to search for):
if(msg.payload.includes("filter")){ return msg; }
JSON CODE (replace the keyword in the function and set the correct ip address, also disable the other debugs by right dimming the green light on the right of the node. Otherwise every enabled debug will output):
[{"id":"1608a4fb.7adc93","type":"mqtt in","z":"82ee69e8.f9757","name":"","topic":"#","qos":"2","datatype":"auto","broker":"d094d3b7.a558a8","x":269.20001220703125,"y":1166.5999755859375,"wires":[["2e252941.9e749e","953951fe.c35e18"]]},{"id":"2e252941.9e749e","type":"debug","z":"82ee69e8.f9757","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":659.2000885009766,"y":1168.5999755859375,"wires":[]},{"id":"953951fe.c35e18","type":"function","z":"82ee69e8.f9757","name":"filterword","func":"if(msg.payload.includes(\"filterword\")){\n return msg;\n}","outputs":1,"noerr":0,"x":495.2000274658203,"y":1118.3999786376953,"wires":[["85b3909.66610f"]]},{"id":"85b3909.66610f","type":"debug","z":"82ee69e8.f9757","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":659.2001800537109,"y":1118.7999114990234,"wires":[]},{"id":"d094d3b7.a558a8","type":"mqtt-broker","z":"","name":"Homey MQTT","broker":"192.168.178.15","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""}]
[EDIT] User xAPPO pointed out a great app to explore all MQTT communication:
So these are the basics… Just experiment and google like I did. There is a big library of examples and extra node plugins on the node red site. https://flows.nodered.org/
If you made a dashboard or have some great idea’s, please post them!
Future plans:
I think it’s a good idea to eliminate the whole MQTT communication structure and develop dedicated Homey integration node receiver and transmitter plugins. I haven’t dived into It (And I’m not a developer) but I think it’s doable getting functions out of the Homey Dash project and creating dedicated red-nodes with it. This will eliminate the emulation of MQTT on Homey and saves a lot of RAM. Maybe a real developer can step in, or give me some pointers how to accomplish this.