Contextmenu dynamic item change

General
1

Hi is there away to dynamically enable/disable a menu item or change the menu item text. I'm thinking "light switch" - two items: On and Off one is disabled but changes when the enabled one is selected. Or one item and the text changes when the item is selected.

I can see how a global state variable could be used to push different menu's into the context menu node, but i thought i may have missed something.

I'm having great fun with it and the SVG node, I appreciate all the hard thinking for my pleasure.

2

you can build your menu in a function node based on flow or global variables everytime you show it.
The menu gets build out of an array that contains an object for every menu item. If you attach the property enabled:“false“ to the object of an entry it gets disabled.
What I do for light switches is to just use one menu entry and just change the icon property either using fa-toggle-off or fa-toggle-on and also changing the payload property accordingly.
Here is an example of booth, the top three entries are light scenes and the fourth one is a general toogle switch for the whole room. If you select a scene i disable that menu object and change the toggle icon to on:

image
image1125Ă—1078 101 KB
image
image1125Ă—1069 183 KB

here is the function node that builds the menu:

[{"id":"6689e387.3992ec","type":"function","z":"909b8ee5.d1219","name":"Make Schlafzimmer Menu","func":"var Nachtlicht = {\n    text:\"Nachtlicht\",\n    icon:\"fa-circle-o\",\n    topic:\"Nachtlicht\",\n    payload:\"ON\",\n    enabled:true,\n    payloadType:\"string\"\n}\nvar KleinesSchlafzimmerlicht = {\n    text:\"Kleines Schlafzimmerlicht\",\n    icon:\"fa-adjust\",\n    topic:\"KleinesSchlafzimmerlicht\",\n    payload:\"ON\",\n    enabled:true,\n    payloadType:\"string\"\n}\nvar GrossesSchlafzimmerlicht = {\n    text:\"Großes Schlafzimmerlicht\",\n    icon:\"fa-circle\",\n    topic:\"GrossesSchlafzimmerlicht\",\n    payload:\"ON\",\n    enabled:true,\n    payloadType:\"string\"\n}\nvar Schlafzimmer = {\n    text:\"Schlafzimmerlicht\",\n    icon:\"fa-toggle-off\",\n    topic:\"KleinesSchlafzimmerlicht\",\n    payload:\"ON\",\n    enabled:true,\n    payloadType:\"string\"\n}\nvar Geraete = {\n    text:\"Geräte\",\n    icon:\"fa-cogs\",\n    topic:\"Menu\",\n    payload:\"SchlafzimmerMenu\",\n    enabled:true,\n    payloadType:\"string\"\n}\nvar SchlafzimmerSzenen = flow.get(\"SchlafzimmerSzenen\");\nif(typeof SchlafzimmerSzenen !== undefined){\n    if(SchlafzimmerSzenen.Nachtlicht == \"ON\") Nachtlicht.enabled = false;\n    if(SchlafzimmerSzenen.KleinesSchlafzimmerlicht == \"ON\") KleinesSchlafzimmerlicht.enabled = false;\n    if(SchlafzimmerSzenen.GrossesSchlafzimmerlicht == \"ON\") GrossesSchlafzimmerlicht.enabled = false;\n}\nvar Schlafzimmerlicht = flow.get(\"Schlafzimmerlicht\");\nif(typeof Schlafzimmerlicht !== undefined){\n    if(Schlafzimmerlicht == \"ON\"){\n        Schlafzimmer.topic = \"Schlafzimmerlicht\";\n        Schlafzimmer.icon = \"fa-toggle-on\";\n        Schlafzimmer.payload = \"OFF\";\n    }\n}\nmsg.menu = [Nachtlicht, KleinesSchlafzimmerlicht, GrossesSchlafzimmerlicht, Schlafzimmer, Geraete];\nreturn msg;","outputs":1,"noerr":0,"x":2250,"y":840,"wires":[["e30ddf34.1d84a8"]]}]

Hope this answers your question, Johannes

1 Like
3

@JGKK

Thanks Johannes,
that's a good approach and the use of Icon probably makes it clearer and cleaner. Thanks also for sharing the function node.
daniel

4

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