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.
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}]
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!
It would be nice and useful for others if you share a little example with blinking icon. 
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.
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | OpenJS Foundation Bylaws | Trademark Policy | Trademark List | Cookie Policy