Prince 8 adds support for JavaScript which can — using the DOM — manipulate the content of the document. One example is the table of contents, which can be generated dynamically by a small script that (a) scans the documents for chapter headings, (b) generates a list with elements pointing to the chapter headings, and (c) inserts the list at the start of the document. To show of this new feature, we have Oliver Twist
— a classic literary work with lots of chapters — and added a small JavaScript along with a CSS snippet. Here’s the HTML source file and the resulting PDF file.
Could you please share the Javascript code?
Comment by Andreas Jung — 2011-03-23 @ 10:11
You can find the Javascript code in the HTML source file, inside the
Comment by howcome — 2011-03-23 @ 10:37
Great work! I have two questions:
1) All chapter headings come out as “Chapter 1″: something wrong with the chapter counter?
2) I’m trying to reproduce your example by splitting it up into different chunks (my ultimate aim is to replace these chunks by URLs and be able to “print on demand” portions of a website with an automatically generated TOC). I use xinclude directives in a wrapper XML file to include the [UTF-8 version of the] different chunks (say, oliver-toc.html, oliver-1.html, oliver-2.html,…) after putting the CSS and JS into two separate files (of course I need to remove the onload attribute from the body tag and add window.onload = maketoc at the end of the JS file). I then call prince like so:
prince -s oliver.css –script=oliver.js oliver-wrapper.xml -o oliver-twist.pdf
To my greatest amazement, this almost works!
The TOC gets generated with the correct link texts and page references, but inactive links.
Any advice on this would be greatly appreciated.
Comment by Infarinato — 2011-05-10 @ 13:13
Thanks for spotting, and reporting, the counter problem in chapters. Fixed.
Your other use case in interesting, but hard to debug from a distance. I suggest you post your problem — with links to your files — to the princexml forum.
Comment by howcome — 2011-05-10 @ 13:33
1) Thanks, but I think you forgot to upload the updated version of the HTML file.
2) Done: http://www.princexml.com/bb/viewtopic.php?f=4&t=4796.
Many thanks.
Comment by Infarinato — 2011-05-10 @ 15:00
[...] know that a table of contents can be created in Javascript, but what about an index? Can JavaScript be used to automatically generate an index, like those [...]
Pingback by Creating an index in JavaScript « printing css — 2011-06-14 @ 12:23
The “Contents” page appears to be blank in the PDF example… am I missing something here?
I’m also trying to do a javascript TOC with Prince 8, and though it works on the webpage (like yours does), the generated content does not appear in the Prince PDF. One of the warnings I get in the terminal, which I suspect is related, is “warning: innerHTML is not yet supported”.
Any idea what’s going on? The Oliver Twist PDF I’m looking at is http://www.princexml.com/howcome/2011/oliver-twist/oliver-twist.pdf
Comment by Fan — 2011-11-17 @ 18:35
I forgot to turn on ‘–javascript’ when running Prince. Fixed. Thanks for reporting.
Comment by howcome — 2011-11-20 @ 08:42