Extending Syntax Highlighter

Setup Development Environment

The syntax highlighter service is a part of the mindtouch.deki.services project.  In order to modify it, you'll need to check out the Deki source code and compile it with VisualStudio or Mono.

The are instructions on configuring a dev environment with a Deki VM + Windows box here:  How do I...Setup an API Development Environment?

If you're using Deki 8.08.1, get the lastest code from our 8.08 branch:  https://svn.mintouch.com/source/public/dekiwiki/8.08

Create a Brush

Syntaxhighlighter uses  "Brushes" to determine how to highlight each language.  Each brush is a javascript file that defines the types and reserved words for a language.  To add a brush, open the Deki solution in Visual Studio and open the mindtouch.deki.services project.  Then create a new brush in the Resources/ folder.

shBrushDekiscript.js

dp.sh.Brushes.Dekiscript=function()
{
    var datatypes='nil bool num str map list true false';
    var keywords='if else foreach var let switch case default break continue typeof in null';

    this.regexList=[{regex:dp.sh.RegexLib.SingleLineCComments,css:'comment'},
                    {regex:dp.sh.RegexLib.MultiLineCComments,css:'comment'},
                    {regex:dp.sh.RegexLib.DoubleQuotedString,css:'string'},
                    {regex:dp.sh.RegexLib.SingleQuotedString,css:'string'},
                    {regex:new RegExp(this.GetKeywords(datatypes),'gm'),css:'datatypes'},
                    {regex:new RegExp(this.GetKeywords(keywords),'gm'),css:'keyword'}];
    
    this.CssClass='dp-dekiscript';this.Style='.dp-dekiscript .datatypes { color: #2E8B57; font-weight: bold; }';
}

dp.sh.Brushes.Dekiscript.prototype=new dp.sh.Highlighter();
dp.sh.Brushes.Dekiscript.Aliases=['dekiscript','script'];

We actually embed all of the Brush javascript files into the mindtouch.deki.services.dll as embedded resoures.  To do this, right-click on the shBrushDekiscript.js file and choose Properties.  Then set the Build Action to Embedded Resource.

Create Deki Extension Function

Now we need to edit the Extensions/SyntaxServices.cs file to enable the new brush. 

First, let's add the shBrushDekiscript.js file to the list of library files for the service:

[DekiExtLibraryFiles(Prefix = "MindTouch.Deki.Services.Resources", Filenames = new string[] { 
        "shCore.js", "shBrushDekiscript.js", "shBrushCpp.js", "shBrushCSharp.js", "shBrushCss.js", "shBrushDelphi.js", "shBrushJava.js", "shBrushJScript.js", "shBrushPerl.js", 
        "shBrushPhp.js", "shBrushPython.js", "shBrushRuby.js", "shBrushShell.js", "shBrushSql.js", "shBrushVb.js", "shBrushXml.js", "SyntaxHighlighter.css"
    })]

Next, we need to add the extension function so the Syntax service has a feature named Dekiscript.  Add a function like this to SyntaxService.cs

[DekiExtFunction(Description = "Highlight DekiScript syntax", Transform = "pre")]
public XDoc DekiScript (
    [DekiExtParam("source code to highlight")] string code,
    [DekiExtParam("collapse code view (default: false)", true)] bool? collapse,
    [DekiExtParam("first line number (default: 1)", true)] int? firstline
) {
    return Format(code, "Dekiscript", "dekiscript", collapse, firstline);
}

Finally, compile the project (or solution), deploy the mindtouch.deki.services.dll to your wiki, and restart the dekiwiki process.  You should now be able to highlight dekiscript code by doing:

{{ syntax.Dekiscript("let x = 1") }}