Convert/test new Growler-style notifications.

diff --git a/imp/js/src/DimpCore.js b/imp/js/src/DimpCore.js
index cb1dac5..2de6c31 100644 (file)
--- a/imp/js/src/DimpCore.js
+++ b/imp/js/src/DimpCore.js
@@ -11,7 +11,7 @@
 /* DimpCore object. */
 var DimpCore = {
     // Vars used and defaulting to null/false:
-    //   DMenu, alertrequest, inAjaxCallback, is_init, is_logout,
+    //   DMenu, Growler, inAjaxCallback, is_init, is_logout,
     //   onDoActionComplete
     server_error: 0,
 
@@ -214,43 +214,24 @@ var DimpCore = {
             case 'imp.redirect':
             case 'dimp.request':
             case 'dimp.sticky':
-                var iefix, log, tmp,
-                    alerts = $('hordeAlerts'),
-                    div = new Element('DIV', { className: m.type.replace('.', '-') }),
+                var log, tmp,
                     msg = m.message;
 
-                if (!alerts) {
-                    alerts = new Element('DIV', { id: 'hordeAlerts' });
-                    $(document.body).insert(alerts);
+                if (!this.Growler) {
+                    this.Growler = new Growler({ location: 'br' });
                 }
 
                 if ($w('dimp.request dimp.sticky').indexOf(m.type) == -1) {
                     msg = msg.unescapeHTML().unescapeHTML();
                 }
-                alerts.insert(div.update(msg));
-
-                // IE6 has a bug that does not allow the body of a div to be
-                // clicked to trigger an onclick event for that div (it only
-                // seems to be an issue if the div is overlaying an element
-                // that itself contains an image).  However, the alert box
-                // normally displays over the message list, and we use several
-                // graphics in the default message list layout, so we see this
-                // buggy behavior 99% of the time.  The workaround is to
-                // overlay the div with a like sized div containing a clear
-                // gif, which tricks IE into the correct behavior.
-                if (DIMP.conf.is_ie6) {
-                    iefix = new Element('DIV', { id: 'hordeIE6AlertsFix' }).clonePosition(div, { setLeft: false, setTop: false });
-                    iefix.insert(div.remove());
-                    alerts.insert(iefix);
-                }
-
-                if ($w('horde.error dimp.request dimp.sticky').indexOf(m.type) == -1) {
-                    this.alertsFade.bind(this, div).delay(m.type == 'horde.warning' ? 10 : 3);
-                }
 
-                if (m.type == 'dimp.request') {
-                    this.alertrequest = div;
-                }
+                // TODO: dimp.request
+                this.Growler.growl(msg, {
+                    className: m.type.replace('.', '-'),
+                    life: (m.type == 'horde.error') ? 10 : 5,
+                    sticky: true
+//                    sticky: m.type == 'dimp.sticky'
+                });
 
                 if (tmp = $('hordeAlertslog')) {
                     switch (m.type) {
@@ -283,13 +264,6 @@ var DimpCore = {
         }, this);
     },
 
-    alertsFade: function(elt)
-    {
-        if (elt) {
-            Effect.Fade(elt, { duration: 1.5, afterFinish: this.removeAlert.bind(this) });
-        }
-    },
-
     toggleAlertsLog: function()
     {
         var alink = $('alertsloglink').down('A'),
@@ -451,11 +425,6 @@ var DimpCore = {
 
         var elt = e.element(), id, opts, tmp;
 
-        if (this.alertrequest) {
-            this.alertsFade(this.alertrequest);
-            this.alertrequest = null;
-        }
-
         while (Object.isElement(elt)) {
             id = elt.readAttribute('id');
 
@@ -483,10 +452,6 @@ var DimpCore = {
                 this.toggleAlertsLog();
                 break;
 
-            case 'hordeAlerts':
-                this.alertsFade(elt);
-                break;
-
             case 'largeaddrspan_active':
                 tmp = elt.down();
                 [ tmp.down(), tmp.down(1), tmp.next() ].invoke('toggle');

diff --git a/imp/lib/DIMP.php b/imp/lib/DIMP.php
index 7b11cd2..86340f8 100644 (file)
--- a/imp/lib/DIMP.php
+++ b/imp/lib/DIMP.php
@@ -86,6 +86,7 @@ class DIMP
             }
         }
         Horde::addScriptFile('DimpCore.js', 'imp', true);
+        Horde::addScriptFile('Growler.js', 'imp', true);
 
         // Add other scripts now
         foreach ($scripts as $val) {

diff --git a/imp/themes/screen-dimp.css b/imp/themes/screen-dimp.css
index c9a4574..f1faf10 100644 (file)
--- a/imp/themes/screen-dimp.css
+++ b/imp/themes/screen-dimp.css
@@ -804,19 +804,6 @@ a.address:hover img {
     padding-left: 4px;
 }
 
-#hordeAlerts div.dimp-sticky {
-    background-color: #ebe20c;
-    background-image: url("graphics/warning.png");
-    border-color: #807b00;
-    color: #000;
-}
-#hordeAlerts div.imp-reply {
-    background-image: url("graphics/mail_answered.png");
-}
-#hordeAlerts div.imp-forward, #hordeAlerts div.imp-redirect {
-    background-image: url("graphics/mail_forwarded.png");
-}
-
 /* Drag and drop styles. */
 .drag, .dragdrop {
     background: #eee;
@@ -1084,3 +1071,17 @@ span.readonlyImg {
     background-image: url("graphics/locked.png");
     vertical-align: sub;
 }
+
+/* Growler notification styles. */
+#Growler div.dimp-sticky {
+    background-color: #ebe20c;
+    background-image: url("graphics/warning.png");
+    border-color: #807b00;
+    color: #000;
+}
+#Growler div.imp-reply {
+    background-image: url("graphics/mail_answered.png");
+}
+#Growler div.imp-forward, div.imp-redirect {
+    background-image: url("graphics/mail_forwarded.png");
+}

diff --git a/imp/themes/silver/screen-dimp.css b/imp/themes/silver/screen-dimp.css
index 5acfe38..98dec93 100644 (file)
--- a/imp/themes/silver/screen-dimp.css
+++ b/imp/themes/silver/screen-dimp.css
@@ -1,7 +1,3 @@
-#hordeAlerts div.imp-forward, #hordeAlerts div.imp-redirect {
-    background-image: url("graphics/mail_forwarded.png");
-}
-
 #sidebarPanel .base {
     background-image: url("graphics/folder.png");
 }
@@ -32,9 +28,6 @@
 #attach_list div, span.attachmentImg {
     background-image: url("graphics/attachment.png");
 }
-#hordeAlerts div.dimp-sticky {
-    background-image: url("graphics/warning.png");
-}
 
 .header {
     border-left: 1px solid #999;
@@ -112,9 +105,6 @@ span.dimpactionDrafts {
 #ctx_message_unsetflag span.contextImg, #ctx_draft_unsetflag span.contextImg, #oa_unsetflag span.contextImg {
     background-image: url("graphics/mail_clearflag.png");
 }
-#hordeAlerts div.imp-reply {
-    background-image: url("graphics/mail_answered.png");
-}
 #ctx_draft_resume span.contextImg {
     background-image: url("graphics/mail_draft.png");
 }
@@ -181,3 +171,13 @@ span.keydownImg {
 span.readonlyImg {
     background-image: url("graphics/locked.png");
 }
+
+#Growler div.dimp-sticky {
+    background-image: url("graphics/warning.png");
+}
+#Growler div.imp-reply {
+    background-image: url("graphics/mail_answered.png");
+}
+#Growler div.imp-forward, #Growler div.imp-redirect {
+    background-image: url("graphics/mail_forwarded.png");
+}