Get output from button

Dashboard
1

It seems the easiest thing ever, but I can't do it, even googling and reading for a week.

With a function node I prepare a msg object like:

msg.payload = "label number 1";
msg.background="cyan";
msg.color="blue";

then it does ret msg.

The next node is the button one whose properties are Label -> {{msg.payload}}, Color -> {{msg.color}}, Background -> {{msg.background}}.

So far it was pretty easy and everything is ok.

Now I put another function node where I change the button's label to update it once pressed. This arise two problems:

  1. I can't get the button output (output=what is the label showed when it is pressed)
  2. button-function-button, is a loop(!)

Help for 1 and 2

Thanks

2

There is an option on the button to pass through. Switch that off.

3
  1. buttons only send what they are configured to send, they can't send the label.
4

Yes, in that way I could avoid the loop but the button's label won't be update.

5

I hoped in a workaround to achieve the same effect.

My idea: a function to set the current and the new label's value (saved in global var) next in the flow is the btn node (to update the btn, with pass through on) then a gate node to the stop the flow loop only if the label isn't equal to the previous.
I tried this path but you initialize the button with "1". You press it and default value for the gate is open, so it goes to the function and it sets the current_label="1" and new_label="2"; the btn is update, as it has the pass-through on, it calls the gate current_label!=new_label the flow goes over and effect is that the button says "1", you press and the button's label changes in "7". I thought to place a delay node but a) it gets very slow and user keep pressing as anything happen in the ui; b) if a user is very slow the effect 1 to 7 happens again.

6

If you use topic instead that does get passed through...

[{"id":"c421e3a4.c3d4","type":"ui_button","z":"d3236f0.2a14a9","name":"","group":"82869eba.d348d","order":2,"width":0,"height":0,"passthru":false,"label":"Click {{topic}}","tooltip":"","color":"","bgcolor":"","icon":"","payload":"1","payloadType":"str","topic":"topic","topicType":"msg","x":370,"y":260,"wires":[["2f405f93.2bf4a"]]},{"id":"2f405f93.2bf4a","type":"function","z":"d3236f0.2a14a9","name":"","func":"context.count = (context.count || 0) + 1;\nmsg.topic = context.count;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":500,"y":320,"wires":[["c421e3a4.c3d4"]]},{"id":"82869eba.d348d","type":"ui_group","name":"Old Mayflower","tab":"9979cb8a.2a3238","order":2,"disp":true,"width":"9","collapse":false},{"id":"9979cb8a.2a3238","type":"ui_tab","name":"TEST","icon":"dashboard","order":20,"disabled":false,"hidden":false}]
7

Congratulations!!
With just two nodes: amazing.
I slighly changed it to better understand how it works, I made a "semaphore".

[{"id":"1612856b.8afac3","type":"tab","label":"semaphore btn","disabled":false,"info":""},{"id":"c421e3a4.c3d4","type":"ui_button","z":"1612856b.8afac3","name":"","group":"82869eba.d348d","order":2,"width":0,"height":0,"passthru":false,"label":"{{topic}}","tooltip":"","color":"{{msg.color}}","bgcolor":"{{msg.background}}","icon":"","payload":"whatever","payloadType":"str","topic":"topic","topicType":"msg","x":380,"y":195,"wires":[["2f405f93.2bf4a"]]},{"id":"2f405f93.2bf4a","type":"function","z":"1612856b.8afac3","name":"","func":"//context.count = (context.count || 0) + 1;\n//msg.topic = context.count;\n\nswitch (context.status) {\n    case \"green\" :     \n        context.status = \"orange\";\n        msg.background=\"orange\";\n        break;\n    case \"orange\" :     \n        context.status = \"red\";\n        msg.background=\"red\";\n        break;\n    case \"red\" :     \n        context.status = \"green\";\n        msg.background=\"green\";\n        break;\n    default :     \n        context.status = \"orange\";\n        msg.background=\"orange\";\n        break;\n}\nmsg.color = \"black\";\nmsg.topic = context.status;\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":360,"y":345,"wires":[["c421e3a4.c3d4"]]},{"id":"82869eba.d348d","type":"ui_group","name":"Old Mayflower","tab":"9979cb8a.2a3238","order":2,"disp":true,"width":"9","collapse":false},{"id":"9979cb8a.2a3238","type":"ui_tab","name":"TEST","icon":"dashboard","order":20,"disabled":false,"hidden":false}]
1 Like
8

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