From 1755c4acbdc156dc8bb5d633b50e8b4f04544f81 2015-02-09 19:10:51
From: Jonathan Frederic <jon.freder@gmail.com>
Date: 2015-02-09 19:10:51
Subject: [PATCH] Add readonly indicator to notification area.

---

diff --git a/IPython/html/static/notebook/js/notificationarea.js b/IPython/html/static/notebook/js/notificationarea.js
index 2307d3e..a083bf1 100644
--- a/IPython/html/static/notebook/js/notificationarea.js
+++ b/IPython/html/static/notebook/js/notificationarea.js
@@ -38,8 +38,18 @@ define([
         var knw = this.new_notification_widget('kernel');
         var $kernel_ind_icon = $("#kernel_indicator_icon");
         var $modal_ind_icon = $("#modal_indicator");
+        var $readonly_ind_icon = $('#readonly-indicator');
         var $body = $('body');
 
+        // Listen for the notebook loaded event.  Set readonly indicator.
+        this.events.on('notebook_loaded.Notebook', function() {
+            if (that.notebook.writable) {
+                $readonly_ind_icon.hide();
+            } else {
+                $readonly_ind_icon.show();
+            }
+        });
+
         // Command/Edit mode
         this.events.on('edit_mode.Notebook', function () {
             that.save_widget.update_document_title();
diff --git a/IPython/html/static/notebook/less/notificationarea.less b/IPython/html/static/notebook/less/notificationarea.less
index 599817f..0301a24 100644
--- a/IPython/html/static/notebook/less/notificationarea.less
+++ b/IPython/html/static/notebook/less/notificationarea.less
@@ -30,6 +30,16 @@
     .indicator_area();
 }
 
+#readonly-indicator {
+    .pull-right();
+    .indicator_area();
+
+    margin-top: 2px;
+    margin-bottom: 0px;
+    margin-left: 0px;
+    margin-right: 0px;
+}
+
 .modal_indicator:before {
     .fa-fw();
 }
diff --git a/IPython/html/templates/notebook.html b/IPython/html/templates/notebook.html
index 9d4cc0c..50051d9 100644
--- a/IPython/html/templates/notebook.html
+++ b/IPython/html/templates/notebook.html
@@ -62,6 +62,12 @@ data-notebook-path="{{notebook_path}}"
               <span class="kernel_indicator_name">Kernel</span>
               <i id="kernel_indicator_icon"></i>
             </p>
+            <i id="readonly-indicator" class="navbar-text">
+                <span class="fa-stack">
+                    <i class="fa fa-save fa-stack-1x"></i>
+                    <i class="fa fa-ban fa-stack-2x text-danger"></i>
+                </span>
+            </i>
             <i id="modal_indicator" class="navbar-text"></i>
             <span id="notification_area"></span>
             <div class="navbar-collapse collapse">