Merge pull request dart-lang/markdown#148 from dart-lang/highlight_code_in_example

Enable code highlighting in example

pkgs/markdown/.travis.yml

diff --git a/pkgs/markdown/.travis.yml b/pkgs/markdown/.travis.yml
index b115726..5ab0e56 100644
--- a/pkgs/markdown/.travis.yml
+++ b/pkgs/markdown/.travis.yml
@@ -3,6 +3,7 @@
 dart:
   - stable
   - dev
-  - 1.18.1
-  - 1.17.1
+  - 1.21.0
+  - 1.20.1
+  - 1.19.1
 script: tool/travis.sh

pkgs/markdown/example/app.dart

diff --git a/pkgs/markdown/example/app.dart b/pkgs/markdown/example/app.dart
index 1e005b1..1af874b 100644
--- a/pkgs/markdown/example/app.dart
+++ b/pkgs/markdown/example/app.dart
@@ -2,6 +2,8 @@
 import 'dart:html';
 import 'package:markdown/markdown.dart' as md;
 
+import 'highlight.dart';
+
 final markdownInput = querySelector('#markdown') as TextAreaElement;
 final htmlDiv = querySelector('#html') as DivElement;
 final versionSpan = querySelector('.version') as SpanElement;
@@ -55,8 +57,19 @@
 
 void _renderMarkdown([Event event]) {
   var markdown = markdownInput.value;
+
   htmlDiv.setInnerHtml(md.markdownToHtml(markdown, extensionSet: extensionSet),
       treeSanitizer: nullSanitizer);
+
+  for (var block in htmlDiv.querySelectorAll('pre code')) {
+    try {
+      highlightBlock(block);
+    } catch (e) {
+      window.console.error('Error highlighting markdown:');
+      window.console.error(e);
+    }
+  }
+
   if (event != null) {
     // Not simulated typing. Store it.
     window.localStorage['markdown'] = markdown;

pkgs/markdown/example/favicon.ico

diff --git a/pkgs/markdown/example/favicon.ico b/pkgs/markdown/example/favicon.ico
new file mode 100644
index 0000000..7ba349b
--- /dev/null
+++ b/pkgs/markdown/example/favicon.ico
Binary files differ

pkgs/markdown/example/highlight.dart

diff --git a/pkgs/markdown/example/highlight.dart b/pkgs/markdown/example/highlight.dart
new file mode 100644
index 0000000..be62357
--- /dev/null
+++ b/pkgs/markdown/example/highlight.dart
@@ -0,0 +1,7 @@
+@JS('hljs')
+library hljs;
+
+import "package:js/js.dart";
+
+@JS()
+external void highlightBlock(block);

pkgs/markdown/example/index.html

diff --git a/pkgs/markdown/example/index.html b/pkgs/markdown/example/index.html
index 078c0ad..fe8aab1 100644
--- a/pkgs/markdown/example/index.html
+++ b/pkgs/markdown/example/index.html
@@ -4,6 +4,9 @@
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,500,700,400italic">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400">
     <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons+Extended">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/styles/default.min.css">
+    <script defer src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/highlight.min.js"></script>
+    <script defer src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/languages/dart.min.js"></script>
     <script type="application/dart" src="app.dart"></script>
     <script src="packages/browser/dart.js"></script>
     <title>Dart Markdown Live Editor</title>

pkgs/markdown/pubspec.yaml

diff --git a/pkgs/markdown/pubspec.yaml b/pkgs/markdown/pubspec.yaml
index e357874..3dcc61d 100644
--- a/pkgs/markdown/pubspec.yaml
+++ b/pkgs/markdown/pubspec.yaml
@@ -11,6 +11,7 @@
   browser: any
   collection: ^1.2.0
   html: '>=0.12.2 <0.14.0'
+  js: '^0.6.1'
   path: '^1.3.1'
   test: '^0.12.4+1'
   yaml: '^2.1.8'