Merge pull request #1331 from ellisonbg/celltypes

Added plaintext and heading cells to the notebook UI and nbformat.

In the process we have updated the nbformat to v3 and integrated these new cell types into the new toolbar.

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

@@ -824,6 +824,8 @@ var IPython = (function (IPython) {
             if (data.collapsed !== undefined) {
                 if (data.collapsed) {
                     this.collapse();
+                } else {
+                    this.expand();
                 };
             };
         };

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

@@ -129,6 +129,27 @@ var IPython = (function (IPython) {
         this.element.find('#to_markdown').click(function () {
             IPython.notebook.to_markdown();
         });
+        this.element.find('#to_plaintext').click(function () {
+            IPython.notebook.to_plaintext();
+        });
+        this.element.find('#to_heading1').click(function () {
+            IPython.notebook.to_heading(undefined, 1);
+        });
+        this.element.find('#to_heading2').click(function () {
+            IPython.notebook.to_heading(undefined, 2);
+        });
+        this.element.find('#to_heading3').click(function () {
+            IPython.notebook.to_heading(undefined, 3);
+        });
+        this.element.find('#to_heading4').click(function () {
+            IPython.notebook.to_heading(undefined, 4);
+        });
+        this.element.find('#to_heading5').click(function () {
+            IPython.notebook.to_heading(undefined, 5);
+        });
+        this.element.find('#to_heading6').click(function () {
+            IPython.notebook.to_heading(undefined, 6);
+        });
         this.element.find('#toggle_output').click(function () {
             IPython.notebook.toggle_output();
         });

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

@@ -136,7 +136,42 @@ var IPython = (function (IPython) {
                 that.control_key_active = false;
                 return false;
             } else if (event.which === 84 && that.control_key_active) {
-                // Toggle output = t
+                // To Plaintext = t
+                that.to_plaintext();
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 49 && that.control_key_active) {
+                // To Heading 1 = 1
+                that.to_heading(undefined, 1);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 50 && that.control_key_active) {
+                // To Heading 2 = 2
+                that.to_heading(undefined, 2);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 51 && that.control_key_active) {
+                // To Heading 3 = 3
+                that.to_heading(undefined, 3);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 52 && that.control_key_active) {
+                // To Heading 4 = 4
+                that.to_heading(undefined, 4);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 53 && that.control_key_active) {
+                // To Heading 5 = 5
+                that.to_heading(undefined, 5);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 54 && that.control_key_active) {
+                // To Heading 6 = 6
+                that.to_heading(undefined, 6);
+                that.control_key_active = false;
+                return false;
+            } else if (event.which === 79 && that.control_key_active) {
+                // Toggle output = o
                 that.toggle_output();
                 that.control_key_active = false;
                 return false;
@@ -366,7 +401,11 @@ var IPython = (function (IPython) {
             };
             var cell = this.get_cell(index)
             cell.select();
-            IPython.toolbar.set_cell_type(cell.cell_type);
+            if (cell.cell_type === 'heading') {
+                IPython.toolbar.set_cell_type(cell.cell_type+cell.level);
+            } else {
+                IPython.toolbar.set_cell_type(cell.cell_type)
+            }
         };
         return this;
     };
@@ -467,15 +506,19 @@ var IPython = (function (IPython) {
         // type = ('code','html','markdown')
         // index = cell index or undefined to insert below selected
         index = this.index_or_selected(index);
+        var cell = null;
         if (this.ncells() === 0 || this.is_valid_cell_index(index)) {
-            var cell = null;
             if (type === 'code') {
-                var cell = new IPython.CodeCell(this);
+                cell = new IPython.CodeCell(this);
                 cell.set_input_prompt();
             } else if (type === 'markdown') {
-                var cell = new IPython.MarkdownCell(this);
+                cell = new IPython.MarkdownCell(this);
             } else if (type === 'html') {
-                var cell = new IPython.HTMLCell(this);
+                cell = new IPython.HTMLCell(this);
+            } else if (type === 'plaintext') {
+                cell = new IPython.PlaintextCell(this);
+            } else if (type === 'heading') {
+                cell = new IPython.HeadingCell(this);
             };
             if (cell !== null) {
                 if (this.ncells() === 0) {
@@ -489,6 +532,7 @@ var IPython = (function (IPython) {
                 return cell;
             };
         };
+        return cell;
     };
 
 
@@ -496,15 +540,19 @@ var IPython = (function (IPython) {
         // type = ('code','html','markdown')
         // index = cell index or undefined to insert above selected
         index = this.index_or_selected(index);
+        var cell = null;
         if (this.ncells() === 0 || this.is_valid_cell_index(index)) {
-            var cell = null;
             if (type === 'code') {
-                var cell = new IPython.CodeCell(this);
+                cell = new IPython.CodeCell(this);
                 cell.set_input_prompt();
             } else if (type === 'markdown') {
-                var cell = new IPython.MarkdownCell(this);
+                cell = new IPython.MarkdownCell(this);
             } else if (type === 'html') {
-                var cell = new IPython.HTMLCell(this);
+                cell = new IPython.HTMLCell(this);
+            } else if (type === 'plaintext') {
+                cell = new IPython.PlaintextCell(this);
+            } else if (type === 'heading') {
+                cell = new IPython.HeadingCell(this);
             };
             if (cell !== null) {
                 if (this.ncells() === 0) {
@@ -518,6 +566,7 @@ var IPython = (function (IPython) {
                 return cell;
             };
         };
+        return cell;
     };
 
 
@@ -534,8 +583,8 @@ var IPython = (function (IPython) {
                 }
                 target_cell.set_text(text);
                 source_element.remove();
+                this.dirty = true;
             };
-            this.dirty = true;
         };
     };
 
@@ -545,19 +594,16 @@ var IPython = (function (IPython) {
         if (this.is_valid_cell_index(i)) {
             var source_element = this.get_cell_element(i);
             var source_cell = source_element.data("cell");
-            var target_cell = null;
             if (!(source_cell instanceof IPython.MarkdownCell)) {
                 target_cell = this.insert_cell_below('markdown',i);
                 var text = source_cell.get_text();
                 if (text === source_cell.placeholder) {
                     text = '';
                 };
-                if (target_cell !== null) {
-                    // The edit must come before the set_text.
-                    target_cell.edit();
-                    target_cell.set_text(text);
-                    source_element.remove();
-                }
+                // The edit must come before the set_text.
+                target_cell.edit();
+                target_cell.set_text(text);
+                source_element.remove();
                 this.dirty = true;
             };
         };
@@ -576,14 +622,61 @@ var IPython = (function (IPython) {
                 if (text === source_cell.placeholder) {
                     text = '';
                 };
-                if (target_cell !== null) {
-                    // The edit must come before the set_text.
-                    target_cell.edit();
-                    target_cell.set_text(text);
-                    source_element.remove();
-                }
+                // The edit must come before the set_text.
+                target_cell.edit();
+                target_cell.set_text(text);
+                source_element.remove();
+                this.dirty = true;
+            };
+        };
+    };
+
+
+    Notebook.prototype.to_plaintext = function (index) {
+        var i = this.index_or_selected(index);
+        if (this.is_valid_cell_index(i)) {
+            var source_element = this.get_cell_element(i);
+            var source_cell = source_element.data("cell");
+            var target_cell = null;
+            if (!(source_cell instanceof IPython.PlaintextCell)) {
+                target_cell = this.insert_cell_below('plaintext',i);
+                var text = source_cell.get_text();
+                if (text === source_cell.placeholder) {
+                    text = '';
+                };
+                // The edit must come before the set_text.
+                target_cell.edit();
+                target_cell.set_text(text);
+                source_element.remove();
+                this.dirty = true;
+            };
+        };
+    };
+
+
+    Notebook.prototype.to_heading = function (index, level) {
+        level = level || 1;
+        var i = this.index_or_selected(index);
+        if (this.is_valid_cell_index(i)) {
+            var source_element = this.get_cell_element(i);
+            var source_cell = source_element.data("cell");
+            var target_cell = null;
+            if (source_cell instanceof IPython.HeadingCell) {
+                source_cell.set_level(level);
+            } else {
+                target_cell = this.insert_cell_below('heading',i);
+                var text = source_cell.get_text();
+                if (text === source_cell.placeholder) {
+                    text = '';
+                };
+                // The edit must come before the set_text.
+                target_cell.set_level(level);
+                target_cell.edit();
+                target_cell.set_text(text);
+                source_element.remove();
                 this.dirty = true;
             };
+            IPython.toolbar.set_cell_type("heading"+level);
         };
     };
 
@@ -1098,7 +1191,7 @@ var IPython = (function (IPython) {
         // We may want to move the name/id/nbformat logic inside toJSON?
         var data = this.toJSON();
         data.metadata.name = nbname;
-        data.nbformat = 2;
+        data.nbformat = 3;
         // We do the call with settings so we can set cache to false.
         var settings = {
             processData : false,

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

@@ -34,13 +34,15 @@ var IPython = (function (IPython) {
             {key: 'Ctrl-m d', help: 'delete cell'},
             {key: 'Ctrl-m a', help: 'insert cell above'},
             {key: 'Ctrl-m b', help: 'insert cell below'},
-            {key: 'Ctrl-m t', help: 'toggle output'},
+            {key: 'Ctrl-m o', help: 'toggle output'},
             {key: 'Ctrl-m l', help: 'toggle line numbers'},
             {key: 'Ctrl-m s', help: 'save notebook'},
             {key: 'Ctrl-m j', help: 'move cell down'},
             {key: 'Ctrl-m k', help: 'move cell up'},
             {key: 'Ctrl-m y', help: 'code cell'},
             {key: 'Ctrl-m m', help: 'markdown cell'},
+            {key: 'Ctrl-m t', help: 'plaintext cell'},
+            {key: 'Ctrl-m 1-6', help: 'heading 1-6 cell'},
             {key: 'Ctrl-m p', help: 'select previous'},
             {key: 'Ctrl-m n', help: 'select next'},
             {key: 'Ctrl-m i', help: 'interrupt kernel'},

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

@@ -237,49 +237,109 @@ var IPython = (function (IPython) {
     };
 
 
-    // RSTCell
+    // PlaintextCell
 
-    var RSTCell = function (notebook) {
-        this.placeholder = "Type *ReStructured Text* and LaTeX: $\\alpha^2$";
+    var PlaintextCell = function (notebook) {
+        this.placeholder = "Type plain text and LaTeX: $\\alpha^2$";
+        this.code_mirror_mode = 'rst';
         IPython.TextCell.apply(this, arguments);
-        this.cell_type = 'rst';
+        this.cell_type = 'plaintext';
     };
 
 
-    RSTCell.prototype = new TextCell();
+    PlaintextCell.prototype = new TextCell();
 
 
-    RSTCell.prototype.render = function () {
-        if (this.rendered === false) {
-            var text = this.get_text();
-            if (text === "") { text = this.placeholder; }
-            var settings = {
-                processData : false,
-                cache : false,
-                type : "POST",
-                data : text,
-                headers : {'Content-Type': 'application/x-rst'},
-                success : $.proxy(this.handle_render,this)
-            };
-            $.ajax("/rstservice/render", settings);
-            this.element.find('div.text_cell_input').hide();
-            this.element.find("div.text_cell_render").show();
-            this.set_rendered("Rendering...");
+    PlaintextCell.prototype.render = function () {
+        this.rendered = true;
+        this.edit();
+    };
+
+
+    PlaintextCell.prototype.select = function () {
+        IPython.Cell.prototype.select.apply(this);
+        this.code_mirror.refresh();
+        this.code_mirror.focus();
+    };
+
+
+    PlaintextCell.prototype.at_top = function () {
+        var cursor = this.code_mirror.getCursor();
+        if (cursor.line === 0) {
+            return true;
+        } else {
+            return false;
         }
     };
 
 
-    RSTCell.prototype.handle_render = function (data, status, xhr) {
-        this.set_rendered(data);
-        this.typeset();
-        this.rendered = true;
+    PlaintextCell.prototype.at_bottom = function () {
+        var cursor = this.code_mirror.getCursor();
+        if (cursor.line === (this.code_mirror.lineCount()-1)) {
+            return true;
+        } else {
+            return false;
+        }
     };
 
 
+    // HTMLCell
+
+    var HeadingCell = function (notebook) {
+        this.placeholder = "Type Heading Here";
+        IPython.TextCell.apply(this, arguments);
+        this.cell_type = 'heading';
+        this.level = 1;
+    };
+
+
+    HeadingCell.prototype = new TextCell();
+
+
+    HeadingCell.prototype.set_level = function (level) {
+        this.level = level;
+        if (this.rendered) {
+            this.rendered = false;
+            this.render();
+        };
+    };
+
+
+    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.RSTCell = RSTCell;
+    IPython.PlaintextCell = PlaintextCell;
+    IPython.HeadingCell = HeadingCell;
 
 
     return IPython;

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

@@ -108,6 +108,20 @@ var IPython = (function (IPython) {
                 IPython.notebook.to_code();
             } else if (cell_type === 'markdown')  {
                 IPython.notebook.to_markdown();
+            } else if (cell_type === 'plaintext')  {
+                IPython.notebook.to_plaintext();
+            } 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/frontend/html/notebook/templates/notebook.html

@@ -117,8 +117,15 @@
                 <li id="run_cell_in_place"><a href="#">Run in Place</a></li>
                 <li id="run_all_cells"><a href="#">Run All</a></li>
                 <hr/>
-                <li id="to_code"><a href="#">Code Cell</a></li>
-                <li id="to_markdown"><a href="#">Markdown Cell</a></li>
+                <li id="to_code"><a href="#">Code</a></li>
+                <li id="to_markdown"><a href="#">Markdown </a></li>
+                <li id="to_plaintext"><a href="#">Plaintext</a></li>
+                <li id="to_heading1"><a href="#">Heading 1</a></li>
+                <li id="to_heading2"><a href="#">Heading 2</a></li>
+                <li id="to_heading3"><a href="#">Heading 3</a></li>
+                <li id="to_heading4"><a href="#">Heading 4</a></li>
+                <li id="to_heading5"><a href="#">Heading 5</a></li>
+                <li id="to_heading6"><a href="#">Heading 6</a></li>
                 <hr/>
                 <li id="toggle_output"><a href="#">Toggle Output</a></li>
                 <li id="clear_all_output"><a href="#">Clear All Output</a></li>
@@ -173,6 +180,13 @@
         <select id="cell_type">
              <option value="code">Code</option>
              <option value="markdown">Markdown</option>
+             <option value="plaintext">Plaintext</option>
+             <option value="heading1">Heading 1</option>
+             <option value="heading2">Heading 2</option>
+             <option value="heading3">Heading 3</option>
+             <option value="heading4">Heading 4</option>
+             <option value="heading5">Heading 5</option>
+             <option value="heading6">Heading 6</option>
         </select>
     </span>