# Block User Input till it is time

**URL:** <https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [7 June 2025 11:48 UTC](https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460 "2025-06-07T11:48:38Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [7 June 2025 11:48 UTC](https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460/1 "2025-06-07T11:48:38Z")

</div>

I have raised a github feature request for DB2, but this will take some more time I believe. meanwhile I would like help to somehow get this done, as I am really stuck.  
I just need a way to block user inputs (click/key press) till it is time.

`ui-spinner` was a perfect solution for me, but it is for old dashboard.

> [@Ui-group - type dialog. how to 'prevent' closing the window](https://discourse.nodered.org/t/ui-group-type-dialog-how-to-prevent-closing-the-window/95896):
>
> I am using dialog type ui-group to show a 'popup' window while some calculations are going on in the background, and i DONT want the user the 'close' the dialog until it is time. but the user has the ability to CLOSE the window by clicking on x. how do i prevent that ? in dashboard-1 i was using 'ui-spinner' ant it was working fine for me.

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [7 June 2025 11:54 UTC](https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460/2 "2025-06-07T11:54:55Z")

</div>

# I'm not too familiar with DB2, but if you could indulge me.....

In the old one, you could `disable` items if you sent a message with `msg.enable == true` or `false`.  
(ok, the `enable` may not be exact either. But I hope you understand the meaning.)  
It is documented.

So.... Looking at your question.

Have all the graphical things laid out and there.

Then, have a bit of code that - at a given time - sends an _ENABLE_ message to them.  
This will make them usable.  
Before that time a _DISABLE_ command was sent and you couldn't use any of the graphical things.

Just a thought.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [7 June 2025 13:20 UTC](https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460/3 "2025-06-07T13:20:20Z")

</div>

You know you can simply use the [overlay](https://vuetifyjs.com/en/components/overlays/#usage) and the [circular progress](https://vuetifyjs.com/en/components/progress-circular/#usage) components of vuetify in a template node right?! 😉

![explorer_DQVcdylIeJ](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/a/ea77d9af7c985ead0a1ee09b8841d7976b8736e5.gif)

```auto
[{"id":"3fed1246ce96d5be","type":"ui-template","z":"3aca33261d046b21","group":"","page":"","ui":"972a512aa841474c","name":"FlowFuse Overlay Spinner","order":0,"width":0,"height":0,"head":"","format":"<template>\n <v-overlay\n :model-value=\"isBusy\"\n class=\"align-center justify-center\"\n :scrim=\"overlayColor\"\n :opacity=\"overlayOpacity\"\n persistent\n >\n <div class=\"d-flex flex-column align-center justify-center\">\n <v-progress-circular color=\"primary\" indeterminate size=\"72\" :width=\"8\"></v-progress-circular>\n <div v-if=\"busyMessage\" class=\"mt-4 text-h6 text-center\">{{ busyMessage }}</div>\n </div>\n </v-overlay>\n</template>\n\n<script>\n // An overlay with spinner and options, by Steve-Mcl (FlowFuse inc)\n export default {\n computed: {\n payload () {\n let p = this.msg?.payload ?? {}\n if (typeof p === \"boolean\") { return {} }\n if (typeof p === \"string\") {\n p = { message: p }\n }\n return p\n },\n isBusy() {\n return this.msg?.topic === \"show\"\n },\n busyMessage() {\n if (this.isBusy && this.payload.message) {\n return this.payload.message\n }\n return ''\n },\n overlayColor() {\n const scrim = this.payload.color ?? this.payload.scrim\n if (this.isBusy && (typeof scrim === \"string\")) {\n return scrim\n }\n return 'grey darken-3'\n },\n overlayOpacity() {\n if (typeof this.payload.opacity === \"number\") {\n return Math.min(1, Math.max(0, this.payload.opacity))\n }\n return 0.6 // Default opacity if not specified\n }\n }\n }\n</script>\n<style>\n .v-overlay__content {\n flex-direction: column; /* To stack spinner and message vertically */\n }\n</style>","storeOutMessages":true,"passthru":true,"resendOnRefresh":true,"templateScope":"widget:ui","className":"","x":600,"y":140,"wires":[[]]},{"id":"0f4d4bbaab53f06e","type":"inject","z":"3aca33261d046b21","name":"just show","props":[{"p":"topic","vt":"str"},{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"show","payload":"true","payloadType":"bool","x":200,"y":140,"wires":[["3fed1246ce96d5be"]]},{"id":"57d3aa3f5b98fe2a","type":"inject","z":"3aca33261d046b21","name":"show with simple message","props":[{"p":"topic","vt":"str"},{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"show","payload":"Please wait...","payloadType":"str","x":250,"y":180,"wires":[["3fed1246ce96d5be"]]},{"id":"7d9c433d681e2028","type":"inject","z":"3aca33261d046b21","name":"hide","props":[{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"hide","x":190,"y":100,"wires":[["3fed1246ce96d5be"]]},{"id":"5397a333a026035c","type":"inject","z":"3aca33261d046b21","name":"show with messsage, opacity and color","props":[{"p":"topic","vt":"str"},{"p":"payload.message","v":"Purple, less transparent!","vt":"str"},{"p":"payload.opacity","v":"0.8","vt":"num"},{"p":"payload.color","v":"purple","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"show","x":290,"y":220,"wires":[["3fed1246ce96d5be"]]},{"id":"972a512aa841474c","type":"ui-base","name":"My Dashboard","path":"/dashboard","appIcon":"","includeClientData":true,"acceptsClientConfig":["ui-notification","ui-control"],"showPathInSidebar":false,"headerContent":"page","navigationStyle":"default","titleBarStyle":"default","showReconnectNotification":true,"notificationDisplayTime":5,"showDisconnectNotification":true,"allowInstall":false}]

```

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [21 June 2025 13:20 UTC](https://discourse.nodered.org/t/block-user-input-till-it-is-time/97460/4 "2025-06-21T13:20:53Z")

</div>

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