mirror/notebook
2
0
Fork 0
mirror of https://github.com/jupyter/notebook.git synced 2025-03-13 13:17:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add edit/command mode indicator.

Browse Source
This commit is contained in:
Brian E. Granger 2014-02-05 22:58:33 -08:00
parent 2b248d65b0
commit af884b797f
6 changed files with 39 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
IPython/html/static/notebook/js/notebook.js
View File

@ -534,6 +534,7 @@ var IPython = (function (IPython) {
Notebook.prototype.command_mode = function () {
if (this.mode !== 'command') {
$([IPython.events]).trigger('command_mode.Notebook');
var index = this.get_edit_index();
var cell = this.get_cell(index);
if (cell) {
@ -546,6 +547,7 @@ var IPython = (function (IPython) {
Notebook.prototype.edit_mode = function () {
if (this.mode !== 'edit') {
$([IPython.events]).trigger('edit_mode.Notebook');
var cell = this.get_selected_cell();
if (cell === null) {return;} // No cell is selected
// We need to set the mode to edit to prevent reentering this method

18
IPython/html/static/notebook/js/notificationarea.js
View File

@ -69,17 +69,29 @@ var IPython = (function (IPython) {
NotificationArea.prototype.init_notification_widgets = function() {
var knw = this.new_notification_widget('kernel');
var $kernel_indic = $("#kernel_indicator");
var $kernel_ind_icon = $("#kernel_indicator_icon");
var $modal_ind_icon = $("#modal_indicator_icon");
// Command/Edit mode
$([IPython.events]).on('edit_mode.Notebook',function () {
IPython.save_widget.update_document_title();
$modal_ind_icon.attr('class','icon-pencil').attr('title','Edit Mode');
});
$([IPython.events]).on('command_mode.Notebook',function () {
IPython.save_widget.update_document_title();
$modal_ind_icon.attr('class','').attr('title','Command Mode');
});
// Kernel events
$([IPython.events]).on('status_idle.Kernel',function () {
IPython.save_widget.update_document_title();
$kernel_indic.attr('class','icon-circle-blank').attr('title','Kernel Idle');
$kernel_ind_icon.attr('class','icon-circle-blank').attr('title','Kernel Idle');
});
$([IPython.events]).on('status_busy.Kernel',function () {
window.document.title='(Busy) '+window.document.title;
$kernel_indic.attr('class','icon-circle').attr('title','Kernel Busy');
$kernel_ind_icon.attr('class','icon-circle').attr('title','Kernel Busy');
});
$([IPython.events]).on('status_restarting.Kernel',function () {

14
IPython/html/static/notebook/less/notificationarea.less
View File

@ -1,3 +1,17 @@
#notification_area {
z-index: 10;
}
.indicator_area {
color: @navbarLinkColor;
padding: 4px 3px;
margin: 0px;
width: 11px;
z-index: 10;
}
#kernel_indicator {
// Pull it to the right, outside the container boundary
margin-right: -16px;
}

11
IPython/html/static/notebook/less/notificationwidget.less
View File

@ -1,4 +1,4 @@
.notification_widget{
.notification_widget {
color: @navbarLinkColor;
padding: 1px 12px;
margin: 2px 4px;
@ -10,13 +10,4 @@
&.span {
padding-right:2px;
}
}
#indicator_area{
color: @navbarLinkColor;
padding: 2px 2px;
margin: 2px -9px 2px 4px;
z-index: 10;
}

3
IPython/html/static/style/style.min.css vendored
View File

@ -1502,8 +1502,9 @@ p{margin-bottom:0}
i.menu-icon{padding-top:4px}
ul#help_menu li a{overflow:hidden;padding-right:2.2em}ul#help_menu li a i{margin-right:-1.2em}
#notification_area{z-index:10}
.indicator_area{color:#777;padding:4px 3px;margin:0;width:11px;z-index:10}
#kernel_indicator{margin-right:-16px}
.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}
#indicator_area{color:#777;padding:2px 2px;margin:2px -9px 2px 4px;z-index:10}
div#pager_splitter{height:8px}
#pager-container{position:relative;padding:15px 0}
div#pager{overflow:auto;display:none}div#pager pre{font-size:13px;line-height:1.231em;color:#000;background-color:#f7f7f7;padding:.4em}

7
IPython/html/templates/notebook.html
View File

@ -251,8 +251,11 @@ class="notebook_app"
</ul>
</li>
</ul>
<div class='pull-right' id="indicator_area">
<div id="kernel_indicator"></div>
<div id="kernel_indicator" class="indicator_area pull-right">
<i id="kernel_indicator_icon"></i>
</div>
<div id="modal_indicator" class="indicator_area pull-right">
<i id="modal_indicator_icon"></i>
</div>
<div id="notification_area"></div>
</div>