Uibuilder global.get/set

Hello everyone,

I'm new to this form and to the world of node-red.

I have minor knowledge of node.js and javascript in general, but I like to learn by doing.

I wanted to ask about accessing global node-red variables inside index.js of the uibuilder node.

I have tried it, but whenever I use it my page shows blank.

I would appreciate your help.

Ahmad

If you are new to this world are you sure you want to start with uibuilder? If you just need simple user inputs and displays then using the node red dashboard is much simpler to start with.

I have tried it

Tried what exactly ?

It is easy enough to convert your variable to a payload and inject that into the uibuilder node.

Thanks for the reply.

I know that I can inject it as a payload, my question was about using global.get method, which can be used in the functions node, in the index.js file.

You can't, as it works with websockets.

Thanks for the reply Mr. Colin,

for my application I am building two dashboards for an escape room control, the first dashboard is for the game master and the second is for the in-room-display.

the in-room-display shows time remaining and clues (text, video, images, audio).
I have build this dashboard using the html templates.
during the game sometimes I want to push a clue and hide the timer, so what I am doing is sending uicontrol commands to show/hide dashboard groups.

for some reason, if I configure buttons in another dashboard tab to show/hide groups it does not work.

so now I have to build the game masters dashboard using the uibuilder and I have succeeded doing some of the functions I want, but I also want to get/set some global variables that I have defined.

Oh :upside_down_face:

thanks, Mr. bakman2

Do you not want to find why that is not working for you?

I would like to, please if you know the answer.

Show us what you have done that doesn't work. Export just the nodes required to show the problem and paste the flow here using the </> button.

You either use a function node or a change node - either of which can access global, flow and context variables. So use one of those nodes to get the variable and add it to the msg that you are sending to uibuilder.

[{"id":"68d3475.1420eb8","type":"inject","z":"ad66278e.6d8fa8","name":"Setup","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":190,"y":240,"wires":[["a734b592.153ac8"]]},{"id":"696781ce.4e23","type":"inject","z":"ad66278e.6d8fa8","name":"Loop","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":190,"y":380,"wires":[["30faf8c5.210de8"]]},{"id":"a734b592.153ac8","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"stopped","tot":"str"},{"t":"set","p":"timeRemaining","pt":"global","to":"3600000","tot":"str"},{"t":"set","p":"currentTime","pt":"global","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":390,"y":240,"wires":[[]]},{"id":"f5e76077.727ef","type":"function","z":"ad66278e.6d8fa8","name":"Format Time As HH:MM:SS","func":"// msg.time is in milliseconds\nvar t = msg.timeRemaining / 1000;\nvar h = Math.floor(t / 3600);\nvar m = Math.floor(t % 3600 / 60);\nvar s = Math.floor(t % 3600 % 60);\n\n// Format into hh:mm:ss\nmsg.timerText = (\"0\" + h).slice(-2) + \":\" + (\"0\" + m).slice(-2) + \":\" + (\"0\" + s).slice(-2);\n\n// Update the editor node\nnode.status({fill:\"green\", shape:\"dot\", text:msg.timerText});\n\n// Forward the message along the flow\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":690,"y":380,"wires":[["c01e5e0a.472a1","bcce0bc9.a53148"]]},{"id":"30faf8c5.210de8","type":"function","z":"ad66278e.6d8fa8","name":"Update Game Timer","func":"// The current timestamp is injected at the start of the flow\nvar currentTime = msg.payload;\nvar lastTickTime = global.get(\"lastTickTime\") || currentTime;\nvar timeRemaining = global.get(\"timeRemaining\") || 0;\nvar gameState = global.get(\"gameState\")\n\nif (gameState == \"playing\"){\n    timeRemaining -= (currentTime - lastTickTime);\n    global.set(\"timeRemaining\", timeRemaining);\n}\n\nmsg.timeRemaining = timeRemaining;\nglobal.set(\"lastTickTime\", currentTime);\n\n\nnode.status({fill:\"green\",shape:\"dot\",text:timeRemaining});\n\n// Pass value along the flow\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":410,"y":380,"wires":[["f5e76077.727ef"]]},{"id":"c01e5e0a.472a1","type":"ui_template","z":"ad66278e.6d8fa8","group":"bfd571d7.39a74","name":"Remaining Time","order":0,"width":"20","height":"10","format":"<div ng-bind-html=\"msg.timerText\">\n    <div class=\"timerText\" >\n        {{msg.timerText}}\n    </div>\n</div>\n\n<style>\n#inRoom_Timer_cards {\n    margin-top: 200px;\n    font-size: 200px !important;\n    text-align: center;\n}\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":1020,"y":380,"wires":[[]]},{"id":"f717d60f.eef928","type":"ui_template","z":"ad66278e.6d8fa8","group":"cd9fd577.8b6588","name":"","order":1,"width":0,"height":0,"format":"<style>\n    \n    #toolbar{\n        display: none;\n    }\n    body {\n        background-color: black !important;\n    }\n    .nr-dashboard-template {\n        background-color: black !important;\n        color: white !important;\n    }\n    .ng-scope.visible {\n        background-color: black !important;\n        border-style: none;\n    }\n    #inRoom_Default_cards {\n        background-color: black !important;\n    }\n\n    \n</style>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":790,"y":240,"wires":[[]]},{"id":"483daaff.2034d4","type":"comment","z":"ad66278e.6d8fa8","name":"Setup","info":"","x":640,"y":160,"wires":[]},{"id":"bcce0bc9.a53148","type":"ui_text","z":"ad66278e.6d8fa8","group":"6d5368d4.52c8f8","order":1,"width":0,"height":0,"name":"","label":"Time Remaining","format":"{{msg.timerText}}","layout":"col-center","x":1020,"y":320,"wires":[]},{"id":"c96968a.26ee298","type":"ui_template","z":"ad66278e.6d8fa8","group":"d24ddc84.67761","name":"Clue","order":0,"width":"20","height":"10","format":"<div ng-bind-html=\"msg.clueText\">\n    <div class=\"clueText\">\n        {{msg.clueText}}\n    </div>\n</div>\n\n<style>\n    #inRoom_txtClue_cards {\n        margin-top: 50px;\n        font-size: 200px !important;\n        text-align: center;\n    }\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":1050,"y":506,"wires":[[]]},{"id":"6157f88a.8dfbf8","type":"trigger","z":"ad66278e.6d8fa8","name":"","op1":"","op2":" ","op1type":"pay","op2type":"str","duration":"20","extend":false,"units":"s","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":590,"y":506,"wires":[["2cb112ca.73857e"]]},{"id":"2cb112ca.73857e","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"clueText","pt":"msg","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":790,"y":506,"wires":[["c96968a.26ee298"]]},{"id":"64c23252.e53b9c","type":"comment","z":"ad66278e.6d8fa8","name":"Display Text","info":"","x":650,"y":440,"wires":[],"icon":"node-red/parser-html.svg"},{"id":"edc22206.a61b4","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"{\"group\": {\"hide\": [\"inRoom_Timer\"],\"show\": [\"inRoom_txtClue\"], \"focus\": true}}","tot":"json"}],"action":"","property":"","from":"","to":"","reg":false,"x":420,"y":606,"wires":[["36fb20a3.aa769"]]},{"id":"36fb20a3.aa769","type":"trigger","z":"ad66278e.6d8fa8","name":"","op1":"","op2":" {\"group\": {\"hide\": [\"inRoom_txtClue\"],\"show\": [\"inRoom_Timer\"], \"focus\": true}}","op1type":"pay","op2type":"json","duration":"20","extend":false,"units":"s","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":730,"y":606,"wires":[["2a8b789.2389888"]]},{"id":"16de9de1.6a5db2","type":"delay","z":"ad66278e.6d8fa8","name":"","pauseType":"delay","timeout":"5","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":400,"y":506,"wires":[["6157f88a.8dfbf8"]]},{"id":"2a8b789.2389888","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":1040,"y":606,"wires":[[]]},{"id":"8096c2f.0ede04","type":"inject","z":"ad66278e.6d8fa8","name":"","props":[{"p":"payload","v":"Here's a clue!","vt":"str"},{"p":"topic","v":"","vt":"string"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Here's a clue!","payloadType":"str","x":170,"y":600,"wires":[["16de9de1.6a5db2","edc22206.a61b4"]]},{"id":"605230c6.55af5","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"240ed09b.e4ad9","order":0,"width":0,"height":0,"passthru":false,"label":"Here's a clue!","tooltip":"","color":"","bgcolor":"","icon":"","payload":"Here's a clue!","payloadType":"str","topic":"","x":160,"y":520,"wires":[["16de9de1.6a5db2","edc22206.a61b4"]]},{"id":"2ec43e51.75f482","type":"inject","z":"ad66278e.6d8fa8","name":"show vidclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"show\": [\"Room_vidClue\"], \"focus\": true}}","payloadType":"json","x":1010,"y":920,"wires":[["68989094.53119"]]},{"id":"a2b7d580.ed0948","type":"inject","z":"ad66278e.6d8fa8","name":"hide vidclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"hide\": [\"Room_vidClue\"], \"focus\": true}}","payloadType":"json","x":1010,"y":1000,"wires":[["68989094.53119"]]},{"id":"67e2dbd7.bb0944","type":"inject","z":"ad66278e.6d8fa8","name":"show imgclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"show\": [\"Room_imgClue\"], \"focus\": true}}","payloadType":"json","x":1010,"y":760,"wires":[["145f9bc9.320934"]]},{"id":"d52f9821.20b9e8","type":"inject","z":"ad66278e.6d8fa8","name":"hide imgclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"hide\": [\"Room_imgClue\"], \"focus\": true}}","payloadType":"json","x":1010,"y":840,"wires":[["145f9bc9.320934"]]},{"id":"89cec276.7de2e","type":"inject","z":"ad66278e.6d8fa8","name":"show txtclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"show\": [\"Room_txtClue\"], \"focus\": true}}","payloadType":"json","x":590,"y":920,"wires":[["c566197a.830618"]]},{"id":"f5e18152.0c092","type":"inject","z":"ad66278e.6d8fa8","name":"hide txtclue","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"hide\": [\"Room_txtClue\"], \"focus\": true}}","payloadType":"json","x":590,"y":1000,"wires":[["c566197a.830618"]]},{"id":"f46ea310.8f4d9","type":"inject","z":"ad66278e.6d8fa8","name":"show timer","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"show\": [\"Room_Timer\"], \"focus\": true}}","payloadType":"json","x":580,"y":760,"wires":[["87e404d2.43ffd8"]]},{"id":"c9abb390.7f76a","type":"inject","z":"ad66278e.6d8fa8","name":"hide timer","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"group\": {\"hide\": [\"Room_Timer\"], \"focus\": true}}","payloadType":"json","x":580,"y":840,"wires":[["87e404d2.43ffd8"]]},{"id":"b338231e.47227","type":"comment","z":"ad66278e.6d8fa8","name":"Room Controls","info":"","x":560,"y":680,"wires":[]},{"id":"98a72fc4.d05d2","type":"inject","z":"ad66278e.6d8fa8","name":"play","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":110,"y":760,"wires":[["db5dad75.117dc"]]},{"id":"f98cdfa4.2e004","type":"inject","z":"ad66278e.6d8fa8","name":"stop","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":110,"y":880,"wires":[["72ee5ea1.0b8bf"]]},{"id":"db5dad75.117dc","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"playing","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":330,"y":760,"wires":[[]]},{"id":"72ee5ea1.0b8bf","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"stopped","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":330,"y":880,"wires":[[]]},{"id":"bce7b82a.eb56b8","type":"inject","z":"ad66278e.6d8fa8","name":"reset","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":110,"y":1000,"wires":[["b31b7cfa.72df3"]]},{"id":"b31b7cfa.72df3","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"timeRemaining","pt":"global","to":"3600000","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":330,"y":1000,"wires":[[]]},{"id":"34348e78.5c6652","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":2,"width":0,"height":0,"passthru":false,"label":"Play","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":120,"y":680,"wires":[["db5dad75.117dc"]]},{"id":"10a7952f.ffa0db","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":3,"width":0,"height":0,"passthru":false,"label":"Stop","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":110,"y":820,"wires":[["72ee5ea1.0b8bf"]]},{"id":"ffa617b6.6a9728","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":4,"width":0,"height":0,"passthru":false,"label":"Reset","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":110,"y":940,"wires":[["b31b7cfa.72df3"]]},{"id":"87e404d2.43ffd8","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":760,"y":800,"wires":[[]]},{"id":"c566197a.830618","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":760,"y":960,"wires":[[]]},{"id":"145f9bc9.320934","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":1220,"y":800,"wires":[[]]},{"id":"68989094.53119","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":1220,"y":960,"wires":[[]]},{"id":"6882e3c2.c60a6c","type":"ui_microphone","z":"ad66278e.6d8fa8","group":"82e5f052.a70a","order":4,"width":0,"height":0,"name":"click to speak","maxLength":"20","timeslice":0,"x":150,"y":1080,"wires":[["98cd1368.62fd3"]]},{"id":"98cd1368.62fd3","type":"ui_audio","z":"ad66278e.6d8fa8","name":"","group":"cd9fd577.8b6588","voice":"en-US","always":"","x":1100,"y":1080,"wires":[]},{"id":"bfd571d7.39a74","type":"ui_group","z":"","name":"Timer","tab":"7b633966.786a88","order":1,"disp":false,"width":"20","collapse":false},{"id":"cd9fd577.8b6588","type":"ui_group","z":"","name":"Default","tab":"7b633966.786a88","order":3,"disp":false,"width":"1","collapse":false},{"id":"6d5368d4.52c8f8","type":"ui_group","z":"","name":"Time Control","tab":"b71ff150.a0cce","order":6,"disp":true,"width":"6","collapse":false},{"id":"d24ddc84.67761","type":"ui_group","z":"","name":"txtClue","tab":"7b633966.786a88","order":2,"disp":false,"width":"20","collapse":false},{"id":"240ed09b.e4ad9","type":"ui_group","z":"","name":"Text Clues","tab":"b71ff150.a0cce","order":2,"disp":true,"width":"6","collapse":false},{"id":"82e5f052.a70a","type":"ui_group","z":"","name":"Push to talk","tab":"b71ff150.a0cce","order":3,"disp":true,"width":"6","collapse":false},{"id":"7b633966.786a88","type":"ui_tab","z":"","name":"inRoom","icon":"dashboard","disabled":false,"hidden":false},{"id":"b71ff150.a0cce","type":"ui_tab","z":"","name":"Master","icon":"dashboard","disabled":false,"hidden":false}]

this is part of the code,

  • I have two dashboards,inRoom, which is to be displayed inside the room
  • and, Master which supposed to be for the game master.
  • the play, stop, and reset buttons work just fine.
  • the clue button in the master dashboard does not work.
  • when I try to push a text clue by the inject node it works.

Thanks Mr. Colin for your help

I can't test your flow at the moment, but you say that it works if you use an inject node, but not if you use the button. Add a debug node that shows what is going to the ui_control node (I presume that both the inject and debug node go to the ui_control node), then look for a difference between the two messages. There must be a difference if one of them shows/hides the groups and the other doesn't.

I have tried that, and re-tried it just now, it is the same input to the uicontrols node in both cases.
exactly the same.

Screenshot the two messages in debug here

[Edit] and also tell us what you expect them to do.

both examples supposed to show text on the screen, then show back the timer.

the text is in "inRoom_txtClue' group.
the timer is in "inRoom_Timer" group.

so when I inject( or hit the dashboard button) I'll send the text clue to the html template in the "inRoom_txtClue' group, show the group and hide the "inRoom_Timer" group to do so, I'm injecting group show/hide command to the uicontrol node.

this is how my flow look like.

Do either of the actions happen when you click the button?

Can you try and construct a simple flow exhibiting the problem which we can import and test?

Also please start node red in a terminal and post what you see, from the Welcome message to when you click the failing button.

No, neither work.

Here this is the minimum flow to show what I'm struggling with.

[{"id":"68d3475.1420eb8","type":"inject","z":"ad66278e.6d8fa8","name":"Setup","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":190,"y":240,"wires":[["a734b592.153ac8"]]},{"id":"696781ce.4e23","type":"inject","z":"ad66278e.6d8fa8","name":"Loop","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":190,"y":380,"wires":[["30faf8c5.210de8"]]},{"id":"a734b592.153ac8","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"stopped","tot":"str"},{"t":"set","p":"timeRemaining","pt":"global","to":"3600000","tot":"str"},{"t":"set","p":"currentTime","pt":"global","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":390,"y":240,"wires":[[]]},{"id":"f5e76077.727ef","type":"function","z":"ad66278e.6d8fa8","name":"Format Time As HH:MM:SS","func":"// msg.time is in milliseconds\nvar t = msg.timeRemaining / 1000;\nvar h = Math.floor(t / 3600);\nvar m = Math.floor(t % 3600 / 60);\nvar s = Math.floor(t % 3600 % 60);\n\n// Format into hh:mm:ss\nmsg.timerText = (\"0\" + h).slice(-2) + \":\" + (\"0\" + m).slice(-2) + \":\" + (\"0\" + s).slice(-2);\n\n// Update the editor node\nnode.status({fill:\"green\", shape:\"dot\", text:msg.timerText});\n\n// Forward the message along the flow\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":690,"y":380,"wires":[["c01e5e0a.472a1","bcce0bc9.a53148"]]},{"id":"30faf8c5.210de8","type":"function","z":"ad66278e.6d8fa8","name":"Update Game Timer","func":"// The current timestamp is injected at the start of the flow\nvar currentTime = msg.payload;\nvar lastTickTime = global.get(\"lastTickTime\") || currentTime;\nvar timeRemaining = global.get(\"timeRemaining\") || 0;\nvar gameState = global.get(\"gameState\")\n\nif (gameState == \"playing\"){\n    timeRemaining -= (currentTime - lastTickTime);\n    global.set(\"timeRemaining\", timeRemaining);\n}\n\nmsg.timeRemaining = timeRemaining;\nglobal.set(\"lastTickTime\", currentTime);\n\n\nnode.status({fill:\"green\",shape:\"dot\",text:timeRemaining});\n\n// Pass value along the flow\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":410,"y":380,"wires":[["f5e76077.727ef"]]},{"id":"c01e5e0a.472a1","type":"ui_template","z":"ad66278e.6d8fa8","group":"bfd571d7.39a74","name":"Remaining Time","order":0,"width":"20","height":"10","format":"<div ng-bind-html=\"msg.timerText\">\n    <div class=\"timerText\" >\n        {{msg.timerText}}\n    </div>\n</div>\n\n<style>\n#inRoom_Timer_cards {\n    margin-top: 200px;\n    font-size: 200px !important;\n    text-align: center;\n}\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":1020,"y":380,"wires":[[]]},{"id":"f717d60f.eef928","type":"ui_template","z":"ad66278e.6d8fa8","group":"cd9fd577.8b6588","name":"","order":1,"width":0,"height":0,"format":"<style>\n    \n    #toolbar{\n        display: none;\n    }\n    body {\n        background-color: black !important;\n    }\n    .nr-dashboard-template {\n        background-color: black !important;\n        color: white !important;\n    }\n    .ng-scope.visible {\n        background-color: black !important;\n        border-style: none;\n    }\n    #inRoom_Default_cards {\n        background-color: black !important;\n    }\n\n    \n</style>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":790,"y":240,"wires":[[]]},{"id":"483daaff.2034d4","type":"comment","z":"ad66278e.6d8fa8","name":"Setup","info":"","x":640,"y":160,"wires":[]},{"id":"bcce0bc9.a53148","type":"ui_text","z":"ad66278e.6d8fa8","group":"6d5368d4.52c8f8","order":1,"width":0,"height":0,"name":"","label":"Time Remaining","format":"{{msg.timerText}}","layout":"col-center","x":1020,"y":320,"wires":[]},{"id":"c96968a.26ee298","type":"ui_template","z":"ad66278e.6d8fa8","group":"d24ddc84.67761","name":"Clue","order":0,"width":"20","height":"10","format":"<div ng-bind-html=\"msg.clueText\">\n    <div class=\"clueText\">\n        {{msg.clueText}}\n    </div>\n</div>\n\n<style>\n    #inRoom_txtClue_cards {\n        margin-top: 50px;\n        font-size: 200px !important;\n        text-align: center;\n    }\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":1050,"y":506,"wires":[[]]},{"id":"6157f88a.8dfbf8","type":"trigger","z":"ad66278e.6d8fa8","name":"","op1":"","op2":" ","op1type":"pay","op2type":"str","duration":"20","extend":false,"units":"s","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":590,"y":506,"wires":[["2cb112ca.73857e"]]},{"id":"2cb112ca.73857e","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"clueText","pt":"msg","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":790,"y":506,"wires":[["c96968a.26ee298","d6b47ef8.aae18"]]},{"id":"64c23252.e53b9c","type":"comment","z":"ad66278e.6d8fa8","name":"Display Text","info":"","x":650,"y":440,"wires":[],"icon":"node-red/parser-html.svg"},{"id":"edc22206.a61b4","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"{\"group\": {\"hide\": [\"inRoom_Timer\"],\"show\": [\"inRoom_txtClue\"], \"focus\": true}}","tot":"json"}],"action":"","property":"","from":"","to":"","reg":false,"x":420,"y":606,"wires":[["36fb20a3.aa769"]]},{"id":"36fb20a3.aa769","type":"trigger","z":"ad66278e.6d8fa8","name":"","op1":"","op2":" {\"group\": {\"hide\": [\"inRoom_txtClue\"],\"show\": [\"inRoom_Timer\"], \"focus\": true}}","op1type":"pay","op2type":"json","duration":"20","extend":false,"units":"s","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":730,"y":606,"wires":[["2a8b789.2389888","b7e26785.0a0068"]]},{"id":"16de9de1.6a5db2","type":"delay","z":"ad66278e.6d8fa8","name":"","pauseType":"delay","timeout":"5","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":400,"y":506,"wires":[["6157f88a.8dfbf8"]]},{"id":"2a8b789.2389888","type":"ui_ui_control","z":"ad66278e.6d8fa8","name":"","events":"all","x":1040,"y":606,"wires":[[]]},{"id":"8096c2f.0ede04","type":"inject","z":"ad66278e.6d8fa8","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Here's a clue! (inject)","payloadType":"str","x":190,"y":600,"wires":[["16de9de1.6a5db2","edc22206.a61b4"]]},{"id":"605230c6.55af5","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"240ed09b.e4ad9","order":0,"width":0,"height":0,"passthru":false,"label":"Here's a clue!","tooltip":"","color":"","bgcolor":"","icon":"","payload":"Here's a clue! (button)","payloadType":"str","topic":"","x":160,"y":520,"wires":[["16de9de1.6a5db2","edc22206.a61b4"]]},{"id":"b338231e.47227","type":"comment","z":"ad66278e.6d8fa8","name":"Room Controls","info":"","x":560,"y":680,"wires":[]},{"id":"98a72fc4.d05d2","type":"inject","z":"ad66278e.6d8fa8","name":"play","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":110,"y":820,"wires":[["db5dad75.117dc"]]},{"id":"f98cdfa4.2e004","type":"inject","z":"ad66278e.6d8fa8","name":"stop","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":590,"y":820,"wires":[["72ee5ea1.0b8bf"]]},{"id":"db5dad75.117dc","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"playing","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":330,"y":820,"wires":[[]]},{"id":"72ee5ea1.0b8bf","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"gameState","pt":"global","to":"stopped","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":810,"y":820,"wires":[[]]},{"id":"bce7b82a.eb56b8","type":"inject","z":"ad66278e.6d8fa8","name":"reset","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":1050,"y":820,"wires":[["b31b7cfa.72df3"]]},{"id":"b31b7cfa.72df3","type":"change","z":"ad66278e.6d8fa8","name":"","rules":[{"t":"set","p":"timeRemaining","pt":"global","to":"3600000","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":1270,"y":820,"wires":[[]]},{"id":"34348e78.5c6652","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":2,"width":0,"height":0,"passthru":false,"label":"Play","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":120,"y":740,"wires":[["db5dad75.117dc"]]},{"id":"10a7952f.ffa0db","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":3,"width":0,"height":0,"passthru":false,"label":"Stop","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":590,"y":760,"wires":[["72ee5ea1.0b8bf"]]},{"id":"ffa617b6.6a9728","type":"ui_button","z":"ad66278e.6d8fa8","name":"","group":"6d5368d4.52c8f8","order":4,"width":0,"height":0,"passthru":false,"label":"Reset","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"","x":1050,"y":760,"wires":[["b31b7cfa.72df3"]]},{"id":"b7e26785.0a0068","type":"debug","z":"ad66278e.6d8fa8","name":"ui control payload","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":1210,"y":680,"wires":[]},{"id":"d6b47ef8.aae18","type":"debug","z":"ad66278e.6d8fa8","name":"clue payload","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":1200,"y":460,"wires":[]},{"id":"bfd571d7.39a74","type":"ui_group","z":"","name":"Timer","tab":"7b633966.786a88","order":1,"disp":false,"width":"20","collapse":false},{"id":"cd9fd577.8b6588","type":"ui_group","z":"","name":"Default","tab":"7b633966.786a88","order":3,"disp":false,"width":"1","collapse":false},{"id":"6d5368d4.52c8f8","type":"ui_group","z":"","name":"Time Control","tab":"b71ff150.a0cce","order":6,"disp":true,"width":"6","collapse":false},{"id":"d24ddc84.67761","type":"ui_group","z":"","name":"txtClue","tab":"7b633966.786a88","order":2,"disp":false,"width":"20","collapse":false},{"id":"240ed09b.e4ad9","type":"ui_group","z":"","name":"Text Clues","tab":"b71ff150.a0cce","order":2,"disp":true,"width":"6","collapse":false},{"id":"7b633966.786a88","type":"ui_tab","z":"","name":"inRoom","icon":"dashboard","disabled":false,"hidden":false},{"id":"b71ff150.a0cce","type":"ui_tab","z":"","name":"Master","icon":"dashboard","disabled":false,"hidden":false}]

and here is a snap of my terminal.

Many thanks, Mr. Colin for your interest in helping me :pray:

I don't believe that all that is needed to show the problem.

One other thing I should have said. Check in the browser developer console to see if there are any errors when you click the button.