Modal + external dimmer - suggestions?

[cheesyMan]

Hi, looking for some suggestion about it.

I've a modal that loads data from remote server. The loading process can take up to 2s so I'd like to show a loader to inform users that loading's in progress.

However, as I use a dimmer+loader set, there's an overlapping with the native modal dimmer.

I've tried to make the external dimmer(+loader) to disappear inside modal onShow() callback. But this cause a very fast moment when the external dimmer disappears and the modal dimmer is still invisible; the visual effect is like a camera flash, very ugly,

I've tried to make the external dimmer(+loader) to disappear inside modal onVisible() callback. In this case, for a a few moments the two dimmers overlap, causing the background to be much more darker.
Better than before, but still not ideal.

I'd like to have a smooth transition between the two dimmers so that I cannot visually detect the change.

Any suggestions? Thanks.

--
Alberto

[lubber-de]

Use the modals dimmer itself (instead of a separate dimmer, you can customize it via dimmerSettings) and only show that via behavior show dimmer (instead of show). Whenever your loading is done, then show the same modal via behavior show. I believe this is what you were looking at
See https://jsfiddle.net/lubber/w6qajtyo/10/

[cheesyMan]

Perfect, I always learn something new about Fomantic-UI api...

Thanks a lot :)