DevTools: [Documentation] Add syntax highlight for code examples

Source/devtools/front_end/documentation/DocumentationView.js

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @extends {WebInspector.View}
  */
 WebInspector.DocumentationView = function()
 {
     WebInspector.View.call(this);
     this.element.classList.add("documentation-view");
     this.registerRequiredCSS("documentationView.css");
 }
 
 /**
  * @param {string} url
  * @param {string} searchItem
  */
 WebInspector.DocumentationView.showDocumentationURL = function(url, searchItem)
 {
     if (!WebInspector.DocumentationView._view)
         WebInspector.DocumentationView._view = new WebInspector.DocumentationView();
     var view = WebInspector.DocumentationView._view;
     view.element.removeChildren();
     WebInspector.inspectorView.showCloseableViewInDrawer("documentation", WebInspector.UIString("Documentation"), view);
     view._revealTermDocument(url, searchItem);
 }
 
+WebInspector.DocumentationView._languageToMimeType = {
+    "JavaScript": "text/javascript",
+    "HTML": "text/html"
+}

[lushnikov, 2014/09/03 15:10:25]

semicolon

[semeny, 2014/09/03 15:34:27]

Done.

+
 WebInspector.DocumentationView.prototype = {
     /**
      * @param {string} url
      * @param {string} searchItem
      */
     _revealTermDocument: function(url, searchItem)
     {
         if (!url) {
             this._createEmptyPage();
             return;
@@ skipping 161 matching lines @@
             var exampleDescription = example.createChild("div", "documentation-example-description-section");
             if (examples[i].liveUrl) {
                 var liveUrl = exampleDescription.createChild("a", "documentation-example-link");
                 liveUrl.href = examples[i].liveUrl;
                 liveUrl.textContent = WebInspector.UIString("Example");
             }
             exampleDescription.appendChild(this._renderBlock(examples[i].description));
             var code = example.createChild("div", "documentation-example-code");
             code.classList.add("source-code");
             code.textContent = examples[i].code;
+            var syntaxHighlighter = new WebInspector.DOMSyntaxHighlighter(WebInspector.DocumentationView._languageToMimeType[examples[i].language], true);

[lushnikov, 2014/09/03 15:10:25]

what if they pass JAVASCRIPT in there? this gonna fail.

Also, what if there's no language?

[semeny, 2014/09/03 15:34:27]

Done.

+            syntaxHighlighter.syntaxHighlightNode(code);
         }
     },
 
     /**
      * @param {!WebInspector.WikiParser.ArticleElement} article
      * @return {?Element}
      */
     _renderBlock: function(article)
     {
         var element;
@@ skipping 97 matching lines @@
         function computeDescriptors(column)
         {
             var token = textEditor.tokenAtTextPosition(textSelection.startLine, column);
             if (!token)
                 return [];
             var tokenText = textEditor.line(textSelection.startLine).substring(token.startColumn, token.endColumn);
             return urlProvider.itemDescriptors(tokenText);
         }
     }
 }