From d6ebf4d2b193db7ce3a3ea36468bb5c8b2f0b7ca Mon Sep 17 00:00:00 2001
From: Matthias BUSSONNIER <bussonniermatthias@gmail.com>
Date: Sun, 22 Jul 2012 04:11:53 +0200
Subject: [PATCH] beginning notification area

---
 .../html/notebook/static/css/notebook.css     | 23 ++++++++-
 .../notebook/static/js/notificationarea.js    | 48 +++++++++++++++++++
 .../notebook/static/js/notificationwidget.js  |  2 +-
 .../html/notebook/templates/notebook.html     |  5 +-
 4 files changed, 75 insertions(+), 3 deletions(-)
 create mode 100644 IPython/frontend/html/notebook/static/js/notificationarea.js

diff --git a/IPython/frontend/html/notebook/static/css/notebook.css b/IPython/frontend/html/notebook/static/css/notebook.css
index 8a49a19d5..940e1e75d 100644
--- a/IPython/frontend/html/notebook/static/css/notebook.css
+++ b/IPython/frontend/html/notebook/static/css/notebook.css
@@ -51,8 +51,17 @@ span#notebook_name {
     position: relative;
 }
 
-#notification {
+#notification_area {
     position: absolute;
+    right: 0px;
+    top: 0px;
+    height: 25px;
+    padding: 3px 6px;
+    z-index: 10;
+}
+
+.notification{
+    float : right;
     right: 3px;
     top: 3px;
     height: 25px;
@@ -60,6 +69,18 @@ span#notebook_name {
     z-index: 10;
 }
 
+.notification.info
+{color : darkblue;}
+
+.notification.safe
+{color : darkgreen;}
+
+.notification.warning
+{color : darkorange;}
+
+.notification.danger
+{ color : darkred }
+
 #toolbar {
     padding: 3px 15px;
 }
diff --git a/IPython/frontend/html/notebook/static/js/notificationarea.js b/IPython/frontend/html/notebook/static/js/notificationarea.js
new file mode 100644
index 000000000..7cd6b21b2
--- /dev/null
+++ b/IPython/frontend/html/notebook/static/js/notificationarea.js
@@ -0,0 +1,48 @@
+//----------------------------------------------------------------------------
+//  Copyright (C) 2012 The IPython Development Team
+//
+//  Distributed under the terms of the BSD License.  The full license is in
+//  the file COPYING, distributed as part of this software.
+//----------------------------------------------------------------------------
+
+//============================================================================
+// Notification widget
+//============================================================================
+
+var IPython = (function (IPython) {
+    "use strict";
+    var utils = IPython.utils;
+
+
+    var NotificationArea = function (selector) {
+        this.selector = selector;
+        if (this.selector !== undefined) {
+            this.element = $(selector);
+        }
+    };
+
+    NotificationArea.prototype.temp_message = function (msg, timeout, css_class) {
+        var uuid = utils.uuid();
+        var tdiv = $('<div>')
+            .attr('id',uuid)
+            .addClass('notification ui-widget ui-widget-content ui-corner-all')
+            .addClass('border-box-sizing')
+            .addClass(css_class)
+            .hide()
+            .text(msg);
+
+        $(this.selector).append(tdiv);
+        var tmout = Math.max(1000,timeout);
+        tdiv.fadeIn(100);
+
+        setTimeout(function () {
+                tdiv.fadeOut(100, function () {tdiv.remove();});
+            }, timeout)
+    };
+
+    IPython.NotificationArea = NotificationArea;
+
+    return IPython;
+
+}(IPython));
+
diff --git a/IPython/frontend/html/notebook/static/js/notificationwidget.js b/IPython/frontend/html/notebook/static/js/notificationwidget.js
index c580f44d3..a5ac43b48 100644
--- a/IPython/frontend/html/notebook/static/js/notificationwidget.js
+++ b/IPython/frontend/html/notebook/static/js/notificationwidget.js
@@ -27,7 +27,7 @@ var IPython = (function (IPython) {
 
 
     NotificationWidget.prototype.style = function () {
-        this.element.addClass('ui-widget ui-widget-content ui-corner-all');
+        this.element.addClass('notification ui-widget ui-widget-content ui-corner-all');
         this.element.addClass('border-box-sizing');
     };
 
diff --git a/IPython/frontend/html/notebook/templates/notebook.html b/IPython/frontend/html/notebook/templates/notebook.html
index 28c6db3f1..23ef69d04 100644
--- a/IPython/frontend/html/notebook/templates/notebook.html
+++ b/IPython/frontend/html/notebook/templates/notebook.html
@@ -152,7 +152,9 @@ data-notebook-id={{notebook_id}}
     </ul>
 
 </div>
-<div id="notification"></div>
+    <div id="notification_area">
+        <div id="notification"></div>
+    </div>
 </div>
 
 
@@ -242,6 +244,7 @@ data-notebook-id={{notebook_id}}
 <script src="{{ static_url("js/toolbar.js") }}" type="text/javascript" charset="utf-8"></script>
 <script src="{{ static_url("js/notebook.js") }}" type="text/javascript" charset="utf-8"></script>
 <script src="{{ static_url("js/notificationwidget.js") }}" type="text/javascript" charset="utf-8"></script>
+<script src="{{ static_url("js/notificationarea.js") }}" type="text/javascript" charset="utf-8"></script>
 <script src="{{ static_url("js/tooltip.js") }}" type="text/javascript" charset="utf-8"></script>
 <script src="{{ static_url("js/notebookmain.js") }}" type="text/javascript" charset="utf-8"></script>