Touch up and doc improvement.

Also animate color so that a transition from one notification to another
will appear more smoothly.

Promoted all members of defaultOptions.* up the dot to make core more
terse.

core/src/main/java/hudson/util/FormApply.java

@@ -48,7 +48,7 @@ public class FormApply {
             public void generateResponse(StaplerRequest req, StaplerResponse rsp, Object node) throws IOException, ServletException {
                 if (isApply(req)) {
                     // if the submission is via 'apply', show a response in the notification bar
-                    applyResponse("notificationBar.show('"+Messages.HttpResponses_Saved()+"',notificationBar.defaultOptions.OK)")
+                    applyResponse("notificationBar.show('"+Messages.HttpResponses_Saved()+"',notificationBar.OK)")
                             .generateResponse(req,rsp,node);
                 } else {
                     rsp.sendRedirect(destination);

ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/NotificationBar/index.groovy

@@ -7,11 +7,16 @@ def st=namespace("jelly:stapler")
 t=namespace(JenkinsTagLib.class)
 
 namespace("/lib/samples").sample(title:_("Notification Bar")) {
-    p(_("blurb"))
+    raw(_("blurb"))
 
-    p("To show a notification bar, call <tt>notificationBar.show('message')");
+    raw("To show a notification bar, call <tt>notificationBar.show('message')</tt><")
     button(onclick:"notificationBar.show('This is a notification');", "Show a notification bar")
 
-    p(_("blurb.hide"))
+    raw(_("blurb.hide"))
     button(onclick:"notificationBar.hide();", "Hide it now")
+
+    raw(_("blurb.stock"))
+    button(onclick:"notificationBar.show('it worked!',          notificationBar.OK   );", "OK")
+    button(onclick:"notificationBar.show('something went wrong',notificationBar.WARNING);", "WARNING")
+    button(onclick:"notificationBar.show('something went wrong',notificationBar.ERROR);", "ERROR")
 }

ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/NotificationBar/index.properties

-blurb=Notification bar shows a message that disappears in a few seconds. \
+blurb=<p>Notification bar shows a message that disappears in a few seconds. \
     It is typically used to provide feedback for asynchronous operations.
 
-blurb.hide=A notification bar will auto-hide itself, but you can programmatically hide it via <tt>notificationBar.hide()</tt>
\ No newline at end of file
+blurb.hide=<p>A notification bar will auto-hide itself, but you can programmatically hide it via <tt>notificationBar.hide()</tt>
+
+blurb.stock=<p>For typical notifications, there are several pre-defined option set available as constants that you can use as <tt>notificationBar.show(msg,notificationBar.OK)</tt>
\ No newline at end of file

war/src/main/webapp/scripts/hudson-behavior.js

@@ -2611,16 +2611,18 @@ var notificationBar = {
     div : null,     // the main 'notification-bar' DIV
     token : null,   // timer for cancelling auto-close
 
-    defaultOptions : {// standard option values for typical notifications
-        OK : {
-            icon: "accept.png",
-            backgroundColor: "#8ae234"
-        },
-        ERROR : {
-            icon: "red.png",
-            backgroundColor: "#ef2929",
-            sticky: true
-        }
+    OK : {// standard option values for typical OK notification
+        icon: "accept.png",
+        backgroundColor: "#8ae234"
+    },
+    WARNING : {// likewise, for warning
+        icon: "yellow.png",
+        backgroundColor: "#fce94f"
+    },
+    ERROR : {// likewise, for error
+        icon: "red.png",
+        backgroundColor: "#ef2929",
+        sticky: true
     },
 
     init : function() {
@@ -2628,6 +2630,7 @@ var notificationBar = {
             this.div = document.createElement("div");
             YAHOO.util.Dom.setStyle(this.div,"opacity",0);
             this.div.id="notification-bar";
+            this.div.style.backgroundColor="#fff";
             document.body.insertBefore(this.div, document.body.firstChild);
 
             var self = this;
@@ -2646,8 +2649,9 @@ var notificationBar = {
     hide : function () {
         this.clearTimeout();
         var self = this;
-        var out = new YAHOO.util.Anim(this.div, {
-            opacity: { to:0 }
+        var out = new YAHOO.util.ColorAnim(this.div, {
+            opacity: { to:0 },
+            backgroundColor: {to:"#fff"}
         }, 0.3, YAHOO.util.Easing.easeIn);
         out.onComplete.subscribe(function() {
             self.div.style.display = "none";
@@ -2659,7 +2663,6 @@ var notificationBar = {
         options = options || {}
 
         this.init();
-        this.div.style.backgroundColor = options.backgroundColor || "#fff";
         this.div.style.height = this.div.style.lineHeight = options.height || "40px";
         this.div.style.display = "block";
 
@@ -2667,8 +2670,9 @@ var notificationBar = {
             text = "<img src='"+rootURL+"/images/24x24/"+options.icon+"'> "+text;
         this.div.innerHTML = text;
 
-        new YAHOO.util.Anim(this.div, {
-            opacity: { to:this.OPACITY }
+        new YAHOO.util.ColorAnim(this.div, {
+            opacity: { to:this.OPACITY },
+            backgroundColor : { to: options.backgroundColor || "#fff" }
         }, 1, YAHOO.util.Easing.easeOut).animate();
 
         this.clearTimeout();