Led Node (change the imagem)

Hi guys, anybody know if is possibly change this widget “LED” for another? Or if exist another way to put a different image here? I was thinking in use a presence-detector and use the image fa-male. I know that using the widget switch I can use different kinds of imagem, but the switch has action (on-off or in-out). I would like just like the “LED”, simple, without human interference. For example if the message is true or false or another kind of entrance, the symbol changes the color.

image


image

One and simplest ways is with ui_text node.

[{"id":"7e990cd.b3b83f4","type":"ui_text","z":"fc175fd6.1585c","group":"c3500612.c24038","order":7,"width":"2","height":"2","name":"","label":"","format":"<font color={{msg.payload}}><i class=\"fa fa-3x fa-male\"></i></font>","layout":"col-center","x":490,"y":1020,"wires":[]},{"id":"4e7b767c.3688e8","type":"inject","z":"fc175fd6.1585c","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"true","payloadType":"bool","x":150,"y":1000,"wires":[["1ea896fe.740269"]]},{"id":"f83816f3.408898","type":"inject","z":"fc175fd6.1585c","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"false","payloadType":"bool","x":150,"y":1040,"wires":[["1ea896fe.740269"]]},{"id":"1ea896fe.740269","type":"change","z":"fc175fd6.1585c","name":"","rules":[{"t":"change","p":"payload","pt":"msg","from":"true","fromt":"bool","to":"green","tot":"str"},{"t":"change","p":"payload","pt":"msg","from":"false","fromt":"bool","to":"gray","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":320,"y":1020,"wires":[["7e990cd.b3b83f4"]]},{"id":"c3500612.c24038","type":"ui_group","z":"","name":"Btn2","tab":"94f74e9f.6a717","order":1,"disp":true,"width":"4","collapse":false},{"id":"94f74e9f.6a717","type":"ui_tab","z":"503e64bc.acab6c","name":"TEST","icon":"dashboard","order":7,"disabled":false,"hidden":false}]
1 Like

Yeahhhhhhhh @hotNipi

1 Like

Thank you very much for the reply!

I'm currently working on a dashboard to show the signal lights of the machines in the factory at work. I use the node-red-contrib-ui-led-fork nodes, but those nodes can only work with the whole payload as an input, I can't have different properties and change according to those. Therefore, if I want it to blink, I have to switch the payload as often as the blink frequency.

To capture the blink, I was reading the status of each machine every 500 ms, and read the bits for the signal tower. This creates a lot of network traffic, and the Dashboard is being updated as often as that, at least (of course, machines are not synced, so it might be more often than that, even).

That generated UI refreshes so often that it was impossible to display the UI on a Smart TV browser or using a Raspberry Pi (even the 4 GB RAM version was unable to show it without getting "connection lost" errors).

This solution of yours allows me to edit the CSS to create a blinking animation class for the dashboard and use it in the text node, saving me A LOT of traffic in the network (and looking better, in my opinion).

Seriously, thanks again!

2 Likes

It would be nice and useful for others if you share a little example with blinking icon. :slight_smile:

1 Like

Quick diversion - why are you using the -fork version - it seems to be a 100% copy of the led node ?

There you go:

[{"id":"5bf65851.e04498","type":"subflow","name":"STD SIGNAL","info":"","category":"","in":[{"x":60,"y":120,"wires":[{"id":"af889efb.c609c"}]}],"out":[{"x":500,"y":120,"wires":[{"id":"af889efb.c609c","port":0}]}],"env":[],"color":"#DDAA99"},{"id":"af889efb.c609c","type":"function","z":"5bf65851.e04498","name":"CHANGE","func":"//initialise\nGreen = \"Dimgray\";\nGstyle = \"normal\";\nYellow = \"Dimgray\";\nYstyle = \"normal\";\nRed = \"Dimgray\";\nRstyle = \"normal\";\n\n\nif (msg.payload.opmode === 0){\n    Red = \"Red\";\n}\n\nif (msg.payload.opmode == 1){\n    Green = \"LimeGreen\";\n    Gstyle = \"greenblink\";\n    Yellow = \"Yellow\";\n    Ystyle = \"blink\";\n}\n\nif (msg.payload.opmode == 2){\n    Green = \"LimeGreen\";\n}\n\nif (msg.payload.opmode == 3){\n    Yellow = \"Yellow\";\n}\n\nif (msg.payload.error){\n    Red = \"Red\";\n    Rstyle = \"normal\";\n}\n\nif (((msg.payload.homing)||(msg.payload.cyclestop)||(msg.payload.warning)) && (msg.payload.opmode != 3)){\n    Yellow = \"Yellow\";\n    Ystyle = \"blink\";\n}\n\nmsg.payload = {GreenLamp: Green, Greenstyle: Gstyle, YellowLamp: Yellow, Yellowstyle: Ystyle, RedLamp: Red, Redstyle: Rstyle};\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":200,"y":120,"wires":[[]]},{"id":"277df45a.56f8ec","type":"inject","z":"d2b458d6.63e2d8","name":"CYCLE STOP","props":[{"p":"payload.cyclestop","v":"true","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":350,"y":300,"wires":[["4c830bc5.c65464"]]},{"id":"9c0abbcb.2b9818","type":"inject","z":"d2b458d6.63e2d8","name":"HOMING","props":[{"p":"payload.homing","v":"true","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":360,"y":380,"wires":[["4c830bc5.c65464"]]},{"id":"dc0b4b5f.3aeef8","type":"inject","z":"d2b458d6.63e2d8","name":"AUTO","props":[{"p":"payload.homing","v":"false","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":370,"y":420,"wires":[["4c830bc5.c65464"]]},{"id":"bc8061f5.85691","type":"ui_slider","z":"d2b458d6.63e2d8","name":"OPERATION MODE","label":"Operation Mode","tooltip":"","group":"70d7c4e.0c5f13c","order":5,"width":"8","height":"1","passthru":false,"outs":"end","topic":"","min":0,"max":"4","step":1,"x":320,"y":540,"wires":[["69306ba8.bd5084"]]},{"id":"4c830bc5.c65464","type":"join","z":"d2b458d6.63e2d8","name":"","mode":"custom","build":"merged","property":"payload","propertyType":"msg","key":"topic","joiner":"\\n","joinerType":"str","accumulate":true,"timeout":"","count":"1","reduceRight":false,"reduceExp":"","reduceInit":"","reduceInitType":"","reduceFixup":"","x":790,"y":420,"wires":[["c699ed33.d358d"]]},{"id":"97abcbec.768f38","type":"inject","z":"d2b458d6.63e2d8","name":"CYCLE START","props":[{"p":"payload.cyclestop","v":"false","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":340,"y":340,"wires":[["4c830bc5.c65464"]]},{"id":"4f4e2a8a.43d774","type":"inject","z":"d2b458d6.63e2d8","name":"ERROR","props":[{"p":"payload.error","v":"true","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":370,"y":460,"wires":[["4c830bc5.c65464"]]},{"id":"b76817c9.fe2428","type":"inject","z":"d2b458d6.63e2d8","name":"RESET","props":[{"p":"payload.error","v":"false","vt":"bool"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":370,"y":500,"wires":[["4c830bc5.c65464"]]},{"id":"69306ba8.bd5084","type":"function","z":"d2b458d6.63e2d8","name":"CHANGE OUTPUT","func":"var operation_mode = msg.payload;\n\nmsg.payload = {opmode: operation_mode};\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":530,"y":540,"wires":[["4c830bc5.c65464"]]},{"id":"c699ed33.d358d","type":"subflow:5bf65851.e04498","z":"d2b458d6.63e2d8","name":"","env":[],"x":930,"y":420,"wires":[["46862581.d9d61c","88efa024.eb445","dc53d105.2d233"]]},{"id":"46862581.d9d61c","type":"ui_text","z":"d2b458d6.63e2d8","group":"70d7c4e.0c5f13c","order":1,"width":"6","height":"1","name":"GREEN","label":"MACHINE STATUS","format":"<font color={{msg.payload.GreenLamp}}><a class={{msg.payload.Greenstyle}}><i class=\"fa fa-2x fa-circle\"></i></a></font>","layout":"row-spread","x":1360,"y":380,"wires":[]},{"id":"dc53d105.2d233","type":"ui_text","z":"d2b458d6.63e2d8","group":"70d7c4e.0c5f13c","order":3,"width":"1","height":"1","name":"RED","label":"","format":"<font color={{msg.payload.RedLamp}}><a class={{msg.payload.Redstyle}}><i class=\"fa fa-2x fa-circle\"></i></a></font>","layout":"row-left","x":1350,"y":460,"wires":[]},{"id":"88efa024.eb445","type":"ui_text","z":"d2b458d6.63e2d8","group":"70d7c4e.0c5f13c","order":2,"width":"1","height":"1","name":"YELLOW","label":"","format":"<font color={{msg.payload.YellowLamp}}><a class={{msg.payload.Yellowstyle}}><i class=\"fa fa-2x fa-circle\"></i></a></font>","layout":"row-center","x":1360,"y":420,"wires":[]},{"id":"70d7c4e.0c5f13c","type":"ui_group","z":"","name":"LIGHTS TEST","tab":"1434dbba.fdea74","order":1,"disp":true,"width":"8","collapse":true},{"id":"1434dbba.fdea74","type":"ui_tab","z":"d2b458d6.63e2d8","name":"TESTS","icon":"dashboard","order":7,"disabled":false,"hidden":false}]

Not sure if it's correct, I started with node-red two weeks ago, and I'm already thinking if I can manage all the automation in the factory with this. I already got almost all the data tracking, so it's going well.

2 Likes

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.