Lift Notices and Auto Fadeout

Version 12, last updated by dcbriccetti at 2012-09-15

Message types

If you have used Lift, you very likely have run into Lift’s notices. When I say notices I’m essentially referring to all three types of notices: errors, warnings and notices. These are nothing but informative messages that the application needs to expose to the user typically as feedback to some actions . You got the point.

In Lift these notices can be associated with an element by the element’s id or not. When associating the notice with an element ID the message will be rendered as a child element of the element having the provided id. When the message is not associated with an ID, then it will be rendered in a special real estate reserved by lift .

Setting up notices, you’d typically call from your snippets:

S.notice
S.warning
S.error

.. calling the same method multiple times will cause a new message to be added to the list.

Styling

Drop the message snippet somewhere in the template:

<lift:msgs />

CSS style:

#lift__noticesContainer___notice {
    background-color: green;
}

#lift__noticesContainer___warning {
    background-color: yellow;
}

#lift__noticesContainer___error {
    background-color: red;
}

Identifying

Setting a “global” error message:

S.error

Setting a “local” error message:
In your markup put:

<lift:msg id="myError"/>

In your snippet or somewhere else:

S.error

Comet

That’s just a synopsis of Lift’s notices. What’s neat about it is that it works when rendering a page, when processing an Ajax request, or when you are in a CometActor. The only difference is that when you’re in a CometActor you just call notice_/warning_/error provided by the CometActor and not the S object.

Fade out

Now quite a few people expressed their need to fade out these notices such that they appear and then slowly disappear, dis-polluting the page. To achieve this we only set the things once. Guess where? … in the mighty Boot.

Example:

LiftRules.noticesAutoFadeOut.default.set( => Full())

We essentially set a function that takes a NoticeType.Value as an argument and return a Box[]. Yes a Tuple2 because it is too simple. We just need to specify the duration after which the fadeout will start and the actual fadeout duration. Don’t worry about TimeSpan because there are implicts in Helpers object that allow you to specify 3 seconds, 1 minute etc. Note that once you set this it is applicable for notices rendered on page rendering, for Ajax and for Comet.

A though or two about customization:

1. Because noticesAutoFadeOut is a FactoryMaker you can set this per request, per session or global as in the above example.
2. Because you are providing a function you could customize it such that base or some state information you either set some quantities or some other or simply no fadeout.

Ex. Fade out only message type “Notice” but not “Error” or “Warning”:

LiftRules.noticesAutoFadeOut.default.set(  => {
        notices match {
          case NoticeType.Notice => Full()
          case _ => Empty
        }
     }
    ) 

Enjoy, and if you have any questions you know where Lift’s mailing list is ;)


Comments are disabled for this space. In order to enable comments, Messages tool must be added to project.

You can add Messages tool from Tools section on the Admin tab.