Refactor line num. toggle into proper function, access via C-m-l.

This makes the keybinding consistent with the rest, updated help dialog.

IPython/frontend/html/notebook/static/js/codecell.js

@@ -1,483 +1,486 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 2008-2011  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // CodeCell
 //============================================================================
 
 var IPython = (function (IPython) {
 
     var utils = IPython.utils;
 
     var CodeCell = function (notebook) {
         this.code_mirror = null;
         this.input_prompt_number = ' ';
         this.is_completing = false;
         this.completion_cursor = null;
         this.outputs = [];
         this.collapsed = false;
         IPython.Cell.apply(this, arguments);
     };
 
 
     CodeCell.prototype = new IPython.Cell();
 
 
     CodeCell.prototype.create_element = function () {
         var cell =  $('<div></div>').addClass('cell border-box-sizing code_cell vbox');
         cell.attr('tabindex','2');
         var input = $('<div></div>').addClass('input hbox');
         input.append($('<div/>').addClass('prompt input_prompt'));
         var input_area = $('<div/>').addClass('input_area box-flex1');
         this.code_mirror = CodeMirror(input_area.get(0), {
             indentUnit : 4,
             mode: 'python',
             theme: 'ipython',
             onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
         });
         input.append(input_area);
         var output = $('<div></div>').addClass('output vbox');
         cell.append(input).append(output);
         this.element = cell;
         this.collapse()
     };
 
 
     CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) {
         // This method gets called in CodeMirror's onKeyDown/onKeyPress
         // handlers and is used to provide custom key handling. Its return
         // value is used to determine if CodeMirror should ignore the event:
         // true = ignore, false = don't ignore.
         if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
             // Always ignore shift-enter in CodeMirror as we handle it.
             return true;
         } else if (event.keyCode === 9 && event.type == 'keydown') {
             // Tab completion.
             var cur = editor.getCursor();
             var pre_cursor = editor.getRange({line:cur.line,ch:0},cur).trim();
             if (pre_cursor === "") {
                 // Don't autocomplete if the part of the line before the cursor
                 // is empty.  In this case, let CodeMirror handle indentation.
                 return false;
             } else {
                 // Autocomplete the current line.
                 event.stop();
                 var line = editor.getLine(cur.line);
                 this.is_completing = true;
                 this.completion_cursor = cur;
                 IPython.notebook.complete_cell(this, line, cur.ch);
                 return true;
             }
         } else if (event.keyCode === 8 && event.type == 'keydown') {
             // If backspace and the line ends with 4 spaces, remove them.
             var cur = editor.getCursor();
             var line = editor.getLine(cur.line);
             var ending = line.slice(-4);
             if (ending === '    ') {
                 editor.replaceRange('',
                     {line: cur.line, ch: cur.ch-4},
                     {line: cur.line, ch: cur.ch}
                 );
                 event.stop();
                 return true;
             } else {
                 return false;
             };
         } else if (event.keyCode === 76 && event.ctrlKey && event.shiftKey
 		   && event.type == 'keydown') {
             // toggle line numbers with Ctrl-Shift-L
-	    if (this.code_mirror.getOption('lineNumbers') == false) {
-		this.code_mirror.setOption('lineNumbers', true);
-	    } else {
-		this.code_mirror.setOption('lineNumbers', false);
-	    }
-	    this.code_mirror.refresh()
+	    this.toggle_line_numbers()
         }
 	else {
             // keypress/keyup also trigger on TAB press, and we don't want to
             // use those to disable tab completion.
             if (this.is_completing && event.keyCode !== 9) {
                 var ed_cur = editor.getCursor();
                 var cc_cur = this.completion_cursor;
                 if (ed_cur.line !== cc_cur.line || ed_cur.ch !== cc_cur.ch) {
                     this.is_completing = false;
                     this.completion_cursor = null;
                 };
             };
             return false;
         };
     };
 
 
     CodeCell.prototype.finish_completing = function (matched_text, matches) {
         // console.log("Got matches", matched_text, matches);
         if (!this.is_completing || matches.length === 0) {return;}
 
         var that = this;
         var cur = this.completion_cursor;
 
         var insert = function (selected_text) {
             that.code_mirror.replaceRange(
                 selected_text,
                 {line: cur.line, ch: (cur.ch-matched_text.length)},
                 {line: cur.line, ch: cur.ch}
             );
         };
 
         if (matches.length === 1) {
             insert(matches[0]);
             setTimeout(function(){that.code_mirror.focus();}, 50);
             return;
         };
 
         var complete = $('<div/>').addClass('completions');
         var select = $('<select/>').attr('multiple','true');
         for (var i=0; i<matches.length; ++i) {
             select.append($('<option/>').text(matches[i]));
         }
         select.children().first().attr('selected','true');
         select.attr('size',Math.min(10,matches.length));
         var pos = this.code_mirror.cursorCoords();
         complete.css('left',pos.x+'px');
         complete.css('top',pos.yBot+'px');
         complete.append(select);
 
         $('body').append(complete);
         var done = false;
 
         var close = function () {
             if (done) return;
             done = true;
             complete.remove();
             that.is_completing = false;
             that.completion_cursor = null;
         };
 
         var pick = function () {
             insert(select.val()[0]);
             close();
             setTimeout(function(){that.code_mirror.focus();}, 50);
         };
 
         select.blur(close);
         select.keydown(function (event) {
             var code = event.which;
             if (code === 13 || code === 32) {
                 // Pressing SPACE or ENTER will cause a pick
                 event.stopPropagation();
                 event.preventDefault();
                 pick();
             } else if (code === 38 || code === 40) {
                 // We don't want the document keydown handler to handle UP/DOWN,
                 // but we want the default action.
                 event.stopPropagation();
             } else {
                 // All other key presses exit completion.
                 event.stopPropagation();
                 event.preventDefault();
                 close();
                 that.code_mirror.focus();
             }
         });
         // Double click also causes a pick.
         select.dblclick(pick);
         select.focus();
     };
 
+    CodeCell.prototype.toggle_line_numbers = function () {
+	if (this.code_mirror.getOption('lineNumbers') == false) {
+	    this.code_mirror.setOption('lineNumbers', true);
+	} else {
+	    this.code_mirror.setOption('lineNumbers', false);
+	}
+	this.code_mirror.refresh()
+    };
 
     CodeCell.prototype.select = function () {
         IPython.Cell.prototype.select.apply(this);
         // Todo: this dance is needed because as of CodeMirror 2.12, focus is
         // not causing the cursor to blink if the editor is empty initially.
         // While this seems to fix the issue, this should be fixed
         // in CodeMirror proper.
         var s = this.code_mirror.getValue();
         this.code_mirror.focus();
         if (s === '') this.code_mirror.setValue('');
     };
 
 
     CodeCell.prototype.select_all = function () {
         var start = {line: 0, ch: 0};
         var nlines = this.code_mirror.lineCount();
         var last_line = this.code_mirror.getLine(nlines-1);
         var end = {line: nlines-1, ch: last_line.length};
         this.code_mirror.setSelection(start, end);
     };
 
 
     CodeCell.prototype.append_output = function (json) {
         this.expand();
         if (json.output_type === 'pyout') {
             this.append_pyout(json);
         } else if (json.output_type === 'pyerr') {
             this.append_pyerr(json);
         } else if (json.output_type === 'display_data') {
             this.append_display_data(json);
         } else if (json.output_type === 'stream') {
             this.append_stream(json);
         };
         this.outputs.push(json);
     };
 
 
     CodeCell.prototype.create_output_area = function () {
         var oa = $("<div/>").addClass("hbox output_area");
         oa.append($('<div/>').addClass('prompt'));
         return oa;
     };
 
 
     CodeCell.prototype.append_pyout = function (json) {
         n = json.prompt_number || ' ';
         var toinsert = this.create_output_area();
         toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:');
         this.append_mime_type(json, toinsert);
         this.element.find('div.output').append(toinsert);
         // If we just output latex, typeset it.
         if (json.latex !== undefined) {
             MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
         };
     };
 
 
     CodeCell.prototype.append_pyerr = function (json) {
         var tb = json.traceback;
         if (tb !== undefined && tb.length > 0) {
             var s = '';
             var len = tb.length;
             for (var i=0; i<len; i++) {
                 s = s + tb[i] + '\n';
             }
             s = s + '\n';
             var toinsert = this.create_output_area();
             this.append_text(s, toinsert);
             this.element.find('div.output').append(toinsert);
         };
     };
 
 
     CodeCell.prototype.append_stream = function (json) {
         // temporary fix: if stream undefined (json file written prior to this patch),
         // default to most likely stdout:
         if (json.stream == undefined){
             json.stream = 'stdout';
         }
         var subclass = "output_"+json.stream;
         if (this.outputs.length > 0){
             // have at least one output to consider
             var last = this.outputs[this.outputs.length-1];
             if (last.output_type == 'stream' && json.stream == last.stream){
                 // latest output was in the same stream,
                 // so append directly into its pre tag
                 this.element.find('div.'+subclass).last().find('pre').append(json.text);
                 return;
             }
         }
         
         // If we got here, attach a new div
         var toinsert = this.create_output_area();
         this.append_text(json.text, toinsert, "output_stream "+subclass);
         this.element.find('div.output').append(toinsert);
     };
 
 
     CodeCell.prototype.append_display_data = function (json) {
         var toinsert = this.create_output_area();
         this.append_mime_type(json, toinsert)
         this.element.find('div.output').append(toinsert);
         // If we just output latex, typeset it.
         if (json.latex !== undefined) {
             MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
         };
     };
 
 
     CodeCell.prototype.append_mime_type = function (json, element) {
         if (json.html !== undefined) {
             this.append_html(json.html, element);
         } else if (json.latex !== undefined) {
             this.append_latex(json.latex, element);
         } else if (json.svg !== undefined) {
             this.append_svg(json.svg, element);
         } else if (json.png !== undefined) {
             this.append_png(json.png, element);
         } else if (json.jpeg !== undefined) {
             this.append_jpeg(json.jpeg, element);
         } else if (json.text !== undefined) {
             this.append_text(json.text, element);
         };
     };
 
 
     CodeCell.prototype.append_html = function (html, element) {
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_html rendered_html");
         toinsert.append(html);
         element.append(toinsert);
     }
 
 
     CodeCell.prototype.append_text = function (data, element, extra_class) {
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_text");
         if (extra_class){
             toinsert.addClass(extra_class);
         }
         toinsert.append($("<pre/>").html(data));
         element.append(toinsert);
     };
 
 
     CodeCell.prototype.append_svg = function (svg, element) {
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_svg");
         toinsert.append(svg);
         element.append(toinsert);
     };
 
 
     CodeCell.prototype.append_png = function (png, element) {
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_png");
         toinsert.append($("<img/>").attr('src','data:image/png;base64,'+png));
         element.append(toinsert);
     };
 
 
     CodeCell.prototype.append_jpeg = function (jpeg, element) {
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_jpeg");
         toinsert.append($("<img/>").attr('src','data:image/jpeg;base64,'+jpeg));
         element.append(toinsert);
     };
 
 
     CodeCell.prototype.append_latex = function (latex, element) {
         // This method cannot do the typesetting because the latex first has to
         // be on the page.
         var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_latex");
         toinsert.append(latex);
         element.append(toinsert);
     }
 
 
     CodeCell.prototype.clear_output = function () {
         this.element.find("div.output").html("");
         this.outputs = [];
     };
 
 
     CodeCell.prototype.clear_input = function () {
         this.code_mirror.setValue('');
     };
 
 
     CodeCell.prototype.collapse = function () {
         if (!this.collapsed) {
             this.element.find('div.output').hide();
             this.collapsed = true;
         };
     };
 
 
     CodeCell.prototype.expand = function () {
         if (this.collapsed) {
             this.element.find('div.output').show();
             this.collapsed = false;
         };
     };
 
 
     CodeCell.prototype.toggle_output = function () {
         if (this.collapsed) {
             this.expand();
         } else {
             this.collapse();
         };
     };
 
     CodeCell.prototype.set_input_prompt = function (number) {
         var n = number || ' ';
         this.input_prompt_number = n
         this.element.find('div.input_prompt').html('In&nbsp;[' + n + ']:');
     };
 
 
     CodeCell.prototype.get_code = function () {
         return this.code_mirror.getValue();
     };
 
 
     CodeCell.prototype.set_code = function (code) {
         return this.code_mirror.setValue(code);
     };
 
 
     CodeCell.prototype.at_top = function () {
         var cursor = this.code_mirror.getCursor();
         if (cursor.line === 0) {
             return true;
         } else {
             return false;
         }
     };
 
 
     CodeCell.prototype.at_bottom = function () {
         var cursor = this.code_mirror.getCursor();
         if (cursor.line === (this.code_mirror.lineCount()-1)) {
             return true;
         } else {
             return false;
         }
     };
 
 
     CodeCell.prototype.fromJSON = function (data) {
         console.log('Import from JSON:', data);
         if (data.cell_type === 'code') {
             if (data.input !== undefined) {
                 this.set_code(data.input);
             }
             if (data.prompt_number !== undefined) {
                 this.set_input_prompt(data.prompt_number);
             } else {
                 this.set_input_prompt();
             };
             var len = data.outputs.length;
             for (var i=0; i<len; i++) {
                 this.append_output(data.outputs[i]);
             };
             if (data.collapsed !== undefined) {
                 if (data.collapsed) {
                     this.collapse();
                 };
             };
         };
     };
 
 
     CodeCell.prototype.toJSON = function () {
         var data = {};
         data.input = this.get_code();
         data.cell_type = 'code';
         if (this.input_prompt_number !== ' ') {
             data.prompt_number = this.input_prompt_number
         };
         var outputs = [];
         var len = this.outputs.length;
         for (var i=0; i<len; i++) {
             outputs[i] = this.outputs[i];
         };
         data.outputs = outputs;
         data.language = 'python';
         data.collapsed = this.collapsed;
         // console.log('Export to JSON:',data);
         return data;
     };
 
 
     IPython.CodeCell = CodeCell;
 
     return IPython;
 }(IPython));

IPython/frontend/html/notebook/static/js/notebook.js

@@ -1,944 +1,954 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 2008-2011  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // Notebook
 //============================================================================
 
 var IPython = (function (IPython) {
 
     var utils = IPython.utils;
 
     var Notebook = function (selector) {
         this.element = $(selector);
         this.element.scroll();
         this.element.data("notebook", this);
         this.next_prompt_number = 1;
         this.kernel = null;
         this.dirty = false;
         this.msg_cell_map = {};
         this.metadata = {};
         this.control_key_active = false;
         this.style();
         this.create_elements();
         this.bind_events();
     };
 
 
     Notebook.prototype.style = function () {
         $('div#notebook').addClass('border-box-sizing');
     };
 
 
     Notebook.prototype.create_elements = function () {
         // We add this end_space div to the end of the notebook div to:
         // i) provide a margin between the last cell and the end of the notebook
         // ii) to prevent the div from scrolling up when the last cell is being
         // edited, but is too low on the page, which browsers will do automatically.
         var that = this;
         var end_space = $('<div class="end_space"></div>').height(150);
         end_space.dblclick(function (e) {
             var ncells = that.ncells();
             that.insert_code_cell_below(ncells-1);
         });
         this.element.append(end_space);
         $('div#notebook').addClass('border-box-sizing');
     };
 
 
     Notebook.prototype.bind_events = function () {
         var that = this;
         $(document).keydown(function (event) {
             // console.log(event);
             if (event.which === 38) {
                 var cell = that.selected_cell();
                 if (cell.at_top()) {
                     event.preventDefault();
                     that.select_prev();
                 };
             } else if (event.which === 40) {
                 var cell = that.selected_cell();
                 if (cell.at_bottom()) {
                     event.preventDefault();
                     that.select_next();
                 };
             } else if (event.which === 13 && event.shiftKey) {
                 that.execute_selected_cell();
                 return false;
             } else if (event.which === 13 && event.ctrlKey) {
                 that.execute_selected_cell({terminal:true});
                 return false;
             } else if (event.which === 77 && event.ctrlKey) {
                 that.control_key_active = true;
                 return false;
             } else if (event.which === 68 && that.control_key_active) {
                 // Delete selected cell = d
                 that.delete_cell();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 65 && that.control_key_active) {
                 // Insert code cell above selected = a
                 that.insert_code_cell_above();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 66 && that.control_key_active) {
                 // Insert code cell below selected = b
                 that.insert_code_cell_below();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 67 && that.control_key_active) {
                 // To code = c
                 that.to_code();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 77 && that.control_key_active) {
                 // To markdown = m
                 that.to_markdown();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 84 && that.control_key_active) {
                 // Toggle output = t
                 that.toggle_output();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 83 && that.control_key_active) {
                 // Save notebook = s
                 IPython.save_widget.save_notebook();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 74 && that.control_key_active) {
                 // Move cell down = j
                 that.move_cell_down();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 75 && that.control_key_active) {
                 // Move cell up = k
                 that.move_cell_up();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 80 && that.control_key_active) {
                 // Select previous = p
                 that.select_prev();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 78 && that.control_key_active) {
                 // Select next = n
                 that.select_next();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 72 && that.control_key_active) {
                 // Show keyboard shortcuts = h
                 that.show_keyboard_shortcuts();
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 73 && that.control_key_active) {
                 // Interrupt kernel = i
                 IPython.notebook.kernel.interrupt();
                 that.control_key_active = false;
                 return false;
+            } else if (event.which === 76 && that.control_key_active) {
+                // Toggle line numbers = l
+                that.cell_toggle_line_numbers();
+                that.control_key_active = false;
+                return false;
             } else if (event.which === 190 && that.control_key_active) {
                 // Restart kernel = .  # matches qt console
 		IPython.notebook.restart_kernel();
                 that.control_key_active = false;
                 return false;
             } else if (that.control_key_active) {
                 that.control_key_active = false;
                 return true;
             };
         });
 
         this.element.bind('collapse_pager', function () {
             var app_height = $('div#main_app').height(); // content height
             var splitter_height = $('div#pager_splitter').outerHeight(true);
             var new_height = app_height - splitter_height;
             that.element.animate({height : new_height + 'px'}, 'fast');
         });
 
         this.element.bind('expand_pager', function () {
             var app_height = $('div#main_app').height(); // content height
             var splitter_height = $('div#pager_splitter').outerHeight(true);
             var pager_height = $('div#pager').outerHeight(true);
             var new_height = app_height - pager_height - splitter_height; 
             that.element.animate({height : new_height + 'px'}, 'fast');
         });
 
         this.element.bind('collapse_left_panel', function () {
             var splitter_width = $('div#left_panel_splitter').outerWidth(true);
             var new_margin = splitter_width;
             $('div#notebook_panel').animate({marginLeft : new_margin + 'px'}, 'fast');
         });
 
         this.element.bind('expand_left_panel', function () {
             var splitter_width = $('div#left_panel_splitter').outerWidth(true);
             var left_panel_width = IPython.left_panel.width;
             var new_margin = splitter_width + left_panel_width;
             $('div#notebook_panel').animate({marginLeft : new_margin + 'px'}, 'fast');
         });
 
         $(window).bind('beforeunload', function () {
             var kill_kernel = $('#kill_kernel').prop('checked');                
             if (kill_kernel) {
                 that.kernel.kill();
             }
             if (that.dirty) {
                 return "You have unsaved changes that will be lost if you leave this page.";
             };
         });
     };
 
 
     Notebook.prototype.show_keyboard_shortcuts = function () {
         var dialog = $('<div/>');
         var shortcuts = [
             {key: 'Shift-Enter', help: 'run cell'},
-            {key: 'Ctrl-Enter', help: 'run cell in terminal mode'},
-	    {key: 'Ctrl-Shift-L', help: 'toggle line numbering'},
+            {key: 'Ctrl-Enter', help: 'run cell in-place'},
             {key: 'Ctrl-m d', help: 'delete cell'},
             {key: 'Ctrl-m a', help: 'insert cell above'},
             {key: 'Ctrl-m b', help: 'insert cell below'},
             {key: 'Ctrl-m t', help: 'toggle output'},
+            {key: 'Ctrl-m l', help: 'toggle line numbers'},
             {key: 'Ctrl-m s', help: 'save notebook'},
             {key: 'Ctrl-m j', help: 'move cell down'},
             {key: 'Ctrl-m k', help: 'move cell up'},
             {key: 'Ctrl-m c', help: 'code cell'},
             {key: 'Ctrl-m m', help: 'markdown cell'},
             {key: 'Ctrl-m p', help: 'select previous'},
             {key: 'Ctrl-m n', help: 'select next'},
 	    {key: 'Ctrl-m i', help: 'interrupt kernel'},
 	    {key: 'Ctrl-m .', help: 'restart kernel'},
-            {key: 'Ctrl-m h', help: 'display keyboard shortcuts'}
+            {key: 'Ctrl-m h', help: 'show keyboard shortcuts'}
         ];
         for (var i=0; i<shortcuts.length; i++) {
             dialog.append($('<div>').
                 append($('<span/>').addClass('shortcut_key').html(shortcuts[i].key)).
                 append($('<span/>').addClass('shortcut_descr').html(' : ' + shortcuts[i].help))
             );
         };
         dialog.dialog({title: 'Keyboard shortcuts'});
     };
 
 
     Notebook.prototype.scroll_to_bottom = function () {
         this.element.animate({scrollTop:this.element.get(0).scrollHeight}, 0);
     };
 
 
     Notebook.prototype.scroll_to_top = function () {
         this.element.animate({scrollTop:0}, 0);
     };
 
 
     // Cell indexing, retrieval, etc.
 
 
     Notebook.prototype.cell_elements = function () {
         return this.element.children("div.cell");
     }
 
 
     Notebook.prototype.ncells = function (cell) {
         return this.cell_elements().length;
     }
 
 
     // TODO: we are often calling cells as cells()[i], which we should optimize
     // to cells(i) or a new method.
     Notebook.prototype.cells = function () {
         return this.cell_elements().toArray().map(function (e) {
             return $(e).data("cell");
         });
     }
 
 
     Notebook.prototype.find_cell_index = function (cell) {
         var result = null;
         this.cell_elements().filter(function (index) {
             if ($(this).data("cell") === cell) {
                 result = index;
             };
         });
         return result;
     };
 
 
     Notebook.prototype.index_or_selected = function (index) {
         return index || this.selected_index() || 0;
     }
 
 
     Notebook.prototype.select = function (index) {
         if (index !== undefined && index >= 0 && index < this.ncells()) {
             if (this.selected_index() !== null) {
                 this.selected_cell().unselect();
             };
             this.cells()[index].select();
         };
         return this;
     };
 
 
     Notebook.prototype.select_next = function () {
         var index = this.selected_index();
         if (index !== null && index >= 0 && (index+1) < this.ncells()) {
             this.select(index+1);
         };
         return this;
     };
 
 
     Notebook.prototype.select_prev = function () {
         var index = this.selected_index();
         if (index !== null && index >= 0 && (index-1) < this.ncells()) {
             this.select(index-1);
         };
         return this;
     };
 
 
     Notebook.prototype.selected_index = function () {
         var result = null;
         this.cell_elements().filter(function (index) {
             if ($(this).data("cell").selected === true) {
                 result = index;
             };
         });
         return result;
     };
 
 
     Notebook.prototype.cell_for_msg = function (msg_id) {
         var cell_id = this.msg_cell_map[msg_id];
         var result = null;
         this.cell_elements().filter(function (index) {
             cell = $(this).data("cell");
             if (cell.cell_id === cell_id) {
                 result = cell;
             };
         });
         return result;
     };
 
 
     Notebook.prototype.selected_cell = function () {
         return this.cell_elements().eq(this.selected_index()).data("cell");
     }
 
 
     // Cell insertion, deletion and moving.
 
 
     Notebook.prototype.delete_cell = function (index) {
         var i = index || this.selected_index();
         if (i !== null && i >= 0 && i < this.ncells()) {
             this.cell_elements().eq(i).remove();
             if (i === (this.ncells())) {
                 this.select(i-1);
             } else {
                 this.select(i);
             };
         };
         this.dirty = true;
         return this;
     };
 
 
     Notebook.prototype.append_cell = function (cell) {
         this.element.find('div.end_space').before(cell.element);
         this.dirty = true;
         return this;
     };
 
 
     Notebook.prototype.insert_cell_below = function (cell, index) {
         var ncells = this.ncells();
         if (ncells === 0) {
             this.append_cell(cell);
             return this;
         };
         if (index >= 0 && index < ncells) {
             this.cell_elements().eq(index).after(cell.element);
         };
         this.dirty = true;
         return this
     };
 
 
     Notebook.prototype.insert_cell_above = function (cell, index) {
         var ncells = this.ncells();
         if (ncells === 0) {
             this.append_cell(cell);
             return this;
         };
         if (index >= 0 && index < ncells) {
             this.cell_elements().eq(index).before(cell.element);
         };
         this.dirty = true;
         return this;
     };
 
 
     Notebook.prototype.move_cell_up = function (index) {
         var i = index || this.selected_index();
         if (i !== null && i < this.ncells() && i > 0) {
             var pivot = this.cell_elements().eq(i-1);
             var tomove = this.cell_elements().eq(i);
             if (pivot !== null && tomove !== null) {
                 tomove.detach();
                 pivot.before(tomove);
                 this.select(i-1);
             };
         };
         this.dirty = true;
         return this;
     }
 
 
     Notebook.prototype.move_cell_down = function (index) {
         var i = index || this.selected_index();
         if (i !== null && i < (this.ncells()-1) && i >= 0) {
             var pivot = this.cell_elements().eq(i+1)
             var tomove = this.cell_elements().eq(i)
             if (pivot !== null && tomove !== null) {
                 tomove.detach();
                 pivot.after(tomove);
                 this.select(i+1);
             };
         };
         this.dirty = true;
         return this;
     }
 
 
     Notebook.prototype.sort_cells = function () {
         var ncells = this.ncells();
         var sindex = this.selected_index();
         var swapped;
         do {
             swapped = false
             for (var i=1; i<ncells; i++) {
                 current = this.cell_elements().eq(i).data("cell");
                 previous = this.cell_elements().eq(i-1).data("cell");
                 if (previous.input_prompt_number > current.input_prompt_number) {
                     this.move_cell_up(i);
                     swapped = true;
                 };
             };
         } while (swapped);
         this.select(sindex);
         return this;
     };
 
 
     Notebook.prototype.insert_code_cell_above = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.CodeCell(this);
         cell.set_input_prompt();
         this.insert_cell_above(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.insert_code_cell_below = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.CodeCell(this);
         cell.set_input_prompt();
         this.insert_cell_below(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.insert_html_cell_above = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.HTMLCell(this);
         cell.config_mathjax();
         this.insert_cell_above(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.insert_html_cell_below = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.HTMLCell(this);
         cell.config_mathjax();
         this.insert_cell_below(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.insert_markdown_cell_above = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.MarkdownCell(this);
         cell.config_mathjax();
         this.insert_cell_above(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.insert_markdown_cell_below = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var cell = new IPython.MarkdownCell(this);
         cell.config_mathjax();
         this.insert_cell_below(cell, i);
         this.select(this.find_cell_index(cell));
         return cell;
     }
 
 
     Notebook.prototype.to_code = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var source_element = this.cell_elements().eq(i);
         var source_cell = source_element.data("cell");
         if (source_cell instanceof IPython.HTMLCell || 
             source_cell instanceof IPython.MarkdownCell) {
             this.insert_code_cell_below(i);
             var target_cell = this.cells()[i+1];
             target_cell.set_code(source_cell.get_source());
             source_element.remove();
             target_cell.select();
         };
         this.dirty = true;
     };
 
 
     Notebook.prototype.to_markdown = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var source_element = this.cell_elements().eq(i);
         var source_cell = source_element.data("cell");
         var target_cell = null;
         if (source_cell instanceof IPython.CodeCell) {
             this.insert_markdown_cell_below(i);
             var target_cell = this.cells()[i+1];
             var text = source_cell.get_code();
         } else if (source_cell instanceof IPython.HTMLCell) {
             this.insert_markdown_cell_below(i);
             var target_cell = this.cells()[i+1];
             var text = source_cell.get_source();
             if (text === source_cell.placeholder) {
                 text = target_cell.placeholder;
             }
         }
         if (target_cell !== null) {
             if (text === "") {text = target_cell.placeholder;};
             target_cell.set_source(text);
             source_element.remove();
             target_cell.edit();
         }
         this.dirty = true;
     };
 
 
     Notebook.prototype.to_html = function (index) {
         // TODO: Bounds check for i
         var i = this.index_or_selected(index);
         var source_element = this.cell_elements().eq(i);
         var source_cell = source_element.data("cell");
         var target_cell = null;
         if (source_cell instanceof IPython.CodeCell) {
             this.insert_html_cell_below(i);
             var target_cell = this.cells()[i+1];
             var text = source_cell.get_code();
         } else if (source_cell instanceof IPython.MarkdownCell) {
             this.insert_html_cell_below(i);
             var target_cell = this.cells()[i+1];
             var text = source_cell.get_source();
             if (text === source_cell.placeholder) {
                 text = target_cell.placeholder;
             }
         }
         if (target_cell !== null) {
             if (text === "") {text = target_cell.placeholder;};
             target_cell.set_source(text);
             source_element.remove();
             target_cell.edit();
         }
         this.dirty = true;
     };
 
 
     // Cell collapsing and output clearing
 
     Notebook.prototype.collapse = function (index) {
         var i = this.index_or_selected(index);
         this.cells()[i].collapse();
         this.dirty = true;
     };
 
 
     Notebook.prototype.expand = function (index) {
         var i = this.index_or_selected(index);
         this.cells()[i].expand();
         this.dirty = true;
     };
 
 
     Notebook.prototype.toggle_output = function (index) {
         var i = this.index_or_selected(index);
         this.cells()[i].toggle_output();
         this.dirty = true;
     };
 
 
     Notebook.prototype.set_autoindent = function (state) {
         var cells = this.cells();
         len = cells.length;
         for (var i=0; i<len; i++) {
             cells[i].set_autoindent(state)
         };
     };
 
 
     Notebook.prototype.clear_all_output = function () {
         var ncells = this.ncells();
         var cells = this.cells();
         for (var i=0; i<ncells; i++) {
             if (cells[i] instanceof IPython.CodeCell) {
                 cells[i].clear_output();
             }
         };
         this.dirty = true;
     };
 
+    // Other cell functions: line numbers, ...
+
+    Notebook.prototype.cell_toggle_line_numbers = function() {
+	this.selected_cell().toggle_line_numbers()
+    };
 
     // Kernel related things
 
     Notebook.prototype.start_kernel = function () {
         this.kernel = new IPython.Kernel();
         var notebook_id = IPython.save_widget.get_notebook_id();
         this.kernel.start(notebook_id, $.proxy(this.kernel_started, this));
     };
 
 
     Notebook.prototype.restart_kernel = function () {
         var notebook_id = IPython.save_widget.get_notebook_id();
         this.kernel.restart($.proxy(this.kernel_started, this));
     };
 
 
     Notebook.prototype.kernel_started = function () {
         console.log("Kernel started: ", this.kernel.kernel_id);
         this.kernel.shell_channel.onmessage = $.proxy(this.handle_shell_reply,this);
         this.kernel.iopub_channel.onmessage = $.proxy(this.handle_iopub_reply,this);
     };
 
 
     Notebook.prototype.handle_shell_reply = function (e) {
         reply = $.parseJSON(e.data);
         var header = reply.header;
         var content = reply.content;
         var msg_type = header.msg_type;
         // console.log(reply);
         var cell = this.cell_for_msg(reply.parent_header.msg_id);
         if (msg_type === "execute_reply") {
             cell.set_input_prompt(content.execution_count);
             this.dirty = true;
         } else if (msg_type === "complete_reply") {
             cell.finish_completing(content.matched_text, content.matches);
         };
         var payload = content.payload || [];
         this.handle_payload(cell, payload);
     };
 
 
     Notebook.prototype.handle_payload = function (cell, payload) {
         var l = payload.length;
         for (var i=0; i<l; i++) {
             if (payload[i].source === 'IPython.zmq.page.page') {
                 if (payload[i].text.trim() !== '') {
                     IPython.pager.clear();
                     IPython.pager.expand();
                     IPython.pager.append_text(payload[i].text);
                 }
             } else if (payload[i].source === 'IPython.zmq.zmqshell.ZMQInteractiveShell.set_next_input') {
                 var index = this.find_cell_index(cell);
                 var new_cell = this.insert_code_cell_below(index);
                 new_cell.set_code(payload[i].text);
                 this.dirty = true;
             }
         };
     };
 
 
     Notebook.prototype.handle_iopub_reply = function (e) {
         reply = $.parseJSON(e.data);
         var content = reply.content;
         // console.log(reply);
         var msg_type = reply.header.msg_type;
         var cell = this.cell_for_msg(reply.parent_header.msg_id);
         var output_types = ['stream','display_data','pyout','pyerr'];
         if (output_types.indexOf(msg_type) >= 0) {
             this.handle_output(cell, msg_type, content);
         } else if (msg_type === 'status') {
             if (content.execution_state === 'busy') {
                 IPython.kernel_status_widget.status_busy();
             } else if (content.execution_state === 'idle') {
                 IPython.kernel_status_widget.status_idle();
             } else if (content.execution_state === 'dead') {
                 this.handle_status_dead();
             };
         }
     };
 
 
     Notebook.prototype.handle_status_dead = function () {
         var that = this;
         this.kernel.stop_channels();
         var dialog = $('<div/>');
         dialog.html('The kernel has died, would you like to restart it? If you do not restart the kernel, you will be able to save the notebook, but running code will not work until the notebook is reopened.');
         $(document).append(dialog);
         dialog.dialog({
             resizable: false,
             modal: true,
             title: "Dead kernel",
             buttons : {
                 "Yes": function () {
                     that.start_kernel();
                     $(this).dialog('close');
                 },
                 "No": function () {
                     $(this).dialog('close');
                 }
             }
         });
     };
 
 
     Notebook.prototype.handle_output = function (cell, msg_type, content) {
         var json = {};
         json.output_type = msg_type;
         if (msg_type === "stream") {
             json.text = utils.fixConsole(content.data);
             json.stream = content.name;
         } else if (msg_type === "display_data") {
             json = this.convert_mime_types(json, content.data);
         } else if (msg_type === "pyout") {
             json.prompt_number = content.execution_count;
             json = this.convert_mime_types(json, content.data);
         } else if (msg_type === "pyerr") {
             json.ename = content.ename;
             json.evalue = content.evalue;
             var traceback = [];
             for (var i=0; i<content.traceback.length; i++) {
                 traceback.push(utils.fixConsole(content.traceback[i]));
             }
             json.traceback = traceback;
         };
         cell.append_output(json);
         this.dirty = true;
     };
 
 
     Notebook.prototype.convert_mime_types = function (json, data) {
         if (data['text/plain'] !== undefined) {
             json.text = utils.fixConsole(data['text/plain']);
         };
         if (data['text/html'] !== undefined) {
             json.html = data['text/html'];
         };
         if (data['image/svg+xml'] !== undefined) {
             json.svg = data['image/svg+xml'];
         };
         if (data['image/png'] !== undefined) {
             json.png = data['image/png'];
         };
         if (data['image/jpeg'] !== undefined) {
             json.jpeg = data['image/jpeg'];
         };
         if (data['text/latex'] !== undefined) {
             json.latex = data['text/latex'];
         };
         if (data['application/json'] !== undefined) {
             json.json = data['application/json'];
         };
         if (data['application/javascript'] !== undefined) {
             json.javascript = data['application/javascript'];
         }
         return json;    
     };
 
 
     Notebook.prototype.execute_selected_cell = function (options) {
         // add_new: should a new cell be added if we are at the end of the nb
         // terminal: execute in terminal mode, which stays in the current cell
         default_options = {terminal: false, add_new: true}
         $.extend(default_options, options)
         var that = this;
         var cell = that.selected_cell();
         var cell_index = that.find_cell_index(cell);
         if (cell instanceof IPython.CodeCell) {
             cell.clear_output();
             var code = cell.get_code();
             var msg_id = that.kernel.execute(cell.get_code());
             that.msg_cell_map[msg_id] = cell.cell_id;
         } else if (cell instanceof IPython.HTMLCell) {
             cell.render();
         }
         if (default_options.terminal) {
             cell.select_all();
         } else {
             if ((cell_index === (that.ncells()-1)) && default_options.add_new) {
                 that.insert_code_cell_below();
                 // If we are adding a new cell at the end, scroll down to show it.
                 that.scroll_to_bottom();
             } else {
                 that.select(cell_index+1);
             };
         };
         this.dirty = true;
     };
 
 
     Notebook.prototype.execute_all_cells = function () {
         var ncells = this.ncells();
         for (var i=0; i<ncells; i++) {
             this.select(i);
             this.execute_selected_cell({add_new:false});
         };
         this.scroll_to_bottom();
     };
 
 
     Notebook.prototype.complete_cell = function (cell, line, cursor_pos) {
         var msg_id = this.kernel.complete(line, cursor_pos);
         this.msg_cell_map[msg_id] = cell.cell_id;
     };
 
     // Persistance and loading
 
 
     Notebook.prototype.fromJSON = function (data) {
         var ncells = this.ncells();
         for (var i=0; i<ncells; i++) {
             // Always delete cell 0 as they get renumbered as they are deleted.
             this.delete_cell(0);
         };
         // Save the metadata
         this.metadata = data.metadata;
         // Only handle 1 worksheet for now.
         var worksheet = data.worksheets[0];
         if (worksheet !== undefined) {
             var new_cells = worksheet.cells;
             ncells = new_cells.length;
             var cell_data = null;
             var new_cell = null;
             for (var i=0; i<ncells; i++) {
                 cell_data = new_cells[i];
                 if (cell_data.cell_type == 'code') {
                     new_cell = this.insert_code_cell_below();
                     new_cell.fromJSON(cell_data);
                 } else if (cell_data.cell_type === 'html') {
                     new_cell = this.insert_html_cell_below();
                     new_cell.fromJSON(cell_data);
                 } else if (cell_data.cell_type === 'markdown') {
                     new_cell = this.insert_markdown_cell_below();
                     new_cell.fromJSON(cell_data);
                 };
             };          
         };
     };
 
 
     Notebook.prototype.toJSON = function () {
         var cells = this.cells();
         var ncells = cells.length;
         cell_array = new Array(ncells);
         for (var i=0; i<ncells; i++) {
             cell_array[i] = cells[i].toJSON();
         };
         data = {
             // Only handle 1 worksheet for now.
             worksheets : [{cells:cell_array}],
             metadata : this.metadata
         }
         return data
     };
 
     Notebook.prototype.save_notebook = function () {
         if (IPython.save_widget.test_notebook_name()) {
             var notebook_id = IPython.save_widget.get_notebook_id();
             var nbname = IPython.save_widget.get_notebook_name();
             // We may want to move the name/id/nbformat logic inside toJSON?
             var data = this.toJSON();
             data.metadata.name = nbname;
             data.nbformat = 2;
             // We do the call with settings so we can set cache to false.
             var settings = {
                 processData : false,
                 cache : false,
                 type : "PUT",
                 data : JSON.stringify(data),
                 headers : {'Content-Type': 'application/json'},
                 success : $.proxy(this.notebook_saved,this)
             };
             IPython.save_widget.status_saving();
             $.ajax("/notebooks/" + notebook_id, settings);
         };
     };
 
 
     Notebook.prototype.notebook_saved = function (data, status, xhr) {
         this.dirty = false;
         setTimeout($.proxy(IPython.save_widget.status_save,IPython.save_widget),500);
     }
 
 
     Notebook.prototype.load_notebook = function (callback) {
         var that = this;
         var notebook_id = IPython.save_widget.get_notebook_id();
         // We do the call with settings so we can set cache to false.
         var settings = {
             processData : false,
             cache : false,
             type : "GET",
             dataType : "json",
             success : function (data, status, xhr) {
                 that.notebook_loaded(data, status, xhr);
                 if (callback !== undefined) {
                     callback();
                 };
             }
         };
         IPython.save_widget.status_loading();
         $.ajax("/notebooks/" + notebook_id, settings);
     }
 
 
     Notebook.prototype.notebook_loaded = function (data, status, xhr) {
         this.fromJSON(data);
         if (this.ncells() === 0) {
             this.insert_code_cell_below();
         };
         IPython.save_widget.status_save();
         IPython.save_widget.set_notebook_name(data.metadata.name);
         this.start_kernel();
         this.dirty = false;
         // fromJSON always selects the last cell inserted. We need to wait
         // until that is done before scrolling to the top.
         setTimeout(function () {
             IPython.notebook.select(0);
             IPython.notebook.scroll_to_top();
         }, 50);
     };
 
     IPython.Notebook = Notebook;
 
     return IPython;
 
 }(IPython));
 

IPython/frontend/html/notebook/templates/notebook.html

@@ -1,278 +1,278 b''
 <!DOCTYPE HTML>
 <html>
 
 <head>
     <meta charset="utf-8">
 
     <title>IPython Notebook</title>
 
     <link rel="stylesheet" href="static/jquery/css/themes/aristo/jquery-wijmo.css" type="text/css" />
 <!--     <link rel="stylesheet" href="static/jquery/css/themes/rocket/jquery-wijmo.css" type="text/css" /> -->
 <!--    <link rel="stylesheet" href="static/jquery/css/themes/smoothness/jquery-ui-1.8.14.custom.css" type="text/css" />-->
 
     <!-- <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML" charset="utf-8"></script> -->
     <script type='text/javascript' src='static/mathjax/MathJax.js?config=TeX-AMS_HTML' charset='utf-8'></script>
     <script type="text/javascript">
     function CheckMathJax(){
         var div=document.getElementById("MathJaxFetchingWarning")
         if(window.MathJax){
             document.body.removeChild(div)
         }
         else{
            div.style.display = "block";
         }
     }
     if (typeof MathJax == 'undefined') {
         console.log("No local MathJax, loading from CDN");
         document.write(unescape("%3Cscript type='text/javascript' src='http://cdn.mathjax.org/mathjax/latest/MathJax.js%3Fconfig=TeX-AMS_HTML' charset='utf-8'%3E%3C/script%3E"));
     }else{
         console.log("Using local MathJax");
     }
     </script>
 
     <link rel="stylesheet" href="static/codemirror/lib/codemirror.css">
     <link rel="stylesheet" href="static/codemirror/mode/markdown/markdown.css">
     <link rel="stylesheet" href="static/codemirror/mode/rst/rst.css">
     <link rel="stylesheet" href="static/codemirror/theme/ipython.css">
     <link rel="stylesheet" href="static/codemirror/theme/default.css">
 
     <link rel="stylesheet" href="static/prettify/prettify.css"/>
 
     <link rel="stylesheet" href="static/css/boilerplate.css" type="text/css" />
     <link rel="stylesheet" href="static/css/layout.css" type="text/css" />
     <link rel="stylesheet" href="static/css/base.css" type="text/css" />
     <link rel="stylesheet" href="static/css/notebook.css" type="text/css" />
     <link rel="stylesheet" href="static/css/renderedhtml.css" type="text/css" />
 
 
 </head>
 
 <body onload='CheckMathJax();'>
 
 <div id="header">
     <span id="ipython_notebook"><h1>IPython Notebook</h1></span>
     <span id="save_widget">
         <input type="text" id="notebook_name" size="20"></textarea>
         <span id="notebook_id" style="display:none">{{notebook_id}}</span>
         <button id="save_notebook"><u>S</u>ave</button>
     </span>
     <span id="kernel_status">Idle</span>
 </div>
 
 <div id="MathJaxFetchingWarning"
       style="width:80%; margin:auto;padding-top:20%;text-align: justify; display:none">
       <p style="font-size:26px;">There was an issue trying to fetch MathJax.js
 	from the internet.</p>
 
       <p style="padding:0.2em"> With a working internet connection, you can run
     the following at a Python or IPython prompt, which will install a local
     copy of MathJax:</p>
       
         <pre style="background-color:lightblue;border:thin silver solid;padding:0.4em">
             from IPython.external import mathjax; mathjax.install_mathjax()
         </pre>
         This will try to install MathJax into the directory where you installed
         IPython. If you installed IPython to a location that requires
         administrative privileges to write, you will need to make this call as
         an administrator. On OSX/Linux/Unix, this can be done at the
         command-line via:
         <pre style="background-color:lightblue;border:thin silver solid;padding:0.4em">
             sudo python -c "from IPython.external import mathjax; mathjax.install_mathjax()"
         </pre>
     </p>
 </div>
 
 <div id="main_app">
 
     <div id="left_panel">
 
         <div id="notebook_section">
             <h3 class="section_header">Notebook</h3>
             <div class="section_content">
                 <div class="section_row">
                     <span id="new_open" class="section_row_buttons">
                         <button id="new_notebook">New</button>
                         <button id="open_notebook">Open</button>
                     </span>
                     <span class="section_row_header">Actions</span>
                 </div>
                 <div class="section_row">
                     <span>
                         <select id="download_format">
                             <option value="json">ipynb</option>
                             <option value="py">py</option>
                         </select>
                     </span>
                     <span class="section_row_buttons">
                         <button id="download_notebook">Download</button>
                     </span>
                 </div>
                 <div class="section_row">
                     <span class="section_row_buttons">
                         <span id="print_widget">
                             <button id="print_notebook">Print</button>
                         </span>
                     </span>
                 </div>
             </div>
         </div>
 
         <div id="cell_section">
             <h3 class="section_header">Cell</h3>
             <div class="section_content">
                 <div class="section_row">
                     <span class="section_row_buttons">
                         <button id="delete_cell"><u>D</u>elete</button>
                     </span>
                     <span class="section_row_header">Actions</span>
                 </div>
                 <div class="section_row">
                     <span id="cell_type" class="section_row_buttons">
                         <button id="to_code"><u>C</u>ode</button>
 <!--                        <button id="to_html">HTML</button>-->
                         <button id="to_markdown"><u>M</u>arkdown</button>
                     </span>
                      <span class="button_label">Format</span> 
                 </div>
                 <div class="section_row">
                     <span id="cell_output" class="section_row_buttons">
                         <button id="toggle_output"><u>T</u>oggle</button>
                         <button id="clear_all_output">ClearAll</button>
                     </span>
                     <span class="button_label">Output</span>
                 </div>
                 <div class="section_row">
                     <span id="insert" class="section_row_buttons">
                         <button id="insert_cell_above"><u>A</u>bove</button>
                         <button id="insert_cell_below"><u>B</u>elow</button>
                     </span>
                     <span class="button_label">Insert</span>
                 </div>
                 <div class="section_row">
                     <span id="move" class="section_row_buttons">
                         <button id="move_cell_up">Up</button>
                         <button id="move_cell_down">Down</button>
                     </span>
                     <span class="button_label">Move</span>
                 </div>
                 <div class="section_row">
                     <span id="run_cells" class="section_row_buttons">
                         <button id="run_selected_cell">Selected</button>
                         <button id="run_all_cells">All</button>
                     </span>
                     <span class="button_label">Run</span>
                 </div>
                 <div class="section_row">
                     <span id="autoindent_span">
                         <input type="checkbox" id="autoindent" checked="true"></input>
                     </span>
                     <span class="checkbox_label">Autoindent:</span>
                 </div>
             </div>
         </div>
 
         <div id="kernel_section">
             <h3 class="section_header">Kernel</h3>
             <div class="section_content">
                 <div class="section_row">
                     <span id="int_restart" class="section_row_buttons">
-                        <button id="int_kernel">Interrupt</button>
+                        <button id="int_kernel"><u>I</u>nterrupt</button>
                         <button id="restart_kernel">Restart</button>
                     </span>
                     <span class="section_row_header">Actions</span>
                 </div>
                 <div class="section_row">
                     <span id="kernel_persist">
                         <input type="checkbox" id="kill_kernel"></input>
                     </span>
                     <span class="checkbox_label">Kill kernel upon exit:</span>
                 </div>
             </div>
         </div>
 
         <div id="help_section">
             <h3 class="section_header">Help</h3>
             <div class="section_content">
                 <div class="section_row">
                     <span id="help_buttons0" class="section_row_buttons">
                         <a id="python_help" href="http://docs.python.org" target="_blank">Python</a>
                         <a id="ipython_help" href="http://ipython.org/documentation.html" target="_blank">IPython</a>
                     </span>
                     <span class="section_row_header">Links</span>
                 </div>
                 <div class="section_row">
                     <span id="help_buttons1" class="section_row_buttons">
                         <a id="numpy_help" href="http://docs.scipy.org/doc/numpy/reference/" target="_blank">NumPy</a>
                         <a id="scipy_help" href="http://docs.scipy.org/doc/scipy/reference/" target="_blank">SciPy</a>
                     </span>
                 </div>
                 <div class="section_row">
                     <span id="help_buttons2" class="section_row_buttons">
                         <a id="matplotlib_help" href="http://matplotlib.sourceforge.net/" target="_blank">MPL</a>
                         <a id="sympy_help" href="http://docs.sympy.org/dev/index.html" target="_blank">SymPy</a>
                     </span>
                 </div>
                 <div class="section_row">
                     <span class="help_string">run selected cell</span>
                     <span class="help_string_label">Shift-Enter :</span>
                 </div>
                 <div class="section_row">
-                    <span class="help_string">run in terminal mode</span>
+                    <span class="help_string">run selected cell in-place</span>
                     <span class="help_string_label">Ctrl-Enter  :</span>
                 </div>
                 <div class="section_row">
                     <span class="help_string">show keyboard shortcuts</span>
                     <span class="help_string_label">Ctrl-m h  :</span>
                 </div>
             </div>
         </div>
 
     </div>
     <div id="left_panel_splitter"></div>
     <div id="notebook_panel">
         <div id="notebook"></div>
         <div id="pager_splitter"></div>
         <div id="pager"></div>
     </div>
 
 </div>
 
 <script src="static/jquery/js/jquery-1.6.2.min.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/jquery/js/jquery-ui-1.8.14.custom.min.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/jquery/js/jquery.autogrow.js" type="text/javascript" charset="utf-8"></script>
 
 <script src="static/codemirror/lib/codemirror.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/python/python.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/htmlmixed/htmlmixed.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/xml/xml.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/javascript/javascript.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/css/css.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/rst/rst.js" charset="utf-8"></script>
 <script src="static/codemirror/mode/markdown/markdown.js" charset="utf-8"></script>
 
 <script src="static/pagedown/Markdown.Converter.js" charset="utf-8"></script>
 
 <script src="static/prettify/prettify.js" charset="utf-8"></script>
 
 <script src="static/js/namespace.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/utils.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/cell.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/codecell.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/textcell.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/kernel.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/kernelstatus.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/layout.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/savewidget.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/pager.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/panelsection.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/printwidget.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/leftpanel.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/notebook.js" type="text/javascript" charset="utf-8"></script>
 <script src="static/js/notebook_main.js" type="text/javascript" charset="utf-8"></script>
 
 
 </body>
 
 </html>