# Node Red: A widget based dashboard working with Homey trough MQTT

**URL:** <https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798>\
**Category:** Apps\
**Created:** [October 3, 2019, 10:05am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798 "2019-10-03T10:05:10Z")\
**Posts on this page:** 20\
**Page:** 34

<div class="post-metadata">

**Author:** ![peltsi51](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/peltsi51/32/12564_2.png) [@peltsi51](https://community.homey.app/u/peltsi51)\
**Post date:** [November 6, 2020, 11:08am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/675 "2020-11-06T11:08:07Z")

</div>

Thanks for the help. That is somewhat the same that I have made, but the problem is that also the “input” arrays are sorted although I dont sort them in the code.

---

<div class="post-metadata">

**Author:** ![RogerSt](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/rogerst/32/12432_2.png) [@RogerSt](https://community.homey.app/u/RogerSt)\
**Post date:** [November 7, 2020, 11:22am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/676 "2020-11-07T11:22:50Z")

</div>

then copy the input array to a new array perhaps, and use that one for sorting.

---

<div class="post-metadata">

**Author:** ![peltsi51](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/peltsi51/32/12564_2.png) [@peltsi51](https://community.homey.app/u/peltsi51)\
**Post date:** [November 8, 2020, 9:33am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/677 "2020-11-08T09:33:18Z")

</div>

I have done that also, like presented in the example code. But it will still sort the input array also.

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [November 8, 2020, 2:51pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/678 "2020-11-08T14:51:07Z")

</div>

you need to use push (for existing array’s):

```auto
m_out[0]=3;
m_out[1]=2;
m_out[2]=4;
m_out[3]=5;
m_out[4]=1;
m_out[5]=7;

m_out_sorted.push(...m_out);
m_out_sorted = m_out_sorted.sort((a,b) => a-b);

```

See:

> <https://stackoverflow.com/questions/16232915/copying-an-array-of-objects-into-another-array-in-javascript>

---

<div class="post-metadata">

**Author:** ![Idus](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/idus/32/14105_2.png) [@Idus](https://community.homey.app/u/Idus)\
**Post date:** [November 21, 2020, 3:17pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/679 "2020-11-21T15:17:07Z")

</div>

I am no programmer, but would love to have this working. Have spent quite a few hours to get it up and working - but how to get the layout and buttons working as I want seems to be out of my grasp. To be honest I do not want to learn to be good at this - just want to make it work and fulfill my basic demands to help my wifey to easily use our Homey.

So:  
**Would it be possible to get your full code for your tab** (to import to my own Node-RED) - so I can change to my values and connection and learn from what you have done as I go? It is more or less exacly how I want my layout to be and I ask politely and respect your choice if not to. But it would help me a lot! 😉 Thank you and have a great evening/day! 🙂

---

<div class="post-metadata">

**Author:** ![Khoi\_Ho\_Si](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/khoi_ho_si/32/17289_2.png) [@Khoi\_Ho\_Si](https://community.homey.app/u/Khoi_Ho_Si)\
**Post date:** [November 28, 2020, 10:05am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/680 "2020-11-28T10:05:36Z")

</div>

@Satoer Thank you for this manual. I have never ever did anything with programming but I still manage to come up with some kind of a dashboard.

 ![Screen Shot 2020-11-28 at 11.02.56 AM](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/2/1/21afaf9696ebf5ab2129c31d223c6244e4974768.png)  
Still need to add some weather items

---

<div class="post-metadata">

**Author:** ![Khoi\_Ho\_Si](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/khoi_ho_si/32/17289_2.png) [@Khoi\_Ho\_Si](https://community.homey.app/u/Khoi_Ho_Si)\
**Post date:** [December 2, 2020, 3:27pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/683 "2020-12-02T15:27:23Z")

</div>

@Joost_van_Liempt I would also like to have the traffic map on my dashboard. Can you please share the code you have used?

---

<div class="post-metadata">

**Author:** ![Ron\_Meijsen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/ron_meijsen/32/29929_2.png) [@Ron\_Meijsen](https://community.homey.app/u/Ron_Meijsen)\
**Post date:** [December 13, 2020, 9:02am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/684 "2020-12-13T09:02:01Z")

</div>

Hi Paul

Can i ask how you cast the dashboard to the google home. I have a https call which shows the dashboard on my computer but does not cast to my google.  
@Paul_Grevink

Thanks  
Ron

---

<div class="post-metadata">

**Author:** ![Paul\_Grevink](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/paul_grevink/32/25533_2.png) [@Paul\_Grevink](https://community.homey.app/u/Paul_Grevink)\
**Post date:** [December 13, 2020, 9:20am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/685 "2020-12-13T09:20:13Z")

</div>

Hell Ron,

Thanks for your message. It is a while ago, I have created this flow [Shared Flow | Homey](https://homey.app/f/aLrorp) that does the job. To test it on Homey, i used a virtual button to trigger casting the URL of the dashboard to the nesthub. Later I also created a routine in Google Home that will sent the dashboard to the hub. I hope this helps, otherwise let me know.

Best regards,

Paul

---

<div class="post-metadata">

**Author:** ![Ron\_Meijsen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/ron_meijsen/32/29929_2.png) [@Ron\_Meijsen](https://community.homey.app/u/Ron_Meijsen)\
**Post date:** [December 13, 2020, 2:28pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/686 "2020-12-13T14:28:30Z")

</div>

Hi, I had that flow as well, which works for homeydash but not for nodered. it needs to be https . Could yo u share me the routine how to do this on google home. From there I should be able to figure out 😉  
thanks

---

<div class="post-metadata">

**Author:** ![Paul\_Grevink](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/paul_grevink/32/25533_2.png) [@Paul\_Grevink](https://community.homey.app/u/Paul_Grevink)\
**Post date:** [December 13, 2020, 3:38pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/687 "2020-12-13T15:38:27Z")

</div>

The Routine is pretty simple. I have linked Homey to Google Home. The Routine is (sorry for Dutch language as my Google Apps do have Dutch as preferred language.  
_Wanneer_  
_Ik zeg “Show Dashboard”_

_Dan doet de Assistent het volgende_  
Choose:  
_X Instellingen aanpassen voor lampen, stekkers en meer_  
Open the cog and select the Virtual button mentioned in the flow (my previous post)  
_Inschakelen_

Save the Routine.

That is all. Google Assistant will switch the virtual button, which will broadcast the dashboard to the nest hub…

P.S. Some time ago, Routines were located in the Google Home app. but is not available today for unknow reason.  
I was able to start Routines by going to the Google Assistant and give the command: “Open Routine Settings”.

---

<div class="post-metadata">

**Author:** ![Ron\_Meijsen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/ron_meijsen/32/29929_2.png) [@Ron\_Meijsen](https://community.homey.app/u/Ron_Meijsen)\
**Post date:** [December 13, 2020, 4:42pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/688 "2020-12-13T16:42:08Z")

</div>

Dankjewel. Ik denk dat er dan iets niet goed is met mijn dashboard. Ik doe exact hetzelfde.

I will continue to check my dashboard

Thanks  
Ron

---

<div class="post-metadata">

**Author:** ![Paul\_Grevink](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/paul_grevink/32/25533_2.png) [@Paul\_Grevink](https://community.homey.app/u/Paul_Grevink)\
**Post date:** [December 13, 2020, 5:34pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/689 "2020-12-13T17:34:46Z")

</div>

Hello Ron,

Is the Homey Chromecast App working correctly? I experienced quite some issues and have scheduled a restart of this App every 6 hours. Can you cast other content with the same flow to the nesthub, like YouTube?

Best regards,

Paul

---

<div class="post-metadata">

**Author:** ![Ron\_Meijsen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/ron_meijsen/32/29929_2.png) [@Ron\_Meijsen](https://community.homey.app/u/Ron_Meijsen)\
**Post date:** [December 15, 2020, 9:19am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/690 "2020-12-15T09:19:18Z")

</div>

Hi Paul,

I have not tried that yet but I did fix the casting of the Node red dashboard to the google home Hub.

I am using the bigssh node on Node-red to call a command on the PI4 host.

On the host I have installed CATT (cast all the things) and by calling CATT -d device cast\_site [http://192.1.1.6:1880/ui](http://192.1.1.6:1880/ui) it shows the dashboard on the google home hub.

CATT is a great tool, by running catt scan is shows all your chomecast devices.

It can also do youtube, etc.

maybe try that.

---

<div class="post-metadata">

**Author:** ![Khoi\_Ho\_Si](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/khoi_ho_si/32/17289_2.png) [@Khoi\_Ho\_Si](https://community.homey.app/u/Khoi_Ho_Si)\
**Post date:** [December 17, 2020, 6:54pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/691 "2020-12-17T18:54:09Z")

</div>

Hi All,

I have embedded Spotify to my dashboard, however i can’t scale down the album picture. Now i only see a quarter of the picture. I have use this code in a template node.

```
<div img height="25%" width="25%" align="center">
<IMG ng-src="{{msg.payload.item.album.images[1].url}}"></IMG>
</div>

```

i tried different percentage in the above code as well as using different units e.g. px or pt. Nothing seems to scale down the image.

Can somebody put me in the right direction?

 ![Screen Shot 2020-12-17 at 7.20.22 PM](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/4/1/4159bc6aec5751c1a2725d5fe36b67247d041f04.jpeg)

Edit: i Solved it to the following code and adjusting the value below stated as XXX

```
<div img height="25%" width="25%" align="center">
<IMG ng-src="{{msg.payload.item.album.images[1].url}}" width="XXX"></IMG>
</div>
```

---

<div class="post-metadata">

**Author:** ![Peter\_van\_Mourik](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/peter_van_mourik/32/16433_2.png) [@Peter\_van\_Mourik](https://community.homey.app/u/Peter_van_Mourik)\
**Post date:** [December 18, 2020, 7:17pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/692 "2020-12-18T19:17:43Z")

</div>

Maybe it has already been covered in this topic but could not find it.

I have successfully created a dashboard with Node-red.

But have a problem with the sliders. These work well if I run the dashboard on an Android or an iOS with an Ipad Air 2.

But my old Ipad Air 1 with iOS 12.4.9 that I would like to use for the dashboard does not work well with the sliders.

For example, as soon as I want to dim a lamp with the slider, it immediately goes back to 0 and gives the message NaN.

Tried with various browsers, Safari, Chrome, Dolphin. But these all do the same.

can someone help me with this?

Peter

---

<div class="post-metadata">

**Author:** ![Jean-Paul\_Boone](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/jean-paul_boone/32/16748_2.png) [@Jean-Paul\_Boone](https://community.homey.app/u/Jean-Paul_Boone)\
**Post date:** [December 20, 2020, 12:21pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/693 "2020-12-20T12:21:07Z")

</div>

Hello all,

Hopefully someone can help me with the following two challenges.  
1: I have a number of shutters that I control with homey via a shelly. Now I would like to get it on the dashboard as well. But in such a way that if they are operated via the homey app, the status on the dashboard also changes. Does anyone have the solution for this?  
2: Unfortunately, there is no app for the intergas gateway to connect it to homey. But is it possible to get this working on the dashboard? So adjust the temperature and read it at that time?

Thanks for the help.

---

<div class="post-metadata">

**Author:** ![Jeroen\_Kokhuis](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/jeroen_kokhuis/32/12592_2.png) [@Jeroen\_Kokhuis](https://community.homey.app/u/Jeroen_Kokhuis)\
**Post date:** [December 22, 2020, 9:17am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/695 "2020-12-22T09:17:43Z")

</div>

Here is my flow with up and down buttons. It wil update when you change the state in Homey:

```auto
[{"id":"efa5750e.7ca688","type":"ui_text","z":"84a66321.9ba59","group":"696f3e0a.ae514","order":26,"width":8,"height":2,"name":"","label":"<b>Hobbykamer</b>","format":"","layout":"col-center","x":220,"y":1300,"wires":[]},{"id":"822ce412.d37bf8","type":"ui_button","z":"84a66321.9ba59","name":"up hk","group":"696f3e0a.ae514","order":29,"width":2,"height":2,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-chevron-circle-up fa-2x","payload":"up","payloadType":"str","topic":"homie/homey-xxxxxxxxxxxxxxxxxxxxxx/windowcoverings/home/Rolluik/windowcoverings_state/set","x":190,"y":1400,"wires":[["6619edc8.06d044"]]},{"id":"89b0069.f9703f8","type":"ui_button","z":"84a66321.9ba59","name":"down hk","group":"696f3e0a.ae514","order":38,"width":2,"height":2,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-chevron-circle-down fa-2x","payload":"down","payloadType":"str","topic":"homie/homey-xxxxxxxxxxxxxxxxxxxx/windowcoverings/home/Rolluik/windowcoverings_state/set","x":200,"y":1480,"wires":[["6619edc8.06d044"]]},{"id":"a24c9852.542648","type":"ui_button","z":"84a66321.9ba59","name":"Stop hk","group":"696f3e0a.ae514","order":35,"width":2,"height":2,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-stop-circle fa-2x","payload":"idle","payloadType":"str","topic":"homie/homey-xxxxxxxxxxxxxxxxxxxxx/windowcoverings/home/Rolluik/windowcoverings_state/set","x":200,"y":1440,"wires":[["6619edc8.06d044"]]},{"id":"8824fc46.5e3d7","type":"ui_template","z":"84a66321.9ba59","group":"696f3e0a.ae514","name":"Rolluik hobbykamer","order":30,"width":6,"height":6,"format":" <div class=\"rollade __container\">\n <svg class=\"rollade__ fenster\" id=\"hobbykamer\" width=\"100%\" height=\"100%\" viewBox=\"0 0 170 188\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xml:space=\"preserve\" xmlns:serif=\"http://www.serif.com/\" style=\"fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;\">\n <g transform=\"matrix(1,0,0,1,-15.909,-45.6212)\">\n <g transform=\"matrix(0.989904,0,0,0.992491,4.03539,0.837446)\">\n <path d=\"M180.329,56.389C180.329,51.839 176.626,48.145 172.064,48.145L23.291,48.145C18.729,48.145 15.025,51.839 15.025,56.389L15.025,222.454C15.025,227.004 18.729,230.698 23.291,230.698L172.064,230.698C176.626,230.698 180.329,227.004 180.329,222.454L180.329,56.389Z\" />\n </g>\n <g transform=\"matrix(1,0,0,1.38253,3.04599,-37.9811)\">\n <path d=\"M97.589,64.432L97.589,191.286\" />\n </g>\n <g transform=\"matrix(1,0,0,1,2.84135,56.1777)\">\n <path d=\"M18.74,83.189L177.463,84.189\" />\n </g>\n </g>\n </svg>\n <svg class=\"rollade__rollade\" style=\"top: calc((-1) * {{msg.payload}}%);\" width=\"100%\" height=\"100%\" viewBox=\"0 0 181 190\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xml:space=\"preserve\" xmlns:serif=\"http://www.serif.com/\" style=\"fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;\">\n <g transform=\"matrix(1.35281,0,0,1.35281,-45.3041,-102.109)\">\n <path class=\"bg\" d=\"M167.134,82.161C167.134,78.473 164.14,75.479 160.452,75.479L40.171,75.479C36.483,75.479 33.489,78.473 33.489,82.161L33.489,208.93C33.489,212.618 36.483,215.612 40.171,215.612L160.452,215.612C164.14,215.612 167.134,212.618 167.134,208.93L167.134,82.161Z\"/>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,-9)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,1)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,11)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,21)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,31)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,41)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,51)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,61)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,71)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,81)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,91)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,101)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n <g transform=\"matrix(1.69574,0,0,1,18.3547,111)\">\n <path class=\"line\" d=\"M13.383,95.652L84.46,95.652\" />\n </g>\n </g>\n </svg>\n </div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":770,"y":1340,"wires":[[]]},{"id":"d8b2650.b923698","type":"mqtt in","z":"84a66321.9ba59","name":"Rolluik Hobbykamer","topic":"homie/homey-5d14b942367eb80ccf0c77c3/rolluik-hk/windowcoverings-state","qos":"2","datatype":"auto","broker":"9a1fe5ba.fab5a8","x":210,"y":1340,"wires":[["eacaca6f.123328"]]},{"id":"6619edc8.06d044","type":"mqtt out","z":"84a66321.9ba59","name":"Hobbykamer","topic":"homie/homey-5d14b942367eb80ccf0c77c3/rolluik-hk/windowcoverings-state/set","qos":"","retain":"","broker":"9a1fe5ba.fab5a8","x":490,"y":1400,"wires":[]},{"id":"eacaca6f.123328","type":"change","z":"84a66321.9ba59","name":"","rules":[{"t":"change","p":"payload","pt":"msg","from":"idle","fromt":"str","to":"30","tot":"num"},{"t":"change","p":"payload","pt":"msg","from":"up","fromt":"str","to":"100","tot":"num"},{"t":"change","p":"payload","pt":"msg","from":"down","fromt":"str","to":"0","tot":"num"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":1340,"wires":[["8824fc46.5e3d7"]]},{"id":"696f3e0a.ae514","type":"ui_group","z":"","name":"Rolluiken_Mobile","tab":"3e1be46a.679abc","order":1,"disp":false,"width":16,"collapse":false},{"id":"9a1fe5ba.fab5a8","type":"mqtt-broker","z":"","name":"Homey MQTT","broker":"192.168.1.6","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","closeTopic":"","closeQos":"0","closePayload":"","willTopic":"","willQos":"0","willPayload":""},{"id":"3e1be46a.679abc","type":"ui_tab","z":"","name":"Rolluiken_Mobile","icon":"dashboard","order":4,"disabled":false,"hidden":false}]

```

![image](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/b/4/b49a868d3f7e15c5c65d5f9f81b7eee487e4cb45.png) ![image](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/4/d/4d9fbed14582163c2e2d752a1b1c3503a96c6497.png)

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [December 22, 2020, 3:21pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/696 "2020-12-22T15:21:06Z")

</div>

> [@Peter\_van\_Mourik](#):
>
> But have a problem with the sliders. These work well if I run the dashboard on an Android or an iOS with an Ipad Air 2.
> 
> But my old Ipad Air 1 with iOS 12.4.9 that I would like to use for the dashboard does not work well with the sliders.
> 
> For example, as soon as I want to dim a lamp with the slider, it immediately goes back to 0 and gives the message NaN.

They work fine on my old iPad 2 (not the Air 2). Only they are half the size as they should be. Some kind of safari render incompatibility or something. Functional they are working fine. Try to output only on release of the slider:  
 ![afbeelding](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/4/a/4a8e5112eebeaa214c713b6f8508621e794f8d0a.png)

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [December 22, 2020, 3:23pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/697 "2020-12-22T15:23:21Z")

</div>

> [@Jean-Paul\_Boone](#):
>
> 1: I have a number of shutters that I control with homey via a shelly. Now I would like to get it on the dashboard as well. But in such a way that if they are operated via the homey app, the status on the dashboard also changes. Does anyone have the solution for this?

Sure, just feed the MQTT data to the slider:

 ![afbeelding](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/1/f/1f5173a87c54dab60fcaf47dc66987c6f263823e.png)  
( My topic: homie/homey-topic/gordijn-voor/windowcoverings-set )

[Previous page](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798.md?page=33)

[Next page](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798.md?page=35)