Script Functions

User Guide / Generated Content

Prince supports arbitrary JavaScript functions to be called from CSS generated content using the prince-script() function.

CSS

p::after {
    content: prince-script(myfunc)
}

JavaScript

function myfunc()
{
    return "Some generated context text!";
}

Prince.addScriptFunc("myfunc", myfunc);

Accessing the current date and time

JavaScript functions have access to the current date and time, which can be added to the document using prince-script() in generated content.

CSS

@page {
    @top {
	content: prince-script(datestamp)
    }
}

JavaScript

Prince.addScriptFunc("datestamp", function() {
    return (new Date()).toString();
});

User-defined counter styles

The JavaScript functions used with prince-script() can take arguments that are themselves generated content. This allows functions to operate on counter values and implement new counter styles.

CSS

li::marker {
    content: prince-script(mycounterstyle, counter(list-item))
}

JavaScript

Prince.addScriptFunc("mycounterstyle", function(n) {
    if (n == 1) return "one";
    else if (n == 2) return "two";
    else if (n == 3) return "three";
    else return n;
});