From c7b1ec5c164f6684fb01ff640f490cea296fdd06 Mon Sep 17 00:00:00 2001
From: Jeremy Elbourn <jelbourn@gmail.com>
Date: Thu, 22 Dec 2016 00:58:48 -0800
Subject: [PATCH] chore: add syntax highlighting to generated overview docs
 (#2333)

---
 package.json             |  1 +
 tools/gulp/tasks/docs.ts | 21 +++++++++++++--------
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index 7aecd87d129..2ca6dc9de03 100644
--- a/package.json
+++ b/package.json
@@ -79,6 +79,7 @@
     "gulp-sourcemaps": "^1.6.0",
     "gulp-transform": "^1.1.0",
     "gulp-typescript": "^2.13.6",
+    "highlight.js": "^9.9.0",
     "jasmine-core": "^2.4.1",
     "karma": "^1.1.1",
     "karma-browserstack-launcher": "^1.0.1",
diff --git a/tools/gulp/tasks/docs.ts b/tools/gulp/tasks/docs.ts
index e368809585e..09531eba108 100644
--- a/tools/gulp/tasks/docs.ts
+++ b/tools/gulp/tasks/docs.ts
@@ -1,16 +1,10 @@
 import gulp = require('gulp');
 const markdown = require('gulp-markdown');
 const transform = require('gulp-transform');
+const hljs = require('highlight.js');
 import {task} from 'gulp';
 import * as path from 'path';
 
-import {SOURCE_ROOT, PROJECT_ROOT} from '../constants';
-import {
-    execNodeTask
-} from '../task_helpers';
-
-const typedocPath = path.relative(PROJECT_ROOT, path.join(SOURCE_ROOT, 'lib/typedoc.json'));
-
 // Our docs contain comments of the form `<!-- example(...) -->` which serve as placeholders where
 // example code should be inserted. We replace these comments with divs that have a
 // `material-docs-example` attribute which can be used to locate the divs and initialize the example
@@ -19,7 +13,18 @@ const EXAMPLE_PATTERN = /<!--\W*example\(([^)]+)\)\W*-->/g;
 
 gulp.task('docs', () => {
   return gulp.src(['src/lib/**/*.md'])
-      .pipe(markdown())
+      .pipe(markdown({
+        // Add syntax highlight using highlight.js
+        highlight: (code: string, language: string) => {
+          if (language) {
+            // highlight.js expects "typescript" written out, while Github supports "ts".
+            let lang = language.toLowerCase() === 'ts' ? 'typescript' : language;
+            return hljs.highlight(lang, code).value;
+          }
+
+          return code;
+        }
+      }))
       .pipe(transform((content: string) =>
           content.toString().replace(EXAMPLE_PATTERN, (match: string, name: string) =>
               `<div material-docs-example="${name}"></div>`)))