Merge pull request #30 from alxbl/support-hljs

hljs - Added compatibility for CSS styles.

Author: JLHwung

lib/highlight.js

@@ -5,23 +5,28 @@ var Entities = require('html-entities').XmlEntities;
 var entities = new Entities();
 var alias = require('../highlight_alias.json');
 
-hljs.configure({
-  classPrefix: ''
-});
-
 function highlightUtil(str, options) {
   if (typeof str !== 'string') throw new TypeError('str must be a string!');
   options = options || {};
 
+  var useHljs = options.hasOwnProperty('hljs') ? options.hljs : false;
   var gutter = options.hasOwnProperty('gutter') ? options.gutter : true;
   var wrap = options.hasOwnProperty('wrap') ? options.wrap : true;
   var firstLine = options.hasOwnProperty('firstLine') ? +options.firstLine : 1;
   var caption = options.caption;
   var mark = options.hasOwnProperty('mark') ? options.mark : [];
   var tab = options.tab;
+
+  hljs.configure({ classPrefix: useHljs ? 'hljs-' : ''});
+
   var data = highlight(str, options);
 
-  if (!wrap) return data.value;
+  if (useHljs && !gutter) wrap = false;
+
+  var before = useHljs ? '<pre><code class="hljs ' + options.lang + '">' : '<pre>';
+  var after = useHljs ? '</code></pre>' : '</pre>';
+
+  if (!wrap) return useHljs ? before + data.value + after : data.value;
 
   var lines = data.value.split('\n');
   var numbers = '';
@@ -33,9 +38,7 @@ function highlightUtil(str, options) {
     line = lines[i];
     if (tab) line = replaceTabs(line, tab);
     numbers += '<span class="line">' + (firstLine + i) + '</span><br>';
-    content += '<span class="line';
-    content += (mark.indexOf(firstLine + i) !== -1) ? ' marked' : '';
-    content += '">' + line + '</span><br>';
+    content += formatLine(line, firstLine + i, mark, options);
   }
 
   result += '<figure class="highlight' + (data.language ? ' ' + data.language : '') + '">';
@@ -50,12 +53,26 @@ function highlightUtil(str, options) {
     result += '<td class="gutter"><pre>' + numbers + '</pre></td>';
   }
 
-  result += '<td class="code"><pre>' + content + '</pre></td>';
+  result += '<td class="code">' + before + content + after + '</td>';
   result += '</tr></table></figure>';
 
   return result;
 }
 
+function formatLine(line, lineno, marked, options) {
+  var useHljs = options.hljs || false;
+  var res = useHljs ? '' : '<span class="line';
+  if (marked.indexOf(lineno) !== -1) {
+    // Handle marked lines.
+    res += useHljs ? '<mark>' + line + '</mark>' : ' marked">' + line + '</span>';
+  } else {
+    res += useHljs ? line : '">' + line + '</span>';
+  }
+
+  res += '<br>';
+  return res;
+}
+
 function encodePlainString(str) {
   return entities.encode(str);
 }
@@ -121,6 +138,8 @@ function highlight(str, options) {
     return result;
   }
 
+  if (options.hljs) return hljs.highlight(lang, str);
+
   return tryHighlight(str, result.language) || result;
 }
 

test/scripts/highlight.js

@@ -267,4 +267,37 @@ describe('highlight', function() {
     result.should.include('class="line">and');
     validateHtmlAsync(result, done);
   });
+
+  it('hljs compatibility - with lines', (done) => {
+    var str = [
+      'function (a) {',
+      '    if (a > 3)',
+      '        return true;',
+      '    return false;',
+      '}'
+    ].join('\n');
+    var result = highlight(str, {hljs: true, lang: 'javascript' });
+    result.should.include(gutterStart);
+    result.should.include(codeStart);
+    result.should.include('code class="hljs javascript"');
+    result.should.include('class="hljs-function"');
+    result.should.include(gutter(1, 5));
+    validateHtmlAsync(result, done);
+  });
+
+  it('hljs compatibility - no lines', (done) => {
+    var str = [
+      'function (a) {',
+      '    if (a > 3)',
+      '        return true;',
+      '    return false;',
+      '}'
+    ].join('\n');
+    var result = highlight(str, {hljs: true, gutter: false, lang: 'javascript' });
+    result.should.not.include(gutterStart);
+    result.should.not.include(codeStart);
+    result.should.include('code class="hljs javascript"');
+    result.should.include('class="hljs-function"');
+    validateHtmlAsync(result, done);
+  });
 });