Report an issue
Class

CKEDITOR.plugins.codesnippet.highlighter

class since 4.4.0

A Code Snippet highlighter. It can be set as a default highlighter using CKEDITOR.plugins.codesnippet.setHighlighter, for example:

// Create a new plugin which registers a custom code highlighter
// based on customEngine in order to replace the one that comes
// with the Code Snippet plugin.
CKEDITOR.plugins.add( 'myCustomHighlighter', {
    afterInit: function( editor ) {
        // Create a new instance of the highlighter.
        var myHighlighter = new CKEDITOR.plugins.codesnippet.highlighter( {
            init: function( ready ) {
                // Asynchronous code to load resources and libraries for customEngine.
                customEngine.loadResources( function() {
                    // Let the editor know that everything is ready.
                    ready();
                } );
            },
            highlighter: function( code, language, callback ) {
                // Let the customEngine highlight the code.
                customEngine.highlight( code, language, function() {
                    callback( highlightedCode );
                } );
            }
        } );

        // Check how it performs.
        myHighlighter.highlight( 'foo()', 'javascript', function( highlightedCode ) {
            console.log( highlightedCode ); // -> <span class="pretty">foo()</span>
        } );

        // From now on, myHighlighter will be used as a Code Snippet
        // highlighter, overwriting the default engine.
        editor.plugins.codesnippet.setHighlighter( myHighlighter );
    }
} );

Filtering

Properties

  • highlighter : Function

    A function which highlights given plain text code in a given language and, once done, calls the callback function with highlighted markup as an argument.

    Parameters

    code : String

    Code to be formatted.

    lang : String

    Language to be used (CKEDITOR.config.codeSnippet_languages).

    callback : Function

    Function which accepts highlighted String as an argument.

  • init : Function

    If specified, this function should asynchronously load highlighter-specific resources and execute ready when the highlighter is ready.

    Parameters

    ready : Function

    The function to be called once the highlighter is ready.

  • languages : Object

    Defines languages supported by the highlighter. They can be restricted with the CKEDITOR.config.codeSnippet_languages configuration option.

    Note: If CKEDITOR.config.codeSnippet_languages is set, it will overwrite the languages listed in languages.

    languages: {
        coffeescript: 'CoffeeScript',
        cpp: 'C++',
        cs: 'C#',
        css: 'CSS'
    }
    

    More information on how to change the list of languages is available in the Code Snippet documentation.

  • readonly

    queue : Array

    A queue of highlight jobs to be done once the highlighter is ready.

    Defaults to []

  • readonly

    ready : Boolean

    A flag which indicates whether the highlighter is ready to do jobs from the queue.

Methods

  • highlight( code, lang, callback )

    Executes the highlighter. If the highlighter is not ready, it defers the job (queue) and executes it when the highlighter is ready.

    Parameters

    code : String

    Code to be formatted.

    lang : String

    Language to be used (CKEDITOR.config.codeSnippet_languages).

    callback : Function

    Function which accepts highlighted String as an argument.

  • since 4.4.0 inherited

    setHighlighter( highlighter )

    Sets the custom syntax highlighter. See CKEDITOR.plugins.codesnippet.highlighter to learn how to register a custom highlighter.

    Note:

    • This method can only be called while initialising plugins (in one of the three callbacks).
    • This method is accessible through the editor.plugins.codesnippet namespace only.

    Parameters

    highlighter : highlighter