Use low overhead object heritence in Js (Object.create vs new)

the use of

    XX.prototype = new YY();

Does trigger the constructor of YY without the nead for it. `Object.create`
does go around this limitation and target browser that are relatively Old.

Cf https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create

for more info

It might help to get rid of some logic in constructors that check wether some
options are passed in, that were causing errors on noteboko load.  Typically
`if(element){ }` on Abstract  `Cell` constructor.

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

@@ -1,532 +1,532
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 /**
  *
  *
  * @module codecell
  * @namespace codecell
  * @class CodeCell
  */
 
 
 define([
     'base/js/namespace',
     'jquery',
     'base/js/utils',
     'base/js/keyboard',
     'notebook/js/cell',
     'notebook/js/outputarea',
     'notebook/js/completer',
     'notebook/js/celltoolbar',
     'codemirror/lib/codemirror',
     'codemirror/mode/python/python',
     'notebook/js/codemirror-ipython'
 ], function(IPython, $, utils, keyboard, cell, outputarea, completer, celltoolbar, CodeMirror, cmpython, cmip) {
     "use strict";
     var Cell = cell.Cell;
 
     /* local util for codemirror */
     var posEq = function(a, b) {return a.line == b.line && a.ch == b.ch;};
 
     /**
      *
      * function to delete until previous non blanking space character
      * or first multiple of 4 tabstop.
      * @private
      */
     CodeMirror.commands.delSpaceToPrevTabStop = function(cm){
         var from = cm.getCursor(true), to = cm.getCursor(false), sel = !posEq(from, to);
         if (!posEq(from, to)) { cm.replaceRange("", from, to); return; }
         var cur = cm.getCursor(), line = cm.getLine(cur.line);
         var tabsize = cm.getOption('tabSize');
         var chToPrevTabStop = cur.ch-(Math.ceil(cur.ch/tabsize)-1)*tabsize;
         from = {ch:cur.ch-chToPrevTabStop,line:cur.line};
         var select = cm.getRange(from,cur);
         if( select.match(/^\ +$/) !== null){
             cm.replaceRange("",from,cur);
         } else {
             cm.deleteH(-1,"char");
         }
     };
 
     var keycodes = keyboard.keycodes;
 
     var CodeCell = function (kernel, options) {
         // Constructor
         //
         // A Cell conceived to write code.
         //
         // Parameters:
         //  kernel: Kernel instance
         //      The kernel doesn't have to be set at creation time, in that case
         //      it will be null and set_kernel has to be called later.
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance 
         //          config: dictionary
         //          keyboard_manager: KeyboardManager instance 
         //          notebook: Notebook instance
         //          tooltip: Tooltip instance
         this.kernel = kernel || null;
         this.notebook = options.notebook;
         this.collapsed = false;
         this.events = options.events;
         this.tooltip = options.tooltip;
         this.config = options.config;
 
         // create all attributed in constructor function
         // even if null for V8 VM optimisation
         this.input_prompt_number = null;
         this.celltoolbar = null;
         this.output_area = null;
         this.last_msg_id = null;
         this.completer = null;
 
 
         var config = utils.mergeopt(CodeCell, this.config);
         Cell.apply(this,[{
             config: config, 
             keyboard_manager: options.keyboard_manager, 
             events: this.events}]);
 
         // Attributes we want to override in this subclass.
         this.cell_type = "code";
 
         var that = this;
         this.element.focusout(
             function() { that.auto_highlight(); }
         );
     };
 
     CodeCell.options_default = {
         cm_config : {
             extraKeys: {
                 "Tab" :  "indentMore",
                 "Shift-Tab" : "indentLess",
                 "Backspace" : "delSpaceToPrevTabStop",
                 "Cmd-/" : "toggleComment",
                 "Ctrl-/" : "toggleComment"
             },
             mode: 'ipython',
             theme: 'ipython',
             matchBrackets: true
         }
     };
 
     CodeCell.msg_cells = {};
 
-    CodeCell.prototype = new Cell();
+    CodeCell.prototype = Object.create(Cell.prototype);
 
     /**
      * @method auto_highlight
      */
     CodeCell.prototype.auto_highlight = function () {
         this._auto_highlight(this.config.cell_magic_highlight);
     };
 
     /** @method create_element */
     CodeCell.prototype.create_element = function () {
         Cell.prototype.create_element.apply(this, arguments);
 
         var cell =  $('<div></div>').addClass('cell code_cell');
         cell.attr('tabindex','2');
 
         var input = $('<div></div>').addClass('input');
         var prompt = $('<div/>').addClass('prompt input_prompt');
         var inner_cell = $('<div/>').addClass('inner_cell');
         this.celltoolbar = new celltoolbar.CellToolbar({
             cell: this, 
             notebook: this.notebook});
         inner_cell.append(this.celltoolbar.element);
         var input_area = $('<div/>').addClass('input_area');
         this.code_mirror = new CodeMirror(input_area.get(0), this.cm_config);
         this.code_mirror.on('keydown', $.proxy(this.handle_keyevent,this))
         $(this.code_mirror.getInputField()).attr("spellcheck", "false");
         inner_cell.append(input_area);
         input.append(prompt).append(inner_cell);
 
         var widget_area = $('<div/>')
             .addClass('widget-area')
             .hide();
         this.widget_area = widget_area;
         var widget_prompt = $('<div/>')
             .addClass('prompt')
             .appendTo(widget_area);
         var widget_subarea = $('<div/>')
             .addClass('widget-subarea')
             .appendTo(widget_area);
         this.widget_subarea = widget_subarea;
         var widget_clear_buton = $('<button />')
             .addClass('close')
             .html('&times;')
             .click(function() {
                 widget_area.slideUp('', function(){ widget_subarea.html(''); });
                 })
             .appendTo(widget_prompt);
 
         var output = $('<div></div>');
         cell.append(input).append(widget_area).append(output);
         this.element = cell;
         this.output_area = new outputarea.OutputArea({
             selector: output, 
             prompt_area: true, 
             events: this.events, 
             keyboard_manager: this.keyboard_manager});
         this.completer = new completer.Completer(this, this.events);
     };
 
     /** @method bind_events */
     CodeCell.prototype.bind_events = function () {
         Cell.prototype.bind_events.apply(this);
         var that = this;
 
         this.element.focusout(
             function() { that.auto_highlight(); }
         );
     };
 
 
     /**
      *  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.
      *  @method handle_codemirror_keyevent
      */
     CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) {
 
         var that = this;
         // whatever key is pressed, first, cancel the tooltip request before
         // they are sent, and remove tooltip if any, except for tab again
         var tooltip_closed = null;
         if (event.type === 'keydown' && event.which != keycodes.tab ) {
             tooltip_closed = this.tooltip.remove_and_cancel_tooltip();
         }
 
         var cur = editor.getCursor();
         if (event.keyCode === keycodes.enter){
             this.auto_highlight();
         }
 
         if (event.which === keycodes.down && event.type === 'keypress' && this.tooltip.time_before_tooltip >= 0) {
             // triger on keypress (!) otherwise inconsistent event.which depending on plateform
             // browser and keyboard layout !
             // Pressing '(' , request tooltip, don't forget to reappend it
             // The second argument says to hide the tooltip if the docstring
             // is actually empty
             this.tooltip.pending(that, true);
         } else if ( tooltip_closed && event.which === keycodes.esc && event.type === 'keydown') {
             // If tooltip is active, cancel it.  The call to
             // remove_and_cancel_tooltip above doesn't pass, force=true.
             // Because of this it won't actually close the tooltip
             // if it is in sticky mode. Thus, we have to check again if it is open
             // and close it with force=true.
             if (!this.tooltip._hidden) {
                 this.tooltip.remove_and_cancel_tooltip(true);
             }
             // If we closed the tooltip, don't let CM or the global handlers
             // handle this event.
             event.codemirrorIgnore = true;
             event.preventDefault();
             return true;
         } else if (event.keyCode === keycodes.tab && event.type === 'keydown' && event.shiftKey) {
                 if (editor.somethingSelected() || editor.getSelections().length !== 1){
                     var anchor = editor.getCursor("anchor");
                     var head = editor.getCursor("head");
                     if( anchor.line != head.line){
                         return false;
                     }
                 }
                 this.tooltip.request(that);
                 event.codemirrorIgnore = true;
                 event.preventDefault();
                 return true;
         } else if (event.keyCode === keycodes.tab && event.type == 'keydown') {
             // Tab completion.
             this.tooltip.remove_and_cancel_tooltip();
 
             // completion does not work on multicursor, it might be possible though in some cases
             if (editor.somethingSelected() || editor.getSelections().length > 1) {
                 return false;
             }
             var pre_cursor = editor.getRange({line:cur.line,ch:0},cur);
             if (pre_cursor.trim() === "") {
                 // Don't autocomplete if the part of the line before the cursor
                 // is empty.  In this case, let CodeMirror handle indentation.
                 return false;
             } else {
                 event.codemirrorIgnore = true;
                 event.preventDefault();
                 this.completer.startCompletion();
                 return true;
             }
         } 
         
         // keyboard event wasn't one of those unique to code cells, let's see
         // if it's one of the generic ones (i.e. check edit mode shortcuts)
         return Cell.prototype.handle_codemirror_keyevent.apply(this, [editor, event]);
     };
 
     // Kernel related calls.
 
     CodeCell.prototype.set_kernel = function (kernel) {
         this.kernel = kernel;
     };
 
     /**
      * Execute current code cell to the kernel
      * @method execute
      */
     CodeCell.prototype.execute = function () {
         this.output_area.clear_output();
         
         // Clear widget area
         this.widget_subarea.html('');
         this.widget_subarea.height('');
         this.widget_area.height('');
         this.widget_area.hide();
 
         this.set_input_prompt('*');
         this.element.addClass("running");
         if (this.last_msg_id) {
             this.kernel.clear_callbacks_for_msg(this.last_msg_id);
         }
         var callbacks = this.get_callbacks();
         
         var old_msg_id = this.last_msg_id;
         this.last_msg_id = this.kernel.execute(this.get_text(), callbacks, {silent: false, store_history: true});
         if (old_msg_id) {
             delete CodeCell.msg_cells[old_msg_id];
         }
         CodeCell.msg_cells[this.last_msg_id] = this;
         this.render();
     };
     
     /**
      * Construct the default callbacks for
      * @method get_callbacks
      */
     CodeCell.prototype.get_callbacks = function () {
         return {
             shell : {
                 reply : $.proxy(this._handle_execute_reply, this),
                 payload : {
                     set_next_input : $.proxy(this._handle_set_next_input, this),
                     page : $.proxy(this._open_with_pager, this)
                 }
             },
             iopub : {
                 output : $.proxy(this.output_area.handle_output, this.output_area),
                 clear_output : $.proxy(this.output_area.handle_clear_output, this.output_area),
             },
             input : $.proxy(this._handle_input_request, this)
         };
     };
     
     CodeCell.prototype._open_with_pager = function (payload) {
         this.events.trigger('open_with_text.Pager', payload);
     };
 
     /**
      * @method _handle_execute_reply
      * @private
      */
     CodeCell.prototype._handle_execute_reply = function (msg) {
         this.set_input_prompt(msg.content.execution_count);
         this.element.removeClass("running");
         this.events.trigger('set_dirty.Notebook', {value: true});
     };
 
     /**
      * @method _handle_set_next_input
      * @private
      */
     CodeCell.prototype._handle_set_next_input = function (payload) {
         var data = {'cell': this, 'text': payload.text};
         this.events.trigger('set_next_input.Notebook', data);
     };
 
     /**
      * @method _handle_input_request
      * @private
      */
     CodeCell.prototype._handle_input_request = function (msg) {
         this.output_area.append_raw_input(msg);
     };
 
 
     // Basic cell manipulation.
 
     CodeCell.prototype.select = function () {
         var cont = Cell.prototype.select.apply(this);
         if (cont) {
             this.code_mirror.refresh();
             this.auto_highlight();
         }
         return cont;
     };
 
     CodeCell.prototype.render = function () {
         var cont = Cell.prototype.render.apply(this);
         // Always execute, even if we are already in the rendered state
         return cont;
     };
     
     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.collapse_output = function () {
         this.collapsed = true;
         this.output_area.collapse();
     };
 
 
     CodeCell.prototype.expand_output = function () {
         this.collapsed = false;
         this.output_area.expand();
         this.output_area.unscroll_area();
     };
 
     CodeCell.prototype.scroll_output = function () {
         this.output_area.expand();
         this.output_area.scroll_if_long();
     };
 
     CodeCell.prototype.toggle_output = function () {
         this.collapsed = Boolean(1 - this.collapsed);
         this.output_area.toggle_output();
     };
 
     CodeCell.prototype.toggle_output_scroll = function () {
         this.output_area.toggle_scroll();
     };
 
 
     CodeCell.input_prompt_classical = function (prompt_value, lines_number) {
         var ns;
         if (prompt_value === undefined || prompt_value === null) {
             ns = "&nbsp;";
         } else {
             ns = encodeURIComponent(prompt_value);
         }
         return 'In&nbsp;[' + ns + ']:';
     };
 
     CodeCell.input_prompt_continuation = function (prompt_value, lines_number) {
         var html = [CodeCell.input_prompt_classical(prompt_value, lines_number)];
         for(var i=1; i < lines_number; i++) {
             html.push(['...:']);
         }
         return html.join('<br/>');
     };
 
     CodeCell.input_prompt_function = CodeCell.input_prompt_classical;
 
 
     CodeCell.prototype.set_input_prompt = function (number) {
         var nline = 1;
         if (this.code_mirror !== undefined) {
            nline = this.code_mirror.lineCount();
         }
         this.input_prompt_number = number;
         var prompt_html = CodeCell.input_prompt_function(this.input_prompt_number, nline);
         // This HTML call is okay because the user contents are escaped.
         this.element.find('div.input_prompt').html(prompt_html);
     };
 
 
     CodeCell.prototype.clear_input = function () {
         this.code_mirror.setValue('');
     };
 
 
     CodeCell.prototype.get_text = function () {
         return this.code_mirror.getValue();
     };
 
 
     CodeCell.prototype.set_text = function (code) {
         return this.code_mirror.setValue(code);
     };
 
 
     CodeCell.prototype.clear_output = function (wait) {
         this.output_area.clear_output(wait);
         this.set_input_prompt();
     };
 
 
     // JSON serialization
 
     CodeCell.prototype.fromJSON = function (data) {
         Cell.prototype.fromJSON.apply(this, arguments);
         if (data.cell_type === 'code') {
             if (data.input !== undefined) {
                 this.set_text(data.input);
                 // make this value the starting point, so that we can only undo
                 // to this state, instead of a blank cell
                 this.code_mirror.clearHistory();
                 this.auto_highlight();
             }
             if (data.prompt_number !== undefined) {
                 this.set_input_prompt(data.prompt_number);
             } else {
                 this.set_input_prompt();
             }
             this.output_area.trusted = data.metadata.trusted || false;
             this.output_area.fromJSON(data.outputs);
             if (data.collapsed !== undefined) {
                 if (data.collapsed) {
                     this.collapse_output();
                 } else {
                     this.expand_output();
                 }
             }
         }
     };
 
 
     CodeCell.prototype.toJSON = function () {
         var data = Cell.prototype.toJSON.apply(this);
         data.input = this.get_text();
         // is finite protect against undefined and '*' value
         if (isFinite(this.input_prompt_number)) {
             data.prompt_number = this.input_prompt_number;
         }
         var outputs = this.output_area.toJSON();
         data.outputs = outputs;
         data.language = 'python';
         data.metadata.trusted = this.output_area.trusted;
         data.collapsed = this.output_area.collapsed;
         return data;
     };
 
     /**
      * handle cell level logic when a cell is unselected
      * @method unselect
      * @return is the action being taken
      */
     CodeCell.prototype.unselect = function () {
         var cont = Cell.prototype.unselect.apply(this);
         if (cont) {
             // When a code cell is usnelected, make sure that the corresponding
             // tooltip and completer to that cell is closed.
             this.tooltip.remove_and_cancel_tooltip(true);
             if (this.completer !== null) {
                 this.completer.close();
             }
         }
         return cont;
     };
 
     // Backwards compatability.
     IPython.CodeCell = CodeCell;
 
     return {'CodeCell': CodeCell};
 });

IPython/html/static/notebook/js/maintoolbar.js

@@ -1,226 +1,226
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 
 define([
     'base/js/namespace',
     'jquery',
     'notebook/js/toolbar',
     'notebook/js/celltoolbar',
 ], function(IPython, $, toolbar, celltoolbar) {
     "use strict";
 
     var MainToolBar = function (selector, options) {
         // Constructor
         //
         // Parameters:
         //  selector: string
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance
         //          notebook: Notebook instance
         toolbar.ToolBar.apply(this, arguments);
         this.events = options.events;
         this.notebook = options.notebook;
         this.construct();
         this.add_celltype_list();
         this.add_celltoolbar_list();
         this.bind_events();
     };
 
-    MainToolBar.prototype = new toolbar.ToolBar();
+    MainToolBar.prototype = Object.create(toolbar.ToolBar.prototype);
 
     MainToolBar.prototype.construct = function () {
         var that = this;
         this.add_buttons_group([
                 {
                     id : 'save_b',
                     label : 'Save and Checkpoint',
                     icon : 'fa-save',
                     callback : function () {
                         that.notebook.save_checkpoint();
                         }
                 }
             ]);
 
         this.add_buttons_group([
                 {
                     id : 'insert_below_b',
                     label : 'Insert Cell Below',
                     icon : 'fa-plus',
                     callback : function () {
                         that.notebook.insert_cell_below('code');
                         that.notebook.select_next();
                         that.notebook.focus_cell();
                         }
                 }
             ],'insert_above_below');
 
         this.add_buttons_group([
                 {
                     id : 'cut_b',
                     label : 'Cut Cell',
                     icon : 'fa-cut',
                     callback : function () {
                         that.notebook.cut_cell();
                         }
                 },
                 {
                     id : 'copy_b',
                     label : 'Copy Cell',
                     icon : 'fa-copy',
                     callback : function () {
                         that.notebook.copy_cell();
                         }
                 },
                 {
                     id : 'paste_b',
                     label : 'Paste Cell Below',
                     icon : 'fa-paste',
                     callback : function () {
                         that.notebook.paste_cell_below();
                         }
                 }
             ],'cut_copy_paste');
 
         this.add_buttons_group([
                 {
                     id : 'move_up_b',
                     label : 'Move Cell Up',
                     icon : 'fa-arrow-up',
                     callback : function () {
                         that.notebook.move_cell_up();
                         }
                 },
                 {
                     id : 'move_down_b',
                     label : 'Move Cell Down',
                     icon : 'fa-arrow-down',
                     callback : function () {
                         that.notebook.move_cell_down();
                         }
                 }
             ],'move_up_down');
         
 
         this.add_buttons_group([
                 {
                     id : 'run_b',
                     label : 'Run Cell',
                     icon : 'fa-play',
                     callback : function () {
                         // emulate default shift-enter behavior
                         that.notebook.execute_cell_and_select_below();
                     }
                 },
                 {
                     id : 'interrupt_b',
                     label : 'Interrupt',
                     icon : 'fa-stop',
                     callback : function () {
                         that.notebook.kernel.interrupt();
                         }
                 },
                 {
                     id : 'repeat_b',
                     label : 'Restart Kernel',
                     icon : 'fa-repeat',
                     callback : function () {
                         that.notebook.restart_kernel();
                         }
                 }
             ],'run_int');
     };
     
     MainToolBar.prototype.add_celltype_list = function () {
         this.element
             .append($('<select/>')
                 .attr('id','cell_type')
                 .addClass('form-control select-xs')
                 .append($('<option/>').attr('value','code').text('Code'))
                 .append($('<option/>').attr('value','markdown').text('Markdown'))
                 .append($('<option/>').attr('value','raw').text('Raw NBConvert'))
                 .append($('<option/>').attr('value','heading1').text('Heading 1'))
                 .append($('<option/>').attr('value','heading2').text('Heading 2'))
                 .append($('<option/>').attr('value','heading3').text('Heading 3'))
                 .append($('<option/>').attr('value','heading4').text('Heading 4'))
                 .append($('<option/>').attr('value','heading5').text('Heading 5'))
                 .append($('<option/>').attr('value','heading6').text('Heading 6'))
             );
     };
 
     MainToolBar.prototype.add_celltoolbar_list = function () {
         var label = $('<span/>').addClass("navbar-text").text('Cell Toolbar:');
         var select = $('<select/>')
             .attr('id', 'ctb_select')
             .addClass('form-control select-xs')
             .append($('<option/>').attr('value', '').text('None'));
         this.element.append(label).append(select);
         var that = this;
         select.change(function() {
                 var val = $(this).val();
                 if (val ==='') {
                     celltoolbar.CellToolbar.global_hide();
                     delete that.notebook.metadata.celltoolbar;
                 } else {
                     celltoolbar.CellToolbar.global_show();
                     celltoolbar.CellToolbar.activate_preset(val, that.events);
                     that.notebook.metadata.celltoolbar = val;
                 }
             });
         // Setup the currently registered presets.
         var presets = celltoolbar.CellToolbar.list_presets();
         for (var i=0; i<presets.length; i++) {
             var name = presets[i];
             select.append($('<option/>').attr('value', name).text(name));
         }
         // Setup future preset registrations.
         this.events.on('preset_added.CellToolbar', function (event, data) {
             var name = data.name;
             select.append($('<option/>').attr('value', name).text(name));
         });
         // Update select value when a preset is activated.
         this.events.on('preset_activated.CellToolbar', function (event, data) {
             if (select.val() !== data.name)
                 select.val(data.name);
         });
     };
 
     MainToolBar.prototype.bind_events = function () {
         var that = this;
         
         this.element.find('#cell_type').change(function () {
             var cell_type = $(this).val();
             if (cell_type === 'code') {
                 that.notebook.to_code();
             } else if (cell_type === 'markdown')  {
                 that.notebook.to_markdown();
             } else if (cell_type === 'raw')  {
                 that.notebook.to_raw();
             } else if (cell_type === 'heading1')  {
                 that.notebook.to_heading(undefined, 1);
             } else if (cell_type === 'heading2')  {
                 that.notebook.to_heading(undefined, 2);
             } else if (cell_type === 'heading3')  {
                 that.notebook.to_heading(undefined, 3);
             } else if (cell_type === 'heading4')  {
                 that.notebook.to_heading(undefined, 4);
             } else if (cell_type === 'heading5')  {
                 that.notebook.to_heading(undefined, 5);
             } else if (cell_type === 'heading6')  {
                 that.notebook.to_heading(undefined, 6);
             }
         });
         this.events.on('selected_cell_type_changed.Notebook', function (event, data) {
             if (data.cell_type === 'heading') {
                 that.element.find('#cell_type').val(data.cell_type+data.level);
             } else {
                 that.element.find('#cell_type').val(data.cell_type);
             }
         });
     };
 
     // Backwards compatability.
     IPython.MainToolBar = MainToolBar;
 
     return {'MainToolBar': MainToolBar};
 });

IPython/html/static/notebook/js/scrollmanager.js

@@ -1,193 +1,193
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 define(['jquery'], function($){
     "use strict";
 
     var ScrollManager = function(notebook, options) {
         // Public constructor.
         this.notebook = notebook;
         options = options || {};
         this.animation_speed = options.animation_speed || 250; //ms
     };
 
     ScrollManager.prototype.scroll = function (delta) {
         // Scroll the document.
         //
         // Parameters
         // ----------
         // delta: integer
         //  direction to scroll the document.  Positive is downwards. 
         //  Unit is one page length.
         this.scroll_some(delta);
         return false;
     };
 
     ScrollManager.prototype.scroll_to = function(selector) {
         // Scroll to an element in the notebook.
         $('#notebook').animate({'scrollTop': $(selector).offset().top + $('#notebook').scrollTop() - $('#notebook').offset().top}, this.animation_speed);
     };
 
     ScrollManager.prototype.scroll_some = function(pages) {
         // Scroll up or down a given number of pages.
         //
         // Parameters
         // ----------
         // pages: integer
         //  number of pages to scroll the document, may be positive or negative.
         $('#notebook').animate({'scrollTop': $('#notebook').scrollTop() + pages * $('#notebook').height()}, this.animation_speed);
     };
 
     ScrollManager.prototype.get_first_visible_cell = function() {
         // Gets the index of the first visible cell in the document.
 
         // First, attempt to be smart by guessing the index of the cell we are
         // scrolled to.  Then, walk from there up or down until the right cell 
         // is found.  To guess the index, get the top of the last cell, and
         // divide that by the number of cells to get an average cell height.  
         // Then divide the scroll height by the average cell height.
         var cell_count = this.notebook.ncells();
         var first_cell_top = this.notebook.get_cell(0).element.offset().top;
         var last_cell_top = this.notebook.get_cell(cell_count-1).element.offset().top;
         var avg_cell_height = (last_cell_top - first_cell_top) / cell_count;
         var notebook = $('#notebook');
         var i = Math.ceil(notebook.scrollTop() / avg_cell_height);
         i = Math.min(Math.max(i , 0), cell_count - 1);
 
         while (this.notebook.get_cell(i).element.offset().top - first_cell_top < notebook.scrollTop() && i < cell_count - 1) {
             i += 1;
         } 
 
         while (this.notebook.get_cell(i).element.offset().top - first_cell_top > notebook.scrollTop() - 50 && i >= 0) {
             i -= 1;
         } 
         return Math.min(i + 1, cell_count - 1);
     };
 
 
     var TargetScrollManager = function(notebook, options) {
         // Public constructor.
         ScrollManager.apply(this, [notebook, options]);
     };
-    TargetScrollManager.prototype = new ScrollManager();
+    TargetScrollManager.prototype = Object.create(ScrollManager.prototype);
 
     TargetScrollManager.prototype.is_target = function (index) {
         // Check if a cell should be a scroll stop.
         //
         // Returns `true` if the cell is a cell that the scroll manager
         // should scroll to.  Otherwise, false is returned. 
         //
         // Parameters
         // ----------
         // index: integer
         //  index of the cell to test.
         return false;
     };
 
     TargetScrollManager.prototype.scroll = function (delta) {
         // Scroll the document.
         //
         // Parameters
         // ----------
         // delta: integer
         //  direction to scroll the document.  Positive is downwards.
         //  Units are targets.
 
         // Try to scroll to the next slide.
         var cell_count = this.notebook.ncells();
         var selected_index = this.get_first_visible_cell() + delta;
         while (0 <= selected_index && selected_index < cell_count && !this.is_target(selected_index)) {
             selected_index += delta;
         }
 
         if (selected_index < 0 || cell_count <= selected_index) {
             return ScrollManager.prototype.scroll.apply(this, [delta]);
         } else {
             this.scroll_to(this.notebook.get_cell(selected_index).element);
             
             // Cancel browser keyboard scroll.
             return false;
         }
     };
 
 
     var SlideScrollManager = function(notebook, options) {
         // Public constructor.
         TargetScrollManager.apply(this, [notebook, options]);
     };
-    SlideScrollManager.prototype = new TargetScrollManager();
+    SlideScrollManager.prototype = Object.create(TargetScrollManager.prototype);
 
     SlideScrollManager.prototype.is_target = function (index) {
         var cell = this.notebook.get_cell(index);
         return cell.metadata && cell.metadata.slideshow && 
             cell.metadata.slideshow.slide_type && 
             (cell.metadata.slideshow.slide_type === "slide" ||
             cell.metadata.slideshow.slide_type === "subslide");
     };
 
 
     var HeadingScrollManager = function(notebook, options) {
         // Public constructor.
         ScrollManager.apply(this, [notebook, options]);
         options = options || {};
         this._level = options.heading_level || 1;
     };
-    HeadingScrollManager.prototype = new ScrollManager();
+    HeadingScrollManager.prototype = Object.create(ScrollManager.prototype)
 
     HeadingScrollManager.prototype.scroll = function (delta) {
         // Scroll the document.
         //
         // Parameters
         // ----------
         // delta: integer
         //  direction to scroll the document.  Positive is downwards.
         //  Units are headers.
 
         // Get all of the header elements that match the heading level or are of
         // greater magnitude (a smaller header number).
         var headers = $();
         var i;
         for (i = 1; i <= this._level; i++) {
             headers = headers.add('#notebook-container h' + i);
         }
 
         // Find the header the user is on or below.
         var first_cell_top = this.notebook.get_cell(0).element.offset().top;
         var notebook = $('#notebook');
         var current_scroll = notebook.scrollTop();
         var header_scroll = 0;
         i = -1;
         while (current_scroll >= header_scroll && i < headers.length) {
             if (++i < headers.length) {
                 header_scroll = $(headers[i]).offset().top - first_cell_top;
             }
         }
         i--;
 
         // Check if the user is below the header.
         if (i < 0 || current_scroll > $(headers[i]).offset().top - first_cell_top + 30) {
             // Below the header, count the header as a target.
             if (delta < 0) {
                 delta += 1;
             }
         }
         i += delta;
 
         // Scroll!
         if (0 <= i && i < headers.length) {
             this.scroll_to(headers[i]);
             return false;
         } else {
             // Default to the base's scroll behavior when target header doesn't
             // exist.
             return ScrollManager.prototype.scroll.apply(this, [delta]);
         }
     };
 
     // Return naemspace for require.js loads
     return {
         'ScrollManager': ScrollManager,
         'SlideScrollManager': SlideScrollManager,
         'HeadingScrollManager': HeadingScrollManager,
         'TargetScrollManager': TargetScrollManager
     };
 });

IPython/html/static/notebook/js/textcell.js

@@ -1,424 +1,424
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 
 define([
     'base/js/namespace',
     'base/js/utils',
     'jquery',
     'notebook/js/cell',
     'base/js/security',
     'notebook/js/mathjaxutils',
     'notebook/js/celltoolbar',
     'components/marked/lib/marked',
     'codemirror/lib/codemirror',
     'codemirror/mode/gfm/gfm',
     'notebook/js/codemirror-ipythongfm'
 ], function(IPython,utils , $, cell, security, mathjaxutils, celltoolbar, marked, CodeMirror, gfm, ipgfm) {
     "use strict";
     var Cell = cell.Cell;
 
     var TextCell = function (options) {
         // Constructor
         //
         // Construct a new TextCell, codemirror mode is by default 'htmlmixed', 
         // and cell type is 'text' cell start as not redered.
         //
         // Parameters:
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance 
         //          config: dictionary
         //          keyboard_manager: KeyboardManager instance 
         //          notebook: Notebook instance
         options = options || {};
 
         // in all TextCell/Cell subclasses
         // do not assign most of members here, just pass it down
         // in the options dict potentially overwriting what you wish.
         // they will be assigned in the base class.
         this.notebook = options.notebook;
         this.events = options.events;
         this.config = options.config;
         
         // we cannot put this as a class key as it has handle to "this".
         var cm_overwrite_options  = {
             onKeyEvent: $.proxy(this.handle_keyevent,this)
         };
         var config = utils.mergeopt(TextCell, this.config, {cm_config:cm_overwrite_options});
         Cell.apply(this, [{
                     config: config, 
                     keyboard_manager: options.keyboard_manager, 
                     events: this.events}]);
 
         this.cell_type = this.cell_type || 'text';
         mathjaxutils = mathjaxutils;
         this.rendered = false;
     };
 
-    TextCell.prototype = new Cell();
+    TextCell.prototype = Object.create(Cell.prototype);
 
     TextCell.options_default = {
         cm_config : {
             extraKeys: {"Tab": "indentMore","Shift-Tab" : "indentLess"},
             mode: 'htmlmixed',
             lineWrapping : true,
         }
     };
 
 
     /**
      * Create the DOM element of the TextCell
      * @method create_element
      * @private
      */
     TextCell.prototype.create_element = function () {
         Cell.prototype.create_element.apply(this, arguments);
 
         var cell = $("<div>").addClass('cell text_cell');
         cell.attr('tabindex','2');
 
         var prompt = $('<div/>').addClass('prompt input_prompt');
         cell.append(prompt);
         var inner_cell = $('<div/>').addClass('inner_cell');
         this.celltoolbar = new celltoolbar.CellToolbar({
             cell: this, 
             notebook: this.notebook});
         inner_cell.append(this.celltoolbar.element);
         var input_area = $('<div/>').addClass('input_area');
         this.code_mirror = new CodeMirror(input_area.get(0), this.cm_config);
         // The tabindex=-1 makes this div focusable.
         var render_area = $('<div/>').addClass('text_cell_render rendered_html')
             .attr('tabindex','-1');
         inner_cell.append(input_area).append(render_area);
         cell.append(inner_cell);
         this.element = cell;
     };
 
 
     // Cell level actions
     
     TextCell.prototype.select = function () {
         var cont = Cell.prototype.select.apply(this);
         if (cont) {
             if (this.mode === 'edit') {
                 this.code_mirror.refresh();
             }
         }
         return cont;
     };
 
     TextCell.prototype.unrender = function () {
         if (this.read_only) return;
         var cont = Cell.prototype.unrender.apply(this);
         if (cont) {
             var text_cell = this.element;
             var output = text_cell.find("div.text_cell_render");
             if (this.get_text() === this.placeholder) {
                 this.set_text('');
             }
             this.refresh();
         }
         return cont;
     };
 
     TextCell.prototype.execute = function () {
         this.render();
     };
 
     /**
      * setter: {{#crossLink "TextCell/set_text"}}{{/crossLink}}
      * @method get_text
      * @retrun {string} CodeMirror current text value
      */
     TextCell.prototype.get_text = function() {
         return this.code_mirror.getValue();
     };
 
     /**
      * @param {string} text - Codemiror text value
      * @see TextCell#get_text
      * @method set_text
      * */
     TextCell.prototype.set_text = function(text) {
         this.code_mirror.setValue(text);
         this.unrender();
         this.code_mirror.refresh();
     };
 
     /**
      * setter :{{#crossLink "TextCell/set_rendered"}}{{/crossLink}}
      * @method get_rendered
      * */
     TextCell.prototype.get_rendered = function() {
         return this.element.find('div.text_cell_render').html();
     };
 
     /**
      * @method set_rendered
      */
     TextCell.prototype.set_rendered = function(text) {
         this.element.find('div.text_cell_render').html(text);
     };
 
 
     /**
      * Create Text cell from JSON
      * @param {json} data - JSON serialized text-cell
      * @method fromJSON
      */
     TextCell.prototype.fromJSON = function (data) {
         Cell.prototype.fromJSON.apply(this, arguments);
         if (data.cell_type === this.cell_type) {
             if (data.source !== undefined) {
                 this.set_text(data.source);
                 // make this value the starting point, so that we can only undo
                 // to this state, instead of a blank cell
                 this.code_mirror.clearHistory();
                 // TODO: This HTML needs to be treated as potentially dangerous
                 // user input and should be handled before set_rendered.         
                 this.set_rendered(data.rendered || '');
                 this.rendered = false;
                 this.render();
             }
         }
     };
 
     /** Generate JSON from cell
      * @return {object} cell data serialised to json
      */
     TextCell.prototype.toJSON = function () {
         var data = Cell.prototype.toJSON.apply(this);
         data.source = this.get_text();
         if (data.source == this.placeholder) {
             data.source = "";
         }
         return data;
     };
 
 
     var MarkdownCell = function (options) {
         // Constructor
         //
         // Parameters:
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance 
         //          config: dictionary
         //          keyboard_manager: KeyboardManager instance 
         //          notebook: Notebook instance
         options = options || {};
         var config = utils.mergeopt(MarkdownCell, options.config);
         TextCell.apply(this, [$.extend({}, options, {config: config})]);
 
         this.cell_type = 'markdown';
     };
 
     MarkdownCell.options_default = {
         cm_config: {
             mode: 'ipythongfm'
         },
         placeholder: "Type *Markdown* and LaTeX: $\\alpha^2$"
     };
 
-    MarkdownCell.prototype = new TextCell();
+    MarkdownCell.prototype = Object.create(TextCell.prototype);
 
     /**
      * @method render
      */
     MarkdownCell.prototype.render = function () {
         var cont = TextCell.prototype.render.apply(this);
         if (cont) {
             var text = this.get_text();
             var math = null;
             if (text === "") { text = this.placeholder; }
             var text_and_math = mathjaxutils.remove_math(text);
             text = text_and_math[0];
             math = text_and_math[1];
             var html = marked.parser(marked.lexer(text));
             html = mathjaxutils.replace_math(html, math);
             html = security.sanitize_html(html);
             html = $($.parseHTML(html));
             // links in markdown cells should open in new tabs
             html.find("a[href]").not('[href^="#"]').attr("target", "_blank");
             this.set_rendered(html);
             this.typeset();
         }
         return cont;
     };
 
 
     var RawCell = function (options) {
         // Constructor
         //
         // Parameters:
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance 
         //          config: dictionary
         //          keyboard_manager: KeyboardManager instance 
         //          notebook: Notebook instance
         options = options || {};
         var config = utils.mergeopt(RawCell, options.config);
         TextCell.apply(this, [$.extend({}, options, {config: config})]);
 
         this.cell_type = 'raw';
     };
 
     RawCell.options_default = {
         placeholder : "Write raw LaTeX or other formats here, for use with nbconvert. " +
             "It will not be rendered in the notebook. " + 
             "When passing through nbconvert, a Raw Cell's content is added to the output unmodified."
     };
 
-    RawCell.prototype = new TextCell();
+    RawCell.prototype = Object.create(TextCell.prototype);
 
     /** @method bind_events **/
     RawCell.prototype.bind_events = function () {
         TextCell.prototype.bind_events.apply(this);
         var that = this;
         this.element.focusout(function() {
             that.auto_highlight();
             that.render();
         });
 
         this.code_mirror.on('focus', function() { that.unrender(); });
     };
 
     /**
      * Trigger autodetection of highlight scheme for current cell
      * @method auto_highlight
      */
     RawCell.prototype.auto_highlight = function () {
         this._auto_highlight(this.config.raw_cell_highlight);
     };
 
     /** @method render **/
     RawCell.prototype.render = function () {
         var cont = TextCell.prototype.render.apply(this);
         if (cont){
             var text = this.get_text();
             if (text === "") { text = this.placeholder; }
             this.set_text(text);
             this.element.removeClass('rendered');
         }
         return cont;
     };
 
 
     var HeadingCell = function (options) {
         // Constructor
         //
         // Parameters:
         //  options: dictionary
         //      Dictionary of keyword arguments.
         //          events: $(Events) instance 
         //          config: dictionary
         //          keyboard_manager: KeyboardManager instance 
         //          notebook: Notebook instance
         options = options || {};
         var config = utils.mergeopt(HeadingCell, options.config);
         TextCell.apply(this, [$.extend({}, options, {config: config})]);
 
         this.level = 1;
         this.cell_type = 'heading';
     };
 
     HeadingCell.options_default = {
         cm_config: {
             theme: 'heading-1'
         },
         placeholder: "Type Heading Here"
     };
 
-    HeadingCell.prototype = new TextCell();
+    HeadingCell.prototype = Object.create(TextCell.prototype);
 
     /** @method fromJSON */
     HeadingCell.prototype.fromJSON = function (data) {
         if (data.level !== undefined){
             this.level = data.level;
         }
         TextCell.prototype.fromJSON.apply(this, arguments);
         this.code_mirror.setOption("theme", "heading-"+this.level);
     };
 
 
     /** @method toJSON */
     HeadingCell.prototype.toJSON = function () {
         var data = TextCell.prototype.toJSON.apply(this);
         data.level = this.get_level();
         return data;
     };
 
     /**
      * Change heading level of cell, and re-render
      * @method set_level
      */
     HeadingCell.prototype.set_level = function (level) {
         this.level = level;
         this.code_mirror.setOption("theme", "heading-"+level);
 
         if (this.rendered) {
             this.rendered = false;
             this.render();
         }
     };
 
     /** The depth of header cell, based on html (h1 to h6)
      * @method get_level
      * @return {integer} level - for 1 to 6
      */
     HeadingCell.prototype.get_level = function () {
         return this.level;
     };
 
 
     HeadingCell.prototype.get_rendered = function () {
         var r = this.element.find("div.text_cell_render");
         return r.children().first().html();
     };
 
     HeadingCell.prototype.render = function () {
         var cont = TextCell.prototype.render.apply(this);
         if (cont) {
             var text = this.get_text();
             var math = null;
             // Markdown headings must be a single line
             text = text.replace(/\n/g, ' ');
             if (text === "") { text = this.placeholder; }
             text = new Array(this.level + 1).join("#") + " " + text;
             var text_and_math = mathjaxutils.remove_math(text);
             text = text_and_math[0];
             math = text_and_math[1];
             var html = marked.parser(marked.lexer(text));
             html = mathjaxutils.replace_math(html, math);
             html = security.sanitize_html(html);
             var h = $($.parseHTML(html));
             // add id and linkback anchor
             var hash = h.text().trim().replace(/ /g, '-');
             h.attr('id', hash);
             h.append(
                 $('<a/>')
                     .addClass('anchor-link')
                     .attr('href', '#' + hash)
                     .text('¶')
             );
             this.set_rendered(h);
             this.typeset();
         }
         return cont;
     };
 
     // Backwards compatability.
     IPython.TextCell = TextCell;
     IPython.MarkdownCell = MarkdownCell;
     IPython.RawCell = RawCell;
     IPython.HeadingCell = HeadingCell;
 
     var textcell = {
         'TextCell': TextCell,
         'MarkdownCell': MarkdownCell,
         'RawCell': RawCell,
         'HeadingCell': HeadingCell,
     };
     return textcell;
 });