Merge pull request #3601 from minrk/headingmath2

Markdown in heading cells (take 2)

closes #3053
closes #3597

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

@@ -27,7 +27,7 @@ var IPython = (function (IPython) {
      *
      * @class TextCell
      * @constructor TextCell
-     * @extend Ipython.Cell
+     * @extend IPython.Cell
      * @param {object|undefined} [options]
      *      @param [options.cm_config] {object} config to pass to CodeMirror, will extend/overwrite default config
      *      @param [options.placeholder] {string} default string to use when souce in empty for rendering (only use in some TextCell subclass)
@@ -285,7 +285,7 @@ var IPython = (function (IPython) {
     /**
      * @class MarkdownCell
      * @constructor MarkdownCell
-     * @extends Ipython.HtmlCell
+     * @extends IPython.HTMLCell
      */
     var MarkdownCell = function (options) {
         var options = options || {};
@@ -342,7 +342,7 @@ var IPython = (function (IPython) {
     /**
      * @class RawCell
      * @constructor RawCell
-     * @extends Ipython.TextCell
+     * @extends IPython.TextCell
      */
     var RawCell = function (options) {
 
@@ -437,12 +437,12 @@ var IPython = (function (IPython) {
 
     /**
      * @class HeadingCell
-     * @extends Ipython.TextCell
+     * @extends IPython.TextCell
      */
 
     /**
      * @constructor HeadingCell
-     * @extends Ipython.TextCell
+     * @extends IPython.TextCell
      */
     var HeadingCell = function (options) {
 
@@ -501,24 +501,8 @@ var IPython = (function (IPython) {
     };
 
 
-    HeadingCell.prototype.set_rendered = function (text) {
-        var r = this.element.find("div.text_cell_render");
-        r.empty();
-        var link = text.replace(/ /g, '_');
-        r.append(
-            $('<h'+this.level+'/>')
-            .append(
-            $('<a/>')
-                .addClass('heading-anchor')
-                .attr('id', link)
-                .html(text)
-            ).append(
-            $('<a/>')
-                .addClass('anchor-link')
-                .attr('href', '#' + link)
-                .text('¶')
-            )
-        );
+    HeadingCell.prototype.set_rendered = function (html) {
+        this.element.find("div.text_cell_render").html(html);
     };
 
 
@@ -531,8 +515,24 @@ var IPython = (function (IPython) {
     HeadingCell.prototype.render = function () {
         if (this.rendered === false) {
             var text = this.get_text();
+            // Markdown headings must be a single line
+            text = text.replace(/\n/g, ' ');
             if (text === "") { text = this.placeholder; }
-            this.set_rendered(text);
+            text = Array(this.level + 1).join("#") + " " + text;
+            text = IPython.mathjaxutils.remove_math(text);
+            var html = marked.parser(marked.lexer(text));
+            var h = $(IPython.mathjaxutils.replace_math(html));
+            // add id and linkback anchor
+            var hash = h.text().replace(/ /g, '-');
+            h.attr('id', hash);
+            h.append(
+                $('<a/>')
+                    .addClass('anchor-link')
+                    .attr('href', '#' + hash)
+                    .text('¶')
+            );
+            
+            this.set_rendered(h);
             this.typeset();
             this.element.find('div.text_cell_input').hide();
             this.element.find("div.text_cell_render").show();

IPython/html/static/notebook/less/textcell.less

@@ -19,11 +19,6 @@ div.text_cell_render {
     color: @textColor;
 }
 
-a.heading-anchor {
-  text-decoration: none;
-  color: inherit;
-}
-
 a.anchor-link:link {
   text-decoration: none;
   padding: 0px 20px;

IPython/html/static/style/style.min.css

@@ -1559,7 +1559,6 @@ span#checkpoint_status,span#autosave_status{font-size:small;}
 @media (max-width:767px){span#save_widget{font-size:small;} span#checkpoint_status,span#autosave_status{font-size:x-small;}}@media (max-width:767px){span#checkpoint_status,span#autosave_status{display:none;}}@media (min-width:768px) and (max-width:979px){span#checkpoint_status{display:none;} span#autosave_status{font-size:x-small;}}div.text_cell{padding:5px 5px 5px 5px;}
 div.text_cell_input{color:#000000;border:1px solid #cfcfcf;border-radius:4px;background:#f7f7f7;}
 div.text_cell_render{outline:none;resize:none;width:inherit;border-style:none;padding:5px;color:#000000;}
-a.heading-anchor{text-decoration:none;color:inherit;}
 a.anchor-link:link{text-decoration:none;padding:0px 20px;visibility:hidden;}
 h1:hover .anchor-link,h2:hover .anchor-link,h3:hover .anchor-link,h4:hover .anchor-link,h5:hover .anchor-link,h6:hover .anchor-link{visibility:visible;}
 .toolbar{padding:0px 10px;margin-top:-5px;}.toolbar select,.toolbar label{width:auto;height:26px;vertical-align:middle;margin-right:2px;margin-bottom:0px;display:inline;font-size:92%;margin-left:0.3em;margin-right:0.3em;padding:0px;padding-top:3px;}