##// END OF EJS Templates
Add edit/command mode indicator.
Brian E. Granger -
Show More
@@ -534,6 +534,7 b' var IPython = (function (IPython) {'
534
534
535 Notebook.prototype.command_mode = function () {
535 Notebook.prototype.command_mode = function () {
536 if (this.mode !== 'command') {
536 if (this.mode !== 'command') {
537 $([IPython.events]).trigger('command_mode.Notebook');
537 var index = this.get_edit_index();
538 var index = this.get_edit_index();
538 var cell = this.get_cell(index);
539 var cell = this.get_cell(index);
539 if (cell) {
540 if (cell) {
@@ -546,6 +547,7 b' var IPython = (function (IPython) {'
546
547
547 Notebook.prototype.edit_mode = function () {
548 Notebook.prototype.edit_mode = function () {
548 if (this.mode !== 'edit') {
549 if (this.mode !== 'edit') {
550 $([IPython.events]).trigger('edit_mode.Notebook');
549 var cell = this.get_selected_cell();
551 var cell = this.get_selected_cell();
550 if (cell === null) {return;} // No cell is selected
552 if (cell === null) {return;} // No cell is selected
551 // We need to set the mode to edit to prevent reentering this method
553 // We need to set the mode to edit to prevent reentering this method
@@ -69,17 +69,29 b' var IPython = (function (IPython) {'
69
69
70 NotificationArea.prototype.init_notification_widgets = function() {
70 NotificationArea.prototype.init_notification_widgets = function() {
71 var knw = this.new_notification_widget('kernel');
71 var knw = this.new_notification_widget('kernel');
72 var $kernel_indic = $("#kernel_indicator");
72 var $kernel_ind_icon = $("#kernel_indicator_icon");
73 var $modal_ind_icon = $("#modal_indicator_icon");
74
75 // Command/Edit mode
76 $([IPython.events]).on('edit_mode.Notebook',function () {
77 IPython.save_widget.update_document_title();
78 $modal_ind_icon.attr('class','icon-pencil').attr('title','Edit Mode');
79 });
80
81 $([IPython.events]).on('command_mode.Notebook',function () {
82 IPython.save_widget.update_document_title();
83 $modal_ind_icon.attr('class','').attr('title','Command Mode');
84 });
73
85
74 // Kernel events
86 // Kernel events
75 $([IPython.events]).on('status_idle.Kernel',function () {
87 $([IPython.events]).on('status_idle.Kernel',function () {
76 IPython.save_widget.update_document_title();
88 IPython.save_widget.update_document_title();
77 $kernel_indic.attr('class','icon-circle-blank').attr('title','Kernel Idle');
89 $kernel_ind_icon.attr('class','icon-circle-blank').attr('title','Kernel Idle');
78 });
90 });
79
91
80 $([IPython.events]).on('status_busy.Kernel',function () {
92 $([IPython.events]).on('status_busy.Kernel',function () {
81 window.document.title='(Busy) '+window.document.title;
93 window.document.title='(Busy) '+window.document.title;
82 $kernel_indic.attr('class','icon-circle').attr('title','Kernel Busy');
94 $kernel_ind_icon.attr('class','icon-circle').attr('title','Kernel Busy');
83 });
95 });
84
96
85 $([IPython.events]).on('status_restarting.Kernel',function () {
97 $([IPython.events]).on('status_restarting.Kernel',function () {
@@ -1,3 +1,17 b''
1 #notification_area {
1 #notification_area {
2 z-index: 10;
2 z-index: 10;
3 }
3 }
4
5 .indicator_area {
6 color: @navbarLinkColor;
7 padding: 4px 3px;
8 margin: 0px;
9 width: 11px;
10 z-index: 10;
11 }
12
13 #kernel_indicator {
14 // Pull it to the right, outside the container boundary
15 margin-right: -16px;
16 }
17
@@ -1,4 +1,4 b''
1 .notification_widget{
1 .notification_widget {
2 color: @navbarLinkColor;
2 color: @navbarLinkColor;
3 padding: 1px 12px;
3 padding: 1px 12px;
4 margin: 2px 4px;
4 margin: 2px 4px;
@@ -10,13 +10,4 b''
10 &.span {
10 &.span {
11 padding-right:2px;
11 padding-right:2px;
12 }
12 }
13
14 }
15
16 #indicator_area{
17 color: @navbarLinkColor;
18 padding: 2px 2px;
19 margin: 2px -9px 2px 4px;
20 z-index: 10;
21
22 }
13 }
@@ -1502,8 +1502,9 b' p{margin-bottom:0}'
1502 i.menu-icon{padding-top:4px}
1502 i.menu-icon{padding-top:4px}
1503 ul#help_menu li a{overflow:hidden;padding-right:2.2em}ul#help_menu li a i{margin-right:-1.2em}
1503 ul#help_menu li a{overflow:hidden;padding-right:2.2em}ul#help_menu li a i{margin-right:-1.2em}
1504 #notification_area{z-index:10}
1504 #notification_area{z-index:10}
1505 .indicator_area{color:#777;padding:4px 3px;margin:0;width:11px;z-index:10}
1506 #kernel_indicator{margin-right:-16px}
1505 .notification_widget{color:#777;padding:1px 12px;margin:2px 4px;z-index:10;border:1px solid #ccc;border-radius:4px;background:rgba(240,240,240,0.5)}.notification_widget.span{padding-right:2px}
1507 .notification_widget{color:#777;padding:1px 12px;margin:2px 4px;z-index:10;border:1px solid #ccc;border-radius:4px;background:rgba(240,240,240,0.5)}.notification_widget.span{padding-right:2px}
1506 #indicator_area{color:#777;padding:2px 2px;margin:2px -9px 2px 4px;z-index:10}
1507 div#pager_splitter{height:8px}
1508 div#pager_splitter{height:8px}
1508 #pager-container{position:relative;padding:15px 0}
1509 #pager-container{position:relative;padding:15px 0}
1509 div#pager{overflow:auto;display:none}div#pager pre{font-size:13px;line-height:1.231em;color:#000;background-color:#f7f7f7;padding:.4em}
1510 div#pager{overflow:auto;display:none}div#pager pre{font-size:13px;line-height:1.231em;color:#000;background-color:#f7f7f7;padding:.4em}
@@ -251,8 +251,11 b' class="notebook_app"'
251 </ul>
251 </ul>
252 </li>
252 </li>
253 </ul>
253 </ul>
254 <div class='pull-right' id="indicator_area">
254 <div id="kernel_indicator" class="indicator_area pull-right">
255 <div id="kernel_indicator"></div>
255 <i id="kernel_indicator_icon"></i>
256 </div>
257 <div id="modal_indicator" class="indicator_area pull-right">
258 <i id="modal_indicator_icon"></i>
256 </div>
259 </div>
257 <div id="notification_area"></div>
260 <div id="notification_area"></div>
258 </div>
261 </div>
General Comments 0
You need to be logged in to leave comments. Login now