Tuesday, June 2, 2009

SyntaxHighlighter For Clojure

I'm really surprised that Blogger doesn't include a solution for syntax highlighting as it hosts a ton of blogs related to programming. Fortunately, there are plenty of third party solutions out there. I've settled on SyntaxHighlighter, and while it's not perfect, it does a good enough job. With Clojure being as new as it is, SyntaxHighlighter doesn't include a brush file for the language. This should change in the future since I have submitted a brush to the author and have been informed that it will be included in the next release. In the meantime, here's the file which provides highlighting support for a good number of common functions.
SyntaxHighlighter.brushes.Clojure = function()
{
  // Contributed by Travis Whitton

  var funcs = ':arglists :doc :file :line :macro :name :ns :private :tag :test new alias alter ' +
              'and apply assert class cond conj count def defmacro defn defstruct deref do '     +
              'doall dorun doseq dosync eval filter finally find first fn gen-class gensym if '  +
              'import inc keys let list loop map ns or print println quote rand recur reduce '   +
              'ref repeat require rest send seq set sort str struct sync take test throw '       +
              'trampoline try type use var vec when while';

  this.regexList = [
          { regex: new RegExp(';.*$', 'gm'),                               css: 'comments' },
          { regex: SyntaxHighlighter.regexLib.multiLineDoubleQuotedString, css: 'string' },
          { regex: /\[|\]/g,                                               css: 'keyword' },
          { regex: /'[a-z][A-Za-z0-9_\-]*/g,                               css: 'color1' }, // symbols
          { regex: /:[a-z][A-Za-z0-9_\-]*/g,                               css: 'color2' }, // keywords
          { regex: new RegExp(this.getKeywords(funcs), 'gmi'),             css: 'functions' }
      ];

  this.forHtmlScript(SyntaxHighlighter.regexLib.aspScriptTags);
}

SyntaxHighlighter.brushes.Clojure.prototype     = new SyntaxHighlighter.Highlighter(); 
SyntaxHighlighter.brushes.Clojure.aliases       = ['clojure', 'Clojure', 'clj'];

13 comments:

  1. Image

    Thanks for your work on this!

    Hope you don't mind that I added your code as a downloadable syntax file to my compiled list of SH Brushes, of course with credits to you :)

    If you have updates of the code, please let me know and I'll update my references too

    ReplyDelete
  2. Image

    I found a small bug with your brush - keywords with dashes aren't fully colored. Just add a dash to the pattern:

    { regex: /:[a-z][A-Za-z0-9_\-]*/g, ...

    Might be applicable to the preceding line, too.

    ReplyDelete
  3. Image

    Hmm, another bug. Are you sure the comment highlighting was working for you? This should do the trick:

    { regex: /;.*$/gm, css: 'comments' },

    ReplyDelete
  4. Image

    Made corrections based on suggestions above. Thanks guys!

    ReplyDelete
  5. Image

    I found a small bug with your brush - keywords with dashes aren't fully colored. Just add a dash to the pattern:

    ReplyDelete
  6. Image
  7. Image

    I'm really surprised that Blogger doesn't include a solution for syntax highlighting as it hosts a ton of blogs related to programming

    ReplyDelete
  8. Image

    Comments are still not showing up. Not really sure why.

    ReplyDelete
  9. Image

    Thanks for writing this, it's really appreciated. I started using it on my blog and I noticed comments are not highligted as comments, so I'd like to make that feature request. You can check out how they look now here: http://pupeno.com/2011/08/12/the-joyful-clojure-example-code-convention/

    ReplyDelete
  10. Image

    I created a git repository in GitHub for this brush, so there's a single canonical place for it to receive and track bug requests as well as the improvements, pull requests, etc:

    https://github.com/pupeno/clojure_brush

    I also did some fixes, so the code looks quite differently.

    ReplyDelete
  11. Image

    Hi there, I found your blog by the use of Google whilst searching for a comparable topic, your website came up, it seems to be good. I’ve bookmarked it in my google bookmarks.
    website design

    ReplyDelete
  12. Image
  13. Image

    Grateful to check out your website, I seem to be ahead to more excellent sites and I wish that you wrote more informative post for us. Well done work.

    ReplyDelete