Fade out success message automatically

[Lin Hua Cheng]

Success messages usually confirms that requested operation succeeded, it would be nice to automatically fadeout the success message after 3 seconds to make the screen less cluttered.

[OpenStack Infra (hudson-openstack)]

Fix proposed to branch: master
Review: https://review.openstack.org/23767

[Matthias Runge (mrunge)]

I'd think, this fade out should be made configurable. In the past, I have seen people argument in both directions

[Lin Hua Cheng (lin-hua-cheng)]

What I implemented right now is still basic.

In settings.py, the delay for auto-dismiss message and the duration of the fadeout are configured.

HORIZON_CONFIG = {
    ..
    'data_dismiss_delay': 3000,
    'data_dismiss_fade_duration': 1500,
    .}

In _messages.html, define what messages you want to auto-fade by adding the attribute data-dismiss-auto="true"

<div class="alert alert-block alert-success fade in" data-dismiss-auto="true">
      <a class="close" data-dismiss="alert" href="#">&times;</a>
      <p><strong>{% trans "Success: " %}</strong>{{ message }}</p>
</div>

Another alternative configuration I could this of is:

HORIZON_CONFIG = {
    ..
    'auto_fade_message': {
     'delay': 3000,
            'fade_duration': 1500,
     'alerts' : ['success', 'info']
    },
 ..
}

The alerts takes a list of alert type where the auto-fade will be applied. By default the alerts can be an empty list to fallback to default behavior of no auto-fade.

[Kieran Spear (kspear)]

Hi Lin-Hua. I don't have any strong thoughts about how this should work, but it would be good to keep things simple. I think what you have in the review is fine, really. I don't imagine this being very controversial for people, beyond wanting it either turned on or off. Would be good to hear others' thoughts though.

[Julie Pichon (jpichon)]

I like the idea in comment #3 of defining which type of alert should disappear -- IMO, it's ok to have success and probably info message auto-fade, but I'd prefer to have error alerts stick around to make sure the user has a chance to notice and read them.

[Gabriel Hurley (gabriel-hurley)]

Also +1 on #3

[Victoria Martinez de la Cruz (vkmc)]

I also think that #3 is great. It's true that having to close the messages every time is quite bothering, but fading error messages can negatively affect the user experience. So, letting the user choose and configure this sounds good.

[Lin Hua Cheng (lin-hua-cheng)]

Awesome, thanks everyone for the feedback! :)

[OpenStack Infra (hudson-openstack)]

Reviewed: https://review.openstack.org/23767
Committed: http://github.com/openstack/horizon/commit/b87398d90b490103e11912243bb8b413c79f4ac1
Submitter: Jenkins
Branch: master

commit b87398d90b490103e11912243bb8b413c79f4ac1
Author: Lin Hua Cheng <email address hidden>
Date: Wed Mar 6 16:21:12 2013 -0800

    Implement configurable auto-fade for alerts messages.

    The configuration takes what alert types would fade, the delay before
    it fades and the fade out duration.

    Fixes bug 1144820

    Change-Id: I421ee52308613da72118a507ed8b8b574c176f68