Use custom markdown renderer to implement external links

Author: jasongrout

jupyter_notebook/static/phosphor-notebook/src/NotebookComponent.ts

@@ -62,24 +62,52 @@ export var JupyterError = createFactory(JupyterErrorComponent)
 var renderer = new (<any>marked).Renderer();
 renderer.heading = function (text: string, level: number) {
   var escapedText = text.toLowerCase().replace(/[^\w]+/g, '-');
-  return '<h' + level + '><a name="' +
-                escapedText +
-                 '" class="anchor" href="#' +
-                 escapedText +
-                 '"><span class="header-link"></span></a>' +
-                  text + '</h' + level + '>';
+  return `<h${level} id="${escapedText}">${text}<a class="anchor-link" href="#${escapedText}">¶</a></h${level}>`;
 }
-// TODO: make links open new tabs
-// links in markdown cells should open in new tabs
-// html.find("a[href]").not('[href^="#"]').attr("target", "_blank");
 
+renderer.unescape = function(html: string): string {
+  // from https://github.com/chjj/marked/blob/2b5802f258c5e23e48366f2377fbb4c807f47658/lib/marked.js#L1085
+  return html.replace(/&([#\w]+);/g, function(_, n) {
+    n = n.toLowerCase();
+    if (n === 'colon') return ':';
+    if (n.charAt(0) === '#') {
+      return n.charAt(1) === 'x'
+        ? String.fromCharCode(parseInt(n.substring(2), 16))
+        : String.fromCharCode(+n.substring(1));
+    }
+    return '';
+  });
+}
+
+renderer.check_url = function(href: string): boolean {
+    try {
+        var prot = decodeURIComponent(this.unescape(href))
+            .replace(/[^\w:]/g, '')
+            .toLowerCase();
+    } catch (e) {
+        return false;
+    }
+    if (prot.indexOf('javascript:') === 0 || prot.indexOf('vbscript:') === 0) {
+        return false;
+    }
+    return true;
+};
+
+renderer.link = function(href: string, title: string, text: string) {
+    //modified from the mark.js source to open all urls in new tabs
+    if (this.options.sanitize && !this.check_url(href)) {
+        return '';
+    }
+    return `<a href="${href}" ${title ? `title="${title}"` : ""} ${href[0] !== "#" ? "target=_blank" : ""}>${text}</a>`;
+};
 
 class MarkdownCellComponent extends BaseComponent<nbformat.MarkdownCell> {
   onUpdateRequest(msg: IMessage): void {
     // replace the innerHTML of the node with the rendered markdown
     var t = mathjaxutils.remove_math(this.data.source);
-    marked(t.html, { sanitize: true }, (err: any, html: string) => {
+    marked(t.html, { sanitize: true, renderer: renderer}, (err: any, html: string) => {
         this.node.innerHTML = mathjaxutils.replace_math(html, t.math);
+        // TODO: do some serious sanitization, using, for example, the caja sanitizer
         MathJax.Hub.Queue(["Typeset", MathJax.Hub, this.node]);
     });
   }