rename metaui -> celltoolbar

IPython/frontend/html/notebook/static/css/metaui.css

@@ -1,54 +1,54 b''
 /*Css for the metadata edit area*/
 
-.metaedit{
+.celltoolbar{
     border:thin solid #DDD;
     margin-left:81px;
     border-bottom:none;
     background : #EEE;
     border-top-right-radius: 3px;
     border-top-left-radius: 3px;
     display:none;
 }
 
-.code_cell .metaedit{
+.code_cell .celltoolbar{
     margin-left:81px;
 }
 
-.text_cell .metaedit{
+.text_cell .celltoolbar{
     margin-left:0px;
 }
 
-.editmetaon div.input_area , .editmetaon div.text_cell_input{
+.celltoolbar-on div.input_area , .celltoolbar-on div.text_cell_input{
     border-top-right-radius: 0px;
     border-top-left-radius: 0px;
 }
 
-.editmetaon .metaedit {
+.celltoolbar-on .celltoolbar {
     display:block;
 }
 
-.metaedit ui-button {
+.celltoolbar ui-button {
     border :none;
 }
 
 .button_container {
  float:right;
  /*width:60px;*/
 }
 
 .button_container .ui-state-default, .button_container .ui-state-hover, .button_container .ui-state-hover span{
     border-radius : 0 0 0 0;
     border : none;
 }
 
-.metaedit select {
+.celltoolbar select {
     margin:10px;
     margin-top:0px;
     margin-bottom:0px;
 }
 
-.metaedit input[type=checkbox] {
+.celltoolbar input[type=checkbox] {
     margin-bottom:1px;
 
 }
 

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

@@ -1,313 +1,313 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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // Cell
 //============================================================================
 /**
  * An extendable module that provide base functionnality to create cell for notebook.
  * @module IPython
  * @namespace IPython
  * @submodule Cell
  */
 
 var IPython = (function (IPython) {
 
     var utils = IPython.utils;
 
     /**
      * The Base `Cell` class from which to inherit
      * @class Cell
      */
 
     /*
      * @constructor
      */
     var Cell = function () {
         this.placeholder = this.placeholder || '';
         this.read_only = false;
         this.selected = false;
         this.element = null;
         this.metadata = {};
         // load this from metadata later ?
         this.user_highlight = 'auto';
         this.create_element();
         if (this.element !== null) {
             this.element.data("cell", this);
             this.bind_events();
         }
         this.cell_id = utils.uuid();
     };
 
 
     /**
      * Empty. Subclasses must implement create_element.
      * This should contain all the code to create the DOM element in notebook
      * and will be called by Base Class constructor.
      * @method create_element
      */
     Cell.prototype.create_element = function () {};
 
 
     /**
      * Subclasses can implement override bind_events.
      * Be carefull to call the parent method when overwriting as it fires event.
      * this will be triggerd after create_element in constructor.
      * @method bind_events
      */
     Cell.prototype.bind_events = function () {
         var that = this;
         // We trigger events so that Cell doesn't have to depend on Notebook.
         that.element.click(function (event) {
             if (that.selected === false) {
                 $([IPython.events]).trigger('select.Cell', {'cell':that});
             }
         });
         that.element.focusin(function (event) {
             if (that.selected === false) {
                 $([IPython.events]).trigger('select.Cell', {'cell':that});
             }
         });
     };
 
     /**
      * Triger typsetting of math by mathjax on current cell element
      * @method typeset
      */
     Cell.prototype.typeset = function () {
         if (window.MathJax){
             var cell_math = this.element.get(0);
             MathJax.Hub.Queue(["Typeset",MathJax.Hub,cell_math]);
         }
     };
 
     /**
      * should be triggerd when cell is selected
      * @method select
      */
     Cell.prototype.select = function () {
         this.element.addClass('ui-widget-content ui-corner-all');
         this.selected = true;
     };
 
 
     /**
      * should be triggerd when cell is unselected
      * @method unselect
      */
     Cell.prototype.unselect = function () {
         this.element.removeClass('ui-widget-content ui-corner-all');
         this.selected = false;
     };
 
     /**
      * should be overritten by subclass
      * @method get_text
      */
     Cell.prototype.get_text = function () {
     };
 
     /**
      * should be overritten by subclass
      * @method set_text
      * @param {string} text
      */
     Cell.prototype.set_text = function (text) {
     };
 
     /**
      * Refresh codemirror instance
      * @method refresh
      */
     Cell.prototype.refresh = function () {
         this.code_mirror.refresh();
     };
 
 
     /**
      * should be overritten by subclass
      * @method  edit
      **/
     Cell.prototype.edit = function () {
     };
 
 
     /**
      * should be overritten by subclass
      * @method render
      **/
     Cell.prototype.render = function () {
     };
 
     /**
      * should be overritten by subclass
      * serialise cell to json.
      * @method toJSON
      **/
     Cell.prototype.toJSON = function () {
         var data = {};
         data.metadata = this.metadata;
         return data;
     };
 
 
     /**
      * should be overritten by subclass
      * @method fromJSON
      **/
     Cell.prototype.fromJSON = function (data) {
         if (data.metadata !== undefined) {
             this.metadata = data.metadata;
         }
-        this.metaui.rebuild();
+        this.celltoolbar.rebuild();
     };
 
 
     /**
      * can the cell be splitted in 2 cells.
      * @method is_splittable
      **/
     Cell.prototype.is_splittable = function () {
         return true;
     };
 
 
     /**
      * @return {String} - the text before the cursor
      * @method get_pre_cursor
      **/
     Cell.prototype.get_pre_cursor = function () {
         var cursor = this.code_mirror.getCursor();
         var text = this.code_mirror.getRange({line:0,ch:0}, cursor);
         text = text.replace(/^\n+/, '').replace(/\n+$/, '');
         return text;
     }
 
 
     /**
      * @return {String} - the text after the cursor
      * @method get_post_cursor
      **/
     Cell.prototype.get_post_cursor = function () {
         var cursor = this.code_mirror.getCursor();
         var last_line_num = this.code_mirror.lineCount()-1;
         var last_line_len = this.code_mirror.getLine(last_line_num).length;
         var end = {line:last_line_num, ch:last_line_len}
         var text = this.code_mirror.getRange(cursor, end);
         text = text.replace(/^\n+/, '').replace(/\n+$/, '');
         return text;
     };
 
 
     /** Grow the cell by hand. This is used upon reloading from JSON, when the
      *  autogrow handler is not called.
      *
      *  could be made static
      *
      *  @param {Dom element} - element
      *  @method grow
      **/
     Cell.prototype.grow = function(element) {
         var dom = element.get(0);
         var lines_count = 0;
         // modified split rule from
         // http://stackoverflow.com/questions/2035910/how-to-get-the-number-of-lines-in-a-textarea/2036424#2036424
         var lines = dom.value.split(/\r|\r\n|\n/);
         lines_count = lines.length;
         if (lines_count >= 1) {
             dom.rows = lines_count;
         } else {
             dom.rows = 1;
         }
     };
 
     /**
      * Toggle  CodeMirror LineNumber
      * @method toggle_line_numbers
      **/
     Cell.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();
     };
 
     /**
      * force codemirror highlight mode
      * @method force_highlight
      * @param {object} - CodeMirror mode
      **/
     Cell.prototype.force_highlight = function(mode) {
         this.user_highlight = mode;
         this.auto_highlight();
     };
 
     /**
      * Try to autodetect cell highlight mode, or use selected mode
      * @methods _auto_highlight
      * @private
      * @param {String|object|undefined} - CodeMirror mode | 'auto'
      **/
     Cell.prototype._auto_highlight = function (modes) {
         //Here we handle manually selected modes
         if( this.user_highlight != undefined &&  this.user_highlight != 'auto' )
         {
             var mode = this.user_highlight;
             CodeMirror.autoLoadMode(this.code_mirror, mode);
             this.code_mirror.setOption('mode', mode);
             return;
         }
         var first_line = this.code_mirror.getLine(0);
         // loop on every pairs
         for( var mode in modes) {
             var regs = modes[mode]['reg'];
             // only one key every time but regexp can't be keys...
             for(var reg in regs ) {
                 // here we handle non magic_modes
                 if(first_line.match(regs[reg]) != null) {
                     if (mode.search('magic_') != 0) {
                         this.code_mirror.setOption('mode',mode);
                         CodeMirror.autoLoadMode(this.code_mirror, mode);
                         return;
                     }
                     var open = modes[mode]['open']|| "%%";
                     var close = modes[mode]['close']|| "%%end";
                     var mmode = mode;
                     mode = mmode.substr(6);
                     CodeMirror.autoLoadMode(this.code_mirror, mode);
                     // create on the fly a mode that swhitch between
                     // plain/text and smth else otherwise `%%` is
                     // source of some highlight issues.
                     // we use patchedGetMode to circumvent a bug in CM
                     CodeMirror.defineMode(mmode , function(config) {
                         return CodeMirror.multiplexingMode(
                         CodeMirror.patchedGetMode(config, 'text/plain'),
                             // always set someting on close
                             {open: open, close: close,
                              mode: CodeMirror.patchedGetMode(config, mode),
                              delimStyle: "delimit"
                             }
                         );
                     });
                     this.code_mirror.setOption('mode', mmode);
                     return;
                 }
             }
         }
         // fallback on default (python)
         var default_mode = this.default_mode || 'text/plain';
         this.code_mirror.setOption('mode', default_mode);
     };
 
     IPython.Cell = Cell;
 
     return IPython;
 
 }(IPython));
 

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

@@ -1,381 +1,381 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
 //============================================================================
 /**
  * An extendable module that provide base functionnality to create cell for notebook.
  * @module IPython
  * @namespace IPython
  * @submodule CodeCell
  */
 
 var IPython = (function (IPython) {
     "use strict";
 
     var utils = IPython.utils;
     var key   = IPython.utils.keycodes;
     CodeMirror.modeURL = "/static/codemirror/mode/%N/%N.js";
 
     /**
      * A Cell conceived to write code.
      *
      * 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.
      * @class CodeCell
      * @extends IPython.Cell
      *
      * @constructor
      * @param {Object|null} kernel
      */
     var CodeCell = function (kernel) {
         this.kernel = kernel || null;
         this.code_mirror = null;
         this.input_prompt_number = null;
         this.collapsed = false;
         this.default_mode = 'python';
         IPython.Cell.apply(this, arguments);
 
         var that = this;
         this.element.focusout(
             function() { that.auto_highlight(); }
         );
     };
 
     CodeCell.prototype = new IPython.Cell();
 
     /**
      * @method auto_highlight
      */
     CodeCell.prototype.auto_highlight = function () {
         this._auto_highlight(IPython.config.cell_magic_highlight)
     };
 
     /** @method create_element */
     CodeCell.prototype.create_element = function () {
-        this.metaui = new IPython.MetaUI(this);
+        this.celltoolbar = new IPython.CellToolbar(this);
 
         var cell =  $('<div></div>').addClass('cell border-box-sizing code_cell vbox');
-        cell.append(this.metaui.$element);
+        cell.append(this.celltoolbar.element);
         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',
             readOnly: this.read_only,
             extraKeys: {"Tab": "indentMore","Shift-Tab" : "indentLess",'Backspace':"delSpaceToPrevTabStop"},
             onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this),
             matchBrackets: true
         });
         input.append(input_area);
         var output = $('<div></div>');
         cell.append(input).append(output);
         this.element = cell;
         this.output_area = new IPython.OutputArea(output, true);
 
         // construct a completer only if class exist
         // otherwise no print view
         if (IPython.Completer !== undefined)
         {
             this.completer = new IPython.Completer(this);
         }
     };
 
     /**
      *  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) {
 
         if (this.read_only){
             return false;
         }
 
         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
         if (event.type === 'keydown' && event.which != key.TAB ) {
             IPython.tooltip.remove_and_cancel_tooltip();
         };
 
         var cur = editor.getCursor();
         if (event.keyCode === key.ENTER){
             this.auto_highlight();
         }
 
         if (event.keyCode === key.ENTER && (event.shiftKey || event.ctrlKey)) {
             // Always ignore shift-enter in CodeMirror as we handle it.
             return true;
         } else if (event.which === 40 && event.type === 'keypress' && IPython.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
             IPython.tooltip.pending(that);
         } else if (event.which === key.UPARROW && event.type === 'keydown') {
             // If we are not at the top, let CM handle the up arrow and
             // prevent the global keydown handler from handling it.
             if (!that.at_top()) {
                 event.stop();
                 return false;
             } else {
                 return true;
             };
         } else if (event.which === key.ESC) {
             IPython.tooltip.remove_and_cancel_tooltip(true);
             return true;
         } else if (event.which === key.DOWNARROW && event.type === 'keydown') {
             // If we are not at the bottom, let CM handle the down arrow and
             // prevent the global keydown handler from handling it.
             if (!that.at_bottom()) {
                 event.stop();
                 return false;
             } else {
                 return true;
             };
         } else if (event.keyCode === key.TAB && event.type == 'keydown' && event.shiftKey) {
                 if (editor.somethingSelected()){
                     var anchor = editor.getCursor("anchor");
                     var head = editor.getCursor("head");
                     if( anchor.line != head.line){
                         return false;
                     }
                 }
                 IPython.tooltip.request(that);
                 event.stop();
                 return true;
         } else if (event.keyCode === key.TAB && event.type == 'keydown') {
             // Tab completion.
             //Do not trim here because of tooltip
             if (editor.somethingSelected()){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 if ((pre_cursor.substr(-1) === "("|| pre_cursor.substr(-1) === " ") && IPython.config.tooltip_on_tab ) {
                 IPython.tooltip.request(that);
                 // Prevent the event from bubbling up.
                 event.stop();
                 // Prevent CodeMirror from handling the tab.
                 return true;
             } else {
                 event.stop();
                 this.completer.startCompletion();
                 return true;
             };
         } else {
             // keypress/keyup also trigger on TAB press, and we don't want to
             // use those to disable tab completion.
             return false;
         };
         return false;
     };
 
 
     // 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(true, true, true);
         this.set_input_prompt('*');
         this.element.addClass("running");
         var callbacks = {
             'execute_reply': $.proxy(this._handle_execute_reply, this),
             'output': $.proxy(this.output_area.handle_output, this.output_area),
             'clear_output': $.proxy(this.output_area.handle_clear_output, this.output_area),
             'set_next_input': $.proxy(this._handle_set_next_input, this)
         };
         var msg_id = this.kernel.execute(this.get_text(), callbacks, {silent: false});
     };
 
     /**
      * @method _handle_execute_reply
      * @private
      */
     CodeCell.prototype._handle_execute_reply = function (content) {
         this.set_input_prompt(content.execution_count);
         this.element.removeClass("running");
         $([IPython.events]).trigger('set_dirty.Notebook', {'value': true});
     }
 
     CodeCell.prototype._handle_set_next_input = function (text) {
         var data = {'cell': this, 'text': text}
         $([IPython.events]).trigger('set_next_input.Notebook', data);
     }
 
     // Basic cell manipulation.
 
     CodeCell.prototype.select = function () {
         IPython.Cell.prototype.select.apply(this);
         this.code_mirror.refresh();
         this.code_mirror.focus();
         this.auto_highlight();
         // We used to need an additional refresh() after the focus, but
         // it appears that this has been fixed in CM. This bug would show
         // up on FF when a newly loaded markdown cell was edited.
     };
 
 
     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 = function () {
         this.collapsed = true;
         this.output_area.collapse();
     };
 
 
     CodeCell.prototype.expand = function () {
         this.collapsed = false;
         this.output_area.expand();
     };
 
 
     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 = prompt_value || "&nbsp;";
         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.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.at_top = function () {
         var cursor = this.code_mirror.getCursor();
         if (cursor.line === 0 && cursor.ch === 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) && cursor.ch === this.code_mirror.getLine(cursor.line).length) {
             return true;
         } else {
             return false;
         }
     };
 
 
     CodeCell.prototype.clear_output = function (stdout, stderr, other) {
         this.output_area.clear_output(stdout, stderr, other);
     };
 
 
     // JSON serialization
 
     CodeCell.prototype.fromJSON = function (data) {
         IPython.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.fromJSON(data.outputs);
             if (data.collapsed !== undefined) {
                 if (data.collapsed) {
                     this.collapse();
                 } else {
                     this.expand();
                 };
             };
         };
     };
 
 
     CodeCell.prototype.toJSON = function () {
         var data = IPython.Cell.prototype.toJSON.apply(this);
         data.input = this.get_text();
         data.cell_type = 'code';
         if (this.input_prompt_number) {
             data.prompt_number = this.input_prompt_number;
         };
         var outputs = this.output_area.toJSON();
         data.outputs = outputs;
         data.language = 'python';
         data.collapsed = this.collapsed;
         return data;
     };
 
 
     IPython.CodeCell = CodeCell;
 
     return IPython;
 }(IPython));

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

@@ -1,47 +1,47 b''
 // leave at least 2 line with only a star on it below, or doc generation fails
 /**
  *
  *
  * Placeholder for custom user javascript
  * mainly to be overridden in profile/static/js/custom.js
  * This will always be an empty file in IPython
  *
  * User could add any javascript in the `profile/static/js/custom.js` file
  * (and should create it if it does not exist).
  * It will be executed by the ipython notebook at load time.
  *
  * Same thing with `profile/static/css/custom.css` to inject custom css into the notebook.
  *
  * Example :
  *
  * Create a custom button in toolbar that execute `%qtconsole` in kernel
  * and hence open a qtconsole attached to the same kernel as the current notebook
  *
  *    $([IPython.events]).on('notebook_loaded.Notebook', function(){
  *        IPython.toolbar.add_buttons_group([
  *            {
  *                 'label'   : 'run qtconsole',
  *                 'icon'    : 'ui-icon-calculator', // select your icon from http://jqueryui.com/themeroller/
  *                 'callback': function(){IPython.notebook.kernel.execute('%qtconsole')}
  *            }
  *            // add more button here if needed.
  *            ]);
  *    });
  *
  * Example :
  *
  *  Use `jQuery.getScript(url [, success(script, textStatus, jqXHR)] );`
  *  to load custom script into the notebook.
  *
  *    // to load the metadata ui extension example.
- *    $.getScript('/static/js/examples/metaui.example.js');
+ *    $.getScript('/static/js/examples/celltoolbar.example.js');
  *    // or
  *    // to load the metadata ui extension to control slideshow mode / reveal js for nbconvert
- *    $.getScript('/static/js/examples/metaui.slideshow.js');
+ *    $.getScript('/static/js/examples/celltoolbar.slideshow.js');
  *
  *
  * @module IPython
  * @namespace IPython
  * @class customjs
  * @static
  */

IPython/frontend/html/notebook/static/js/examples/celltoolbar.example.js

@@ -1,184 +1,184 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 2012  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
-// MetaUI Example
+// CellToolbar Example
 //============================================================================
 
 /**
- * Example Use for the MetaUI library
+ * Example Use for the CellToolbar library
  * add the following to your custom.js to load
- * metadata UI for slideshow
+ * Celltoolbar UI for slideshow
  *
  * ```
- * $.getScript('/static/js/examples/metaui.example.js');
+ * $.getScript('/static/js/examples/celltoolbar.example.js');
  * ```
  */
  // IIFE without asignement, we don't modifiy the IPython namespace
 (function (IPython) {
     "use strict";
 
-    var MetaUI = IPython.MetaUI;
+    var CellToolbar = IPython.CellToolbar;
 
 
     var raw_edit = function(cell){
 
         var md = cell.metadata
 
         var textarea = $('<textarea/>')
             .attr('rows','13')
             .attr('cols','75')
             .attr('name','metadata')
             .text(JSON.stringify(md, null,4)||'');
         var dialogform = $('<div/>').attr('title','Edit the metadata')
             .append(
                 $('<form/>').append(
                     $('<fieldset/>').append(
                         $('<label/>')
                         .attr('for','metadata')
                         .text("Metadata (I know what I'm dooing and I won't complain if it breaks my notebook)")
                         )
                         .append($('<br/>'))
                         .append(
                             textarea
                         )
                     )
             );
         var editor = CodeMirror.fromTextArea(textarea[0], {
             lineNumbers: true,
             matchBrackets: true,
         });
         $(dialogform).dialog({
                 autoOpen: true,
                 height: 300,
                 width: 650,
                 modal: true,
                 buttons: {
                     "Ok": function() {
                         //validate json and set it
                         try {
                            var json = JSON.parse(editor.getValue());
                            cell.metadata = json;
                            $( this ).dialog( "close" );
                         }
                         catch(e)
                         {
                            alert('invalid json');
                         }
                     },
                     Cancel: function() {
                         $( this ).dialog( "close" );
                     }
                 },
                 close: function() {
                     //cleanup on close
                     $(this).remove();
                 }
         });
         editor.refresh();
     }
 
     var add_raw_edit_button = function(div, cell) {
         var button_container = $(div)
         var button = $('<div/>').button({label:'Raw Edit'})
                 .click(function(){raw_edit(cell); return false;})
         button_container.append(button);
     }
 
-    MetaUI.register_callback('example.rawedit',add_raw_edit_button);
+    CellToolbar.register_callback('example.rawedit',add_raw_edit_button);
     var example_preset = []
     example_preset.push('example.rawedit');
 
 
     var simple_button = function(div, cell) {
         var button_container = $(div);
         var button = $('<div/>').button({icons:{primary:'ui-icon-locked'}});
         var fun = function(value){
                 try{
                     if(value){
                         cell.code_mirror.setOption('readOnly','nocursor')
                         button.button('option','icons',{primary:'ui-icon-locked'})
                     } else {
                         cell.code_mirror.setOption('readOnly','false')
                         button.button('option','icons',{primary:'ui-icon-unlocked'})
                     }
                 } catch(e){}
 
         }
             fun(cell.metadata.ro)
             button.click(function(){
                     var v = cell.metadata.ro;
                     var locked = !v;
                     cell.metadata.ro = locked;
                     fun(locked)
                     })
                 .css('height','16px')
                 .css('width','35px');
         button_container.append(button);
     }
 
-    MetaUI.register_callback('example.lock',simple_button);
+    CellToolbar.register_callback('example.lock',simple_button);
     example_preset.push('example.lock');
 
     var toggle_test =  function(div, cell) {
         var button_container = $(div)
         var button = $('<div/>').button({label:String(cell.metadata.foo)});
         button.click(function(){
                     var v = cell.metadata.foo;
                     cell.metadata.foo = !v;
                     button.button("option","label",String(!v));
                 })
        button_container.append(button);
     }
 
-    MetaUI.register_callback('example.toggle',toggle_test);
+    CellToolbar.register_callback('example.toggle',toggle_test);
     example_preset.push('example.toggle');
 
     var checkbox_test =  function(div, cell) {
         var button_container = $(div)
 
         var chkb = $('<input/>').attr('type','checkbox');
         var lbl = $('<label/>').append($('<span/>').text('bar :').css('font-size','77%'));
         lbl.append(chkb);
         chkb.attr("checked",cell.metadata.bar);
         chkb.click(function(){
                     var v = cell.metadata.bar;
                     cell.metadata.bar = !v;
                     chkb.attr("checked",!v);
                 })
        button_container.append($('<div/>').append(lbl));
 
     }
 
-    MetaUI.register_callback('example.checkbox',checkbox_test);
+    CellToolbar.register_callback('example.checkbox',checkbox_test);
     example_preset.push('example.checkbox');
 
     var select_test =  function(div, cell) {
         var button_container = $(div)
 
         var select = $('<select/>');
 
         select.append($('<option/>').attr('value','foo').text('foo'));
         select.append($('<option/>').attr('value','bar').text('bar'));
         select.append($('<option/>').attr('value','qux').text('qux'));
         select.append($('<option/>').attr('value','zip').text('zip'));
         select.val(cell.metadata.option);
         select.change(function(){
                 cell.metadata.option = select.val();
                 });
        button_container.append($('<div/>').append(select));
 
     }
 
-    MetaUI.register_callback('example.select',select_test);
+    CellToolbar.register_callback('example.select',select_test);
     example_preset.push('example.select');
 
-    MetaUI.register_preset('example',example_preset);
-    MetaUI.set_preset('example');
+    CellToolbar.register_preset('example',example_preset);
+    CellToolbar.set_preset('example');
     console.log('Example extension for metadata editting loaded.');
 
 }(IPython));

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

@@ -1,178 +1,178 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // ToolBar
 //============================================================================
 
 var IPython = (function (IPython) {
 
     var MainToolBar = function (selector) {
         this.selector = selector;
         IPython.ToolBar.apply(this, arguments);
         this.construct();
         this.add_drop_down_list();
         this.bind_events();
         $(this.selector)
-        .append($('<label/>').text('MetaUI'))
-        .append(IPython.MetaUI.$dropdown_preset_selector)
+        .append($('<label/>').text('CellToolbar'))
+        .append(IPython.CellToolbar.dropdown_preset_element)
     };
 
     MainToolBar.prototype = new IPython.ToolBar(); 
 
     MainToolBar.prototype.construct = function () {
         this.add_buttons_group([
                 {
                     id : 'save_b',
                     label : 'Save',
                     icon : 'ui-icon-disk',
                     callback : function () {
                         IPython.notebook.save_notebook();
                         }
                 }
             ]);
         this.add_buttons_group([
                 {
                     id : 'cut_b',
                     label : 'Cut Cell',
                     icon : 'ui-icon-scissors',
                     callback : function () {
                         IPython.notebook.cut_cell();
                         }
                 },
                 {
                     id : 'copy_b',
                     label : 'Copy Cell',
                     icon : 'ui-icon-copy',
                     callback : function () {
                         IPython.notebook.copy_cell();
                         }
                 },
                 {
                     id : 'paste_b',
                     label : 'Paste Cell Below',
                     icon : 'ui-icon-clipboard',
                     callback : function () {
                         IPython.notebook.paste_cell_below();
                         }
                 }
             ],'cut_copy_paste');
 
         this.add_buttons_group([
                 {
                     id : 'move_up_b',
                     label : 'Move Cell Up',
                     icon : 'ui-icon-arrowthick-1-n',
                     callback : function () {
                         IPython.notebook.move_cell_up();
                         }
                 },
                 {
                     id : 'move_down_b',
                     label : 'Move Cell Down',
                     icon : 'ui-icon-arrowthick-1-s',
                     callback : function () {
                         IPython.notebook.move_cell_down();
                         }
                 }
             ],'move_up_down');
         
         this.add_buttons_group([
                 {
                     id : 'insert_above_b',
                     label : 'Insert Cell Above',
                     icon : 'ui-icon-arrowthickstop-1-n',
                     callback : function () {
                         IPython.notebook.insert_cell_above('code');
                         }
                 },
                 {
                     id : 'insert_below_b',
                     label : 'Insert Cell Below',
                     icon : 'ui-icon-arrowthickstop-1-s',
                     callback : function () {
                         IPython.notebook.insert_cell_below('code');
                         }
                 }
             ],'insert_above_below');
 
         this.add_buttons_group([
                 {
                     id : 'run_b',
                     label : 'Run Cell',
                     icon : 'ui-icon-play',
                     callback : function () {
                     IPython.notebook.execute_selected_cell();
                         }
                 },
                 {
                     id : 'interrupt_b',
                     label : 'Interrupt',
                     icon : 'ui-icon-stop',
                     callback : function () {
                         IPython.notebook.kernel.interrupt();
                         }
                 }
             ],'run_int');
     };
 
     MainToolBar.prototype.add_drop_down_list = function () {
         var select = $(this.selector)
             .append($('<select/>')
                 .attr('id','cell_type')
                 .addClass('ui-widget ui-widget-content')
                     .append($('<option/>').attr('value','code').text('Code'))
                     .append($('<option/>').attr('value','markdown').text('Markdown'))
                     .append($('<option/>').attr('value','raw').text('Raw Text'))
                     .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.bind_events = function () {
         var that = this;
         
         this.element.find('#cell_type').change(function () {
             var cell_type = $(this).val();
             if (cell_type === 'code') {
                 IPython.notebook.to_code();
             } else if (cell_type === 'markdown')  {
                 IPython.notebook.to_markdown();
             } else if (cell_type === 'raw')  {
                 IPython.notebook.to_raw();
             } else if (cell_type === 'heading1')  {
                 IPython.notebook.to_heading(undefined, 1);
             } else if (cell_type === 'heading2')  {
                 IPython.notebook.to_heading(undefined, 2);
             } else if (cell_type === 'heading3')  {
                 IPython.notebook.to_heading(undefined, 3);
             } else if (cell_type === 'heading4')  {
                 IPython.notebook.to_heading(undefined, 4);
             } else if (cell_type === 'heading5')  {
                 IPython.notebook.to_heading(undefined, 5);
             } else if (cell_type === 'heading6')  {
                 IPython.notebook.to_heading(undefined, 6);
             }
         });
         $([IPython.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);
             }
         });
     };
 
     IPython.MainToolBar = MainToolBar;
 
     return IPython;
 
 }(IPython));

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

@@ -1,496 +1,496 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 2012  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
-// MetaUI
+// CellToolbar
 //============================================================================
 
 
 /**
  * A Module to control the per-cell toolbar.
  * @module IPython
  * @namespace IPython
- * @submodule MetaUI
+ * @submodule CellToolbar
  */
 var IPython = (function (IPython) {
     "use strict";
 
 
     /**
      * @constructor
-     * @class MetaUI
+     * @class CellToolbar
      * @param {The cell to attach the metadata UI to} cell
      */
-    var MetaUI = function (cell) {
-        MetaUI._instances.push(this);
-        this.$metainner = $('<div/>');
+    var CellToolbar = function (cell) {
+        CellToolbar._instances.push(this);
+        this.inner_element = $('<div/>');
         this.cell = cell;
-        this.$element = $('<div/>').addClass('metaedit')
-                .append(this.$metainner)
+        this.element = $('<div/>').addClass('celltoolbar')
+                .append(this.inner_element)
         this.rebuild();
         return this;
     };
 
-    MetaUI.$dropdown_preset_selector = $('<select/>')
-        .attr('id','metaui_selector')
+    CellToolbar.dropdown_preset_element = $('<select/>')
+        .attr('id','celltoolbar_selector')
         .append($('<option/>').attr('value','').text('-'))
 
-    MetaUI.$dropdown_preset_selector.change(function(){
-        var val = MetaUI.$dropdown_preset_selector.val()
+    CellToolbar.dropdown_preset_element.change(function(){
+        var val = CellToolbar.dropdown_preset_element.val()
         if(val ==''){
-            $('body').removeClass('editmetaon')
+            $('body').removeClass('celltoolbar-on')
         } else {
-            $('body').addClass('editmetaon')
-            MetaUI.set_preset(val)
+            $('body').addClass('celltoolbar-on')
+            CellToolbar.set_preset(val)
         }
     })
 
 
 
     /**
      * Class variable that should contain a dict of all availlable callback
      * we need to think of wether or not we allow nested namespace
      * @property _callback_dict
      * @private
      */
-    MetaUI._callback_dict = {};
+    CellToolbar._callback_dict = {};
 
     /**
      * Class variable that should contain the reverse order list of the button
      * to add to the toolbar of each cell
      * @property _button_list
      * @private
      */
-    MetaUI._button_list = [];
+    CellToolbar._button_list = [];
 
     /**
      * keep a list of all instances to
      * be able to llop over them...
      * but how to 'destroy' them ?
      * have to think about it...
-     * or loop over the cells, and find their MetaUI instances.
+     * or loop over the cells, and find their CellToolbar instances.
      * @private
      * @property _instances
      */
-    MetaUI._instances =[]
+    CellToolbar._instances =[]
 
     /**
      * keep a list of all the availlabel presets for the toolbar
      * @private
      * @property _presets
      */
-    MetaUI._presets ={}
+    CellToolbar._presets ={}
 
     // this is by design not a prototype.
     /**
      * Register a callback to create an UI element in a cell toolbar.
      * @method register_callback
      * @param name {String} name to use to refer to the callback. It is advised to use a prefix with the name
      * for easier sorting and avoid collision
      * @param  callback {function(div, cell)} callback that will be called to generate the ui element
      *
      *
      * The callback will receive the following element :
      *
      *    * a div in which to add element.
      *    * the cell it is responsable from
      *
      * @example
      *
      * Example that create callback for a button that toggle between `true` and `false` label,
      * with the metadata under the key 'foo' to reflect the status of the button.
      *
      *      // first param reference to a DOM div
      *      // second param reference to the cell.
      *      var toggle =  function(div, cell) {
      *          var button_container = $(div)
      *
      *          // let's create a button that show the  current value of the metadata
      *          var button = $('<div/>').button({label:String(cell.metadata.foo)});
      *
      *          // On click, change the metadata value and update the button label
      *          button.click(function(){
      *                      var v = cell.metadata.foo;
      *                      cell.metadata.foo = !v;
      *                      button.button("option","label",String(!v));
      *                  })
      *
      *          // add the button to the DOM div.
      *          button_container.append(button);
      *      }
      *
      *      // now we register the callback under the name `foo` to give the
      *      // user the ability to use it later
-     *      MetaUI.register_callback('foo',toggle);
+     *      CellToolbar.register_callback('foo',toggle);
      */
-    MetaUI.register_callback = function(name, callback){
+    CellToolbar.register_callback = function(name, callback){
         // what do we do if name already exist ?
-        MetaUI._callback_dict[name] = callback;
+        CellToolbar._callback_dict[name] = callback;
     };
 
     /**
      * Register a preset of UI element in a cell toolbar.
      * Not supported Yet.
      * @method register_preset
      * @param name {String} name to use to refer to the preset. It is advised to use a prefix with the name
      * for easier sorting and avoid collision
      * @param  preset_list {List of String} reverse order of the button in the toolbar. Each String of the list
      *          should correspond to a name of a registerd callback.
      *
      * @private
      * @example
      *
-     *      MetaUI.register_callback('foo.c1',function(div,cell){...});
-     *      MetaUI.register_callback('foo.c2',function(div,cell){...});
-     *      MetaUI.register_callback('foo.c3',function(div,cell){...});
-     *      MetaUI.register_callback('foo.c4',function(div,cell){...});
-     *      MetaUI.register_callback('foo.c5',function(div,cell){...});
+     *      CellToolbar.register_callback('foo.c1',function(div,cell){...});
+     *      CellToolbar.register_callback('foo.c2',function(div,cell){...});
+     *      CellToolbar.register_callback('foo.c3',function(div,cell){...});
+     *      CellToolbar.register_callback('foo.c4',function(div,cell){...});
+     *      CellToolbar.register_callback('foo.c5',function(div,cell){...});
      *
-     *      MetaUI.register_preset('foo.foo_preset1',['foo.c1','foo.c2','foo.c5'])
-     *      MetaUI.register_preset('foo.foo_preset2',['foo.c4','foo.c5'])
+     *      CellToolbar.register_preset('foo.foo_preset1',['foo.c1','foo.c2','foo.c5'])
+     *      CellToolbar.register_preset('foo.foo_preset2',['foo.c4','foo.c5'])
      */
-    MetaUI.register_preset = function(name, preset_list){
-        MetaUI._presets[name] = preset_list
-        MetaUI.$dropdown_preset_selector.append(
+    CellToolbar.register_preset = function(name, preset_list){
+        CellToolbar._presets[name] = preset_list
+        CellToolbar.dropdown_preset_element.append(
            $('<option/>').attr('value',name).text(name)
         )
     }
     /**
      * set an UI preset from `register_preset`
      * @method set_preset
      * @param preset_name {String} string corresponding to the preset name
      *
      * @static
      * @private
      * @example
      *
-     *      MetaUI.set_preset('foo.foo_preset1');
+     *      CellToolbar.set_preset('foo.foo_preset1');
      */
-    MetaUI.set_preset= function(preset_name){
-        var preset = MetaUI._presets[preset_name];
+    CellToolbar.set_preset= function(preset_name){
+        var preset = CellToolbar._presets[preset_name];
 
         if(preset != undefined){
-            MetaUI._button_list = preset;
-            MetaUI.rebuild_all();
+            CellToolbar._button_list = preset;
+            CellToolbar.rebuild_all();
         }
     }
 
 
     // this is by design not a prototype.
     /**
      * This should be called on the class and not on a instance as it will trigger
      * rebuild of all the instances.
      * @method rebuild_all
      * @static
      *
      */
-    MetaUI.rebuild_all = function(){
-        for(var i in MetaUI._instances){
-            MetaUI._instances[i].rebuild();
+    CellToolbar.rebuild_all = function(){
+        for(var i in CellToolbar._instances){
+            CellToolbar._instances[i].rebuild();
         }
     }
 
     /**
      * Rebuild all the button on the toolbar to update it's state.
      * @method rebuild
      */
-    MetaUI.prototype.rebuild = function(){
+    CellToolbar.prototype.rebuild = function(){
         // strip evrything from the div
         // which is probabli metainner.
-        // or this.$element.
-        this.$metainner.empty();
+        // or this.element.
+        this.inner_element.empty();
         //this.add_raw_edit_button()
 
 
-        var cdict = MetaUI._callback_dict;
-        var preset = MetaUI._button_list;
+        var cdict = CellToolbar._callback_dict;
+        var preset = CellToolbar._button_list;
         // Yes we iterate on the class varaible, not the instance one.
-        for ( var index in MetaUI._button_list){
+        for ( var index in CellToolbar._button_list){
             var local_div = $('<div/>').addClass('button_container');
             // Note,
             // do this the other way, wrap in try/catch and don't append if any errors.
-            this.$metainner.append(local_div)
+            this.inner_element.append(local_div)
             cdict[preset[index]](local_div,this.cell)
         }
 
     }
 
     var raw_edit = function(cell){
 
         var md = cell.metadata
 
         var textarea = $('<textarea/>')
             .attr('rows','13')
             .attr('cols','75')
             .attr('name','metadata')
             .text(JSON.stringify(md, null,4)||'');
         var dialogform = $('<div/>').attr('title','Edit the metadata')
             .append(
                 $('<form/>').append(
                     $('<fieldset/>').append(
                         $('<label/>')
                         .attr('for','metadata')
                         .text("Metadata (I know what I'm dooing and I won't complain if it breaks my notebook)")
                         )
                         .append($('<br/>'))
                         .append(
                             textarea
                         )
                     )
             );
         var editor = CodeMirror.fromTextArea(textarea[0], {
             lineNumbers: true,
             matchBrackets: true,
         });
         $(dialogform).dialog({
                 autoOpen: true,
                 height: 300,
                 width: 650,
                 modal: true,
                 buttons: {
                     "Ok": function() {
                         //validate json and set it
                         try {
                            var json = JSON.parse(editor.getValue());
                            cell.metadata = json;
                            $( this ).dialog( "close" );
                         }
                         catch(e)
                         {
                            alert('invalid json');
                         }
                     },
                     Cancel: function() {
                         $( this ).dialog( "close" );
                     }
                 },
                 close: function() {
                     //cleanup on close
                     $(this).remove();
                 }
         });
         editor.refresh();
     }
 
 
     var add_raw_edit_button = function(div, cell) {
         var button_container = $(div)
         var button = $('<div/>').button({label:'Raw Edit'})
                 .click(function(){raw_edit(cell); return false;})
         button_container.append(button);
     }
 
-    MetaUI.register_callback('example.rawedit',add_raw_edit_button);
+    CellToolbar.register_callback('example.rawedit',add_raw_edit_button);
     var example_preset = []
     example_preset.push('example.rawedit');
 
     var simple_dialog = function(title,text){
         var dlg = $('<div/>').attr('title',title)
             .append($('<p/>').text(text))
         $(dlg).dialog({
                 autoOpen: true,
                 height: 300,
                 width: 650,
                 modal: true,
                 close: function() {
                     //cleanup on close
                     $(this).remove();
                 }
         });
     }
 
     var add_simple_dialog_button = function(div, cell) {
         var help_text = ["This is the Metadata editting UI.",
                          "It heavily rely on plugin to work ",
                          "and is still under developpement. You shouldn't wait too long before",
                          " seeing some customisable buttons in those toolbar."
                         ].join('\n')
         var button_container = $(div)
         var button = $('<div/>').button({label:'?'})
                 .click(function(){simple_dialog('help',help_text); return false;})
         button_container.append(button);
     }
 
-    MetaUI.register_callback('default.help',add_simple_dialog_button)
+    CellToolbar.register_callback('default.help',add_simple_dialog_button)
     var default_preset = []
     default_preset.push('default.help')
-    MetaUI.register_preset('default',default_preset)
-    MetaUI.set_preset('default')
+    CellToolbar.register_preset('default',default_preset)
+    CellToolbar.set_preset('default')
 
     var simple_button = function(div, cell) {
         var button_container = $(div);
         var button = $('<div/>').button({icons:{primary:'ui-icon-locked'}});
         var fun = function(value){
                 try{
                     if(value){
                         cell.code_mirror.setOption('readOnly','nocursor')
                         button.button('option','icons',{primary:'ui-icon-locked'})
                     } else {
                         cell.code_mirror.setOption('readOnly','false')
                         button.button('option','icons',{primary:'ui-icon-unlocked'})
                     }
                 } catch(e){}
 
         }
             fun(cell.metadata.ro)
             button.click(function(){
                     var v = cell.metadata.ro;
                     var locked = !v;
                     cell.metadata.ro = locked;
                     fun(locked)
                     })
                 .css('height','16px')
                 .css('width','35px');
         button_container.append(button);
     }
 
-    MetaUI.register_callback('example.lock',simple_button);
+    CellToolbar.register_callback('example.lock',simple_button);
     example_preset.push('example.lock');
 
     var toggle_test =  function(div, cell) {
         var button_container = $(div)
         var button = $('<div/>').button({label:String(cell.metadata.foo)});
         button.click(function(){
                     var v = cell.metadata.foo;
                     cell.metadata.foo = !v;
                     button.button("option","label",String(!v));
                 })
        button_container.append(button);
     }
 
-    MetaUI.register_callback('example.toggle',toggle_test);
+    CellToolbar.register_callback('example.toggle',toggle_test);
     example_preset.push('example.toggle');
 
     /**
      */
-    MetaUI.utils = {};
+    CellToolbar.utils = {};
 
     /**
      * A utility function to generate bindings between a checkbox and metadata
      * @method utils.checkbox_ui_generator
      * @static
      *
      * @param name {string} Label in front of the checkbox
      * @param setter {function( metadata_dict, newValue )}
      *        A setter method to set the newValue of the metadata dictionnary
      * @param getter {function( metadata )}
      *        A getter methods which return the current value of the metadata.
      *
      * @return callback {function( div, cell )} Callback to be passed to `register_callback`
      *
      * @example
      *
      * An exmple that bind the subkey `slideshow.isSectionStart` to a checkbox with a `New Slide` label
      *
-     *     var newSlide = MetaUI.utils.checkbox_ui_generator('New Slide',
+     *     var newSlide = CellToolbar.utils.checkbox_ui_generator('New Slide',
      *          // setter
      *          function(metadata,value){
      *              // we check that the slideshow namespace exist and create it if needed
      *              if (metadata.slideshow == undefined){metadata.slideshow = {}}
      *              // set the value
      *              metadata.slideshow.isSectionStart = value
      *              },
      *          //geter
      *          function(metadata){ var ns = metadata.slideshow;
      *              // if the slideshow namespace does not exist return `undefined`
      *              // (will be interpreted as `false` by checkbox) otherwise
      *              // return the value
      *              return (ns == undefined)? undefined: ns.isSectionStart
      *              }
      *      );
      *
-     *      MetaUI.register_callback('newSlide', newSlide);
+     *      CellToolbar.register_callback('newSlide', newSlide);
      *
      */
-    MetaUI.utils.checkbox_ui_generator = function(name,setter,getter){
+    CellToolbar.utils.checkbox_ui_generator = function(name,setter,getter){
          return function(div, cell) {
             var button_container = $(div)
 
             var chkb = $('<input/>').attr('type','checkbox');
             var lbl = $('<label/>').append($('<span/>').text(name).css('font-size','77%'));
             lbl.append(chkb);
             chkb.attr("checked",getter(cell.metadata));
 
             chkb.click(function(){
                         var v = getter(cell.metadata);
                         setter(cell.metadata,!v);
                         chkb.attr("checked",!v);
                     })
            button_container.append($('<div/>').append(lbl));
 
         }
     }
 
     /**
      * A utility function to generate bindings between a dropdown list and metadata
      * @method utils.select_ui_generator
      * @static
      *
      * @param list_list {list of sublist} List of sublist of metadata value and name in the dropdown list.
      *        subslit shoud contain 2 element each, first a string that woul be displayed in the dropdown list,
      *        and second the corresponding value for the metadata to be passed to setter/return by getter.
      * @param setter {function( metadata_dict, newValue )}
      *        A setter method to set the newValue of the metadata dictionnary
      * @param getter {function( metadata )}
      *        A getter methods which return the current value of the metadata.
      * @param [label=""] {String} optionnal label for the dropdown menu
      *
      * @return callback {function( div, cell )} Callback to be passed to `register_callback`
      *
      * @example
      *
-     *      var select_type = MetaUI.utils.select_ui_generator([
+     *      var select_type = CellToolbar.utils.select_ui_generator([
      *              ["-"            ,undefined      ],
      *              ["Header Slide" ,"header_slide" ],
      *              ["Slide"        ,"slide"        ],
      *              ["Fragment"     ,"fragment"     ],
      *              ["Skip"         ,"skip"         ],
      *              ],
      *              // setter
      *              function(metadata,value){
      *                  // we check that the slideshow namespace exist and create it if needed
      *                  if (metadata.slideshow == undefined){metadata.slideshow = {}}
      *                  // set the value
      *                  metadata.slideshow.slide_type = value
      *                  },
      *              //geter
      *              function(metadata){ var ns = metadata.slideshow;
      *                  // if the slideshow namespace does not exist return `undefined`
      *                  // (will be interpreted as `false` by checkbox) otherwise
      *                  // return the value
      *                  return (ns == undefined)? undefined: ns.slide_type
      *                  }
-     *      MetaUI.register_callback('slideshow.select',select_type);
+     *      CellToolbar.register_callback('slideshow.select',select_type);
      *
      */
-    MetaUI.utils.select_ui_generator = function(list_list,setter, getter, label){
+    CellToolbar.utils.select_ui_generator = function(list_list,setter, getter, label){
         label= label? label: "";
         return function(div, cell) {
             var button_container = $(div)
             var lbl = $("<label/>").append($('<span/>').text(label).css('font-size','77%'));
             var select = $('<select/>');
             for(var itemn in list_list){
                 var opt = $('<option/>');
                         opt.attr('value',list_list[itemn][1])
                         opt.text(list_list[itemn][0])
                 select.append(opt);
             }
             select.val(getter(cell.metadata));
 
             select.change(function(){
                         setter(cell.metadata,select.val());
                     });
             button_container.append($('<div/>').append(lbl).append(select));
 
         }
     };
 
 
-    IPython.MetaUI = MetaUI;
+    IPython.CellToolbar = CellToolbar;
 
     return IPython;
 }(IPython));

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

@@ -1,533 +1,533 b''
 //----------------------------------------------------------------------------
 //  Copyright (C) 2008-2012  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // TextCell
 //============================================================================
 
 /**
     A module that allow to create different type of Text Cell
     @module IPython
     @namespace IPython
  */
 var IPython = (function (IPython) {
 
     // TextCell base class
     var key = IPython.utils.keycodes;
 
     /**
      * Construct a new TextCell, codemirror mode is by default 'htmlmixed', and cell type is 'text'
      * cell start as not redered.
      *
      * @class TextCell
      * @constructor TextCell
      * @extend Ipython.Cell
      */
     var TextCell = function () {
         this.code_mirror_mode = this.code_mirror_mode || 'htmlmixed';
         IPython.Cell.apply(this, arguments);
         this.rendered = false;
         this.cell_type = this.cell_type || 'text';
     };
 
     TextCell.prototype = new IPython.Cell();
 
     /**
      * Create the DOM element of the TextCell
      * @method create_element
      * @private
      */
     TextCell.prototype.create_element = function () {
         var cell = $("<div>").addClass('cell text_cell border-box-sizing vbox');
-        this.metaui = new IPython.MetaUI(this);
-        cell.append(this.metaui.$element);
+        this.celltoolbar = new IPython.CellToolbar(this);
+        cell.append(this.celltoolbar.element);
         cell.attr('tabindex','2');
         var input_area = $('<div/>').addClass('text_cell_input border-box-sizing');
         this.code_mirror = CodeMirror(input_area.get(0), {
             indentUnit : 4,
             mode: this.code_mirror_mode,
             theme: 'default',
             value: this.placeholder,
             readOnly: this.read_only,
             lineWrapping : true,
             extraKeys: {"Tab": "indentMore","Shift-Tab" : "indentLess"},
             onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
         });
         // The tabindex=-1 makes this div focusable.
         var render_area = $('<div/>').addClass('text_cell_render border-box-sizing').
             addClass('rendered_html').attr('tabindex','-1');
         cell.append(input_area).append(render_area);
         this.element = cell;
     };
 
 
     /**
      * Bind the DOM evet to cell actions
      * Need to be called after TextCell.create_element
      * @private
      * @method bind_event
      */
     TextCell.prototype.bind_events = function () {
         IPython.Cell.prototype.bind_events.apply(this);
         var that = this;
         this.element.keydown(function (event) {
             if (event.which === 13 && !event.shiftKey) {
                 if (that.rendered) {
                     that.edit();
                     return false;
                 };
             };
         });
         this.element.dblclick(function () {
             that.edit();
         });
     };
 
     /**
      * This method gets called in CodeMirror's onKeyDown/onKeyPress
      * handlers and is used to provide custom key handling.
      *
      * Subclass should override this method to have custom handeling
      *
      * @method handle_codemirror_keyevent
      * @param {CodeMirror} editor - The codemirror instance bound to the cell
      * @param {event} event -
      * @return {Boolean} `true` if CodeMirror should ignore the event, `false` Otherwise
      */
     TextCell.prototype.handle_codemirror_keyevent = function (editor, event) {
 
         if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
             // Always ignore shift-enter in CodeMirror as we handle it.
             return true;
         }
         return false;
     };
 
     /**
      * Select the current cell and trigger 'focus'
      * @method select
      */
     TextCell.prototype.select = function () {
         IPython.Cell.prototype.select.apply(this);
         var output = this.element.find("div.text_cell_render");
         output.trigger('focus');
     };
 
     /**
      * unselect the current cell and `render` it
      * @method unselect
      */
     TextCell.prototype.unselect = function() {
         // render on selection of another cell
         this.render();
         IPython.Cell.prototype.unselect.apply(this);
     };
 
     /**
      *
      * put the current cell in edition mode
      * @method edit
      */
     TextCell.prototype.edit = function () {
         if ( this.read_only ) return;
         if (this.rendered === true) {
             var text_cell = this.element;
             var output = text_cell.find("div.text_cell_render");
             output.hide();
             text_cell.find('div.text_cell_input').show();
             this.code_mirror.refresh();
             this.code_mirror.focus();
             // We used to need an additional refresh() after the focus, but
             // it appears that this has been fixed in CM. This bug would show
             // up on FF when a newly loaded markdown cell was edited.
             this.rendered = false;
             if (this.get_text() === this.placeholder) {
                 this.set_text('');
                 this.refresh();
             }
         }
     };
 
 
     /**
      * Empty, Subclasses must define render.
      * @method render
      */
     TextCell.prototype.render = function () {};
 
 
     /**
      * 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.code_mirror.refresh();
     };
 
     /**
      * setter :{{#crossLink "TextCell/set_rendered"}}{{/crossLink}}
      * @method get_rendered
      * @return {html} html of rendered element
      * */
     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);
     };
 
     /**
      * not deprecated, but implementation wrong
      * @method at_top
      * @deprecated
      * @return {Boolean} true is cell rendered, false otherwise
      * I doubt this is what it is supposed to do
      * this implementation is completly false
      */
     TextCell.prototype.at_top = function () {
         if (this.rendered) {
             return true;
         } else {
             return false;
         }
     };
 
 
     /**
      * not deprecated, but implementation wrong
      * @method at_bottom
      * @deprecated
      * @return {Boolean} true is cell rendered, false otherwise
      * I doubt this is what it is supposed to do
      * this implementation is completly false
      * */
     TextCell.prototype.at_bottom = function () {
         if (this.rendered) {
             return true;
         } else {
             return false;
         }
     };
 
     /**
      * Create Text cell from JSON
      * @param {json} data - JSON serialized text-cell
      * @method fromJSON
      */
     TextCell.prototype.fromJSON = function (data) {
         IPython.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();
                 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 = IPython.Cell.prototype.toJSON.apply(this);
         data.cell_type = this.cell_type;
         data.source = this.get_text();
         return data;
     };
 
 
     /**
      * @constructor HtmlCell
      * @class HtmlCell
      * @extends Ipython.TextCell
      */
     var HTMLCell = function () {
         this.placeholder = "Type <strong>HTML</strong> and LaTeX: $\\alpha^2$";
         IPython.TextCell.apply(this, arguments);
         this.cell_type = 'html';
     };
 
 
     HTMLCell.prototype = new TextCell();
 
     /**
      * @method render
      */
     HTMLCell.prototype.render = function () {
         if (this.rendered === false) {
             var text = this.get_text();
             if (text === "") { text = this.placeholder; }
             this.set_rendered(text);
             this.typeset();
             this.element.find('div.text_cell_input').hide();
             this.element.find("div.text_cell_render").show();
             this.rendered = true;
         }
     };
 
 
     /**
      * @class MarkdownCell
      * @constructor MarkdownCell
      * @extends Ipython.HtmlCell
      */
     var MarkdownCell = function () {
         this.placeholder = "Type *Markdown* and LaTeX: $\\alpha^2$";
         IPython.TextCell.apply(this, arguments);
         this.cell_type = 'markdown';
     };
 
 
     MarkdownCell.prototype = new TextCell();
 
     /**
      * @method render
      */
     MarkdownCell.prototype.render = function () {
         if (this.rendered === false) {
             var text = this.get_text();
             if (text === "") { text = this.placeholder; }
             text = IPython.mathjaxutils.remove_math(text)
             var html = IPython.markdown_converter.makeHtml(text);
             html = IPython.mathjaxutils.replace_math(html)
             try {
                 this.set_rendered(html);
             } catch (e) {
                 console.log("Error running Javascript in Markdown:");
                 console.log(e);
                 this.set_rendered($("<div/>").addClass("js-error").html(
                     "Error rendering Markdown!<br/>" + e.toString())
                 );
             }
             this.element.find('div.text_cell_input').hide();
             this.element.find("div.text_cell_render").show();
             var code_snippets = this.element.find("pre > code");
             code_snippets.replaceWith(function () {
                 var code = $(this).html();
                 /* Substitute br for newlines and &nbsp; for spaces
                    before highlighting, since prettify doesn't
                    preserve those on all browsers */
                 code = code.replace(/(\r\n|\n|\r)/gm, "<br/>");
                 code = code.replace(/ /gm, '&nbsp;');
                 code = prettyPrintOne(code);
 
                 return '<code class="prettyprint">' + code + '</code>';
             });
             this.typeset()
             this.rendered = true;
         }
     };
 
 
     // RawCell
 
     /**
      * @class RawCell
      * @constructor RawCell
      * @extends Ipython.TextCell
      */
     var RawCell = function () {
         this.placeholder = "Type plain text and LaTeX: $\\alpha^2$";
         this.code_mirror_mode = 'rst';
         IPython.TextCell.apply(this, arguments);
         this.cell_type = 'raw';
         var that = this
 
         this.element.focusout(
                 function() { that.auto_highlight(); }
             );
     };
 
 
     RawCell.prototype = new TextCell();
 
     /**
      * Trigger autodetection of highlight scheme for current cell
      * @method auto_highlight
      */
     RawCell.prototype.auto_highlight = function () {
         this._auto_highlight(IPython.config.raw_cell_highlight);
     };
 
     /** @method render **/
     RawCell.prototype.render = function () {
         this.rendered = true;
         this.edit();
     };
 
 
     /** @method handle_codemirror_keyevent **/
     RawCell.prototype.handle_codemirror_keyevent = function (editor, event) {
 
         var that = this;
         if (event.which === key.UPARROW && event.type === 'keydown') {
             // If we are not at the top, let CM handle the up arrow and
             // prevent the global keydown handler from handling it.
             if (!that.at_top()) {
                 event.stop();
                 return false;
             } else {
                 return true;
             };
         } else if (event.which === key.DOWNARROW && event.type === 'keydown') {
             // If we are not at the bottom, let CM handle the down arrow and
             // prevent the global keydown handler from handling it.
             if (!that.at_bottom()) {
                 event.stop();
                 return false;
             } else {
                 return true;
             };
         };
         return false;
     };
 
     /** @method select **/
     RawCell.prototype.select = function () {
         IPython.Cell.prototype.select.apply(this);
         this.code_mirror.refresh();
         this.code_mirror.focus();
     };
 
     /** @method at_top **/
     RawCell.prototype.at_top = function () {
         var cursor = this.code_mirror.getCursor();
         if (cursor.line === 0 && cursor.ch === 0) {
             return true;
         } else {
             return false;
         }
     };
 
 
     /** @method at_bottom **/
     RawCell.prototype.at_bottom = function () {
         var cursor = this.code_mirror.getCursor();
         if (cursor.line === (this.code_mirror.lineCount()-1) && cursor.ch === this.code_mirror.getLine(cursor.line).length) {
             return true;
         } else {
             return false;
         }
     };
 
 
     /**
      * @class HeadingCell
      * @extends Ipython.TextCell
      */
 
     /**
      * @constructor HeadingCell
      * @extends Ipython.TextCell
      */
     var HeadingCell = function () {
         this.placeholder = "Type Heading Here";
         IPython.TextCell.apply(this, arguments);
         /**
          * heading level of the cell, use getter and setter to access
          * @property level
          */
         this.level = 1;
         this.cell_type = 'heading';
     };
 
 
     HeadingCell.prototype = new TextCell();
 
     /** @method fromJSON */
     HeadingCell.prototype.fromJSON = function (data) {
         if (data.level != undefined){
             this.level = data.level;
         }
         IPython.TextCell.prototype.fromJSON.apply(this, arguments);
     };
 
 
     /** @method toJSON */
     HeadingCell.prototype.toJSON = function () {
         var data = IPython.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;
         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.set_rendered = function (text) {
         var r = this.element.find("div.text_cell_render");
         r.empty();
         r.append($('<h'+this.level+'/>').html(text));
     };
 
 
     HeadingCell.prototype.get_rendered = function () {
         var r = this.element.find("div.text_cell_render");
         return r.children().first().html();
     };
 
 
     HeadingCell.prototype.render = function () {
         if (this.rendered === false) {
             var text = this.get_text();
             if (text === "") { text = this.placeholder; }
             this.set_rendered(text);
             this.typeset();
             this.element.find('div.text_cell_input').hide();
             this.element.find("div.text_cell_render").show();
             this.rendered = true;
         };
     };
 
     IPython.TextCell = TextCell;
     IPython.HTMLCell = HTMLCell;
     IPython.MarkdownCell = MarkdownCell;
     IPython.RawCell = RawCell;
     IPython.HeadingCell = HeadingCell;
 
 
     return IPython;
 
 }(IPython));