Long running events need visual feedback

[kevindeyne]

Event handlers should be developed as async as possible. But we should make it easy to handle scenarios that take a bit of time.

Two things that comes to mind that are very common are:

• Preventing multiple clicks while waiting for visual feedback - so a disable on click
• A loader that pops up if an event takes too long (either a full page one or a top bar visual indicator)

I don't want to bundle this with CSS to define how people's loaders should look like. But the basic functionality should be present without the need for plugins or javascript, since I think it would be common enough.

Here's my suggestion

<button m-click="waitSeconds(4)" m-disable-on-click-until="$done-waiting" m-loading-style="full">A 4 seconds call</button>
[$if($done-waiting)]
<p>Call completed!</p>
[$end if]

[kevindeyne]

Added a basic loader, you can choose

m-loading-style="full" or m-loading-style="top"

with full being a complete page block, whereas top is a visual loading indicator without blocking.

I think I will need to allow for some global config on what the content of these would be.

[kevindeyne]

Seems to be a bug when you say
m-disable-on-click-until="$done-waiting"
and then return a $done-waiting which is false, it sometimes still stops waiting.

[kevindeyne]

Same problem with normal disable