blog rss feed

Syntax Highlighter javascript library looks great.

Author: Dave Cherry last modified
Keywords: web javascript internet

I've just been looking at the syntax highlighter javascript library; what I've seen so far looks great. Prior to using this library, I had been using a plugin to IntelliJ called CopyToHtml that took the code as formatted in the source window and generated a HTML view of it.

This had its disadvantages, not least of which was that if somebody wanted to see the source unformatted, it was basically impossible. Also, in the latest releases of IDEA it does not seem to get all the styles right.

Anyway, moving forwards, I will move even the old content over to use the syntax highlighter, one at a time.

Using syntax highlighter with Grails

Unfortunately, the syntax-highlighter plugin for Grails failed to install into the coders corner application. After looking at the possibilities I decided not to use the plugin because setup and configuration is so easy.

If you make the same choices as me, here's one way to get up and running quick.

Download the latest version of the syntax highlighter.

Unpack the syntax highlighter files you've downloaded into the projects webapp folder into a subfolder called syntax ( such that under syntax is src, scripts and styles ).

Create this tag library in grailsapp/taglib directory.

Name: SyntaxHighligherTagLib.groovy



public class SyntaxHighlighterTagLib {
    static namespace = 'syntax'

    def includeSyntax = {
        out << "<link rel=\"stylesheet\" type=\"text/css\" href='${resource(dir:'/syntax/styles/shCore.css')}'/>\n"
        out << "<link rel=\"stylesheet\" type=\"text/css\" href='${resource(dir:'/syntax/styles/shThemeEclipse.css')}'/>\n"
        out << "<script type=\"text/javascript\" src='${resource(dir:'/syntax/src/shCore.js')}'></script>\n"
        out << "<script type=\"text/javascript\" src='${resource(dir:'/syntax/scripts/shBrushJava.js')}'></script>\n"
        out << "<script type=\"text/javascript\" src='${resource(dir:'/syntax/scripts/shBrushGroovy.js')}'></script>\n"
        out << "<script type=\"text/javascript\" src='${resource(dir:'/syntax/scripts/shBrushCss.js')}'></script>\n"
        out << "<script type=\"text/javascript\" src='${resource(dir:'/syntax/scripts/shBrushXml.js')}'></script>\n"
        out << "<script type=\"text/javascript\">\n"
        out << "  SyntaxHighlighter.all();\n"
        out << "  dp.SyntaxHighlighter.HighlightAll();\n"
        out << "</script>"
    }

    def format = { attrs, body ->
        out << "<pre class=\"brush: " + attrs.lang + "\">\n"
        out << body();
        out << "</pre>"
    }
}

Example using syntax highlighter tag library from within GSP

  <syntax:format lang="java">
    public void thisIsSomeTestCode() {
        System.out.println("test if it works");
    } </syntax:format>

  <syntax:includeSyntax/>

Please leave a comment



Search

Blog calendar

blog: previous month September 2010 blog: next month
su mo tu we th fr sa
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30