Automatic multi-page multi-column flowing text with QtWebkit (HTML/CSS/JS -> PDF)

Question

I have some HTML documents that are converted to PDF, using software that renders using QtWebkit (not sure which version).

Currently, the documents have specific tags to split into columns and pages - so whenever the wording changes, it is a manual time-consuming process to move these tags so that the columns and pages fit.

Can anyone provide a way to have text auto-wrapped into the next column/page (as appropriate) when it reaches the bottom of the current container?

Any HTML, CSS or JS supported by QtWebkit is ok (assuming it works in the PDF converter).

(I have tested the webkit-column-* in CSS3 and it appears QtWebkit does not support this.)

To make things more exciting, it also needs to:
- put a header at the top of each page, with page X of Y numbering;
- if an odd number of pages, add a blank page at the end (with no header);
- have the ability to say "don't break inside this block" or "don't break after this header"

I have put some quick example initial markup and target markup to help explain what I'm trying to do.

(The actual documents are far more complicated than that, but I need a simple proof-of-concept before I attack the real ones.)

Any suggestions?

---

Update:
I've got a partially working solution using Aaron's "filling up" suggestion - I'll post more details in a bit.

Answer 1

Create a document with a single page and all the text in a single column. Use JavaScript to cut the text into parts.

Use pixel coordinates to locate the paragraph/element that doesn't fit anymore. Move it and everything below to the next col. If a "page" already has two "col" divs, start a new page.

After all pages have been created, count and number the pages. Fix even/odd stuff, etc.

Will take some time but it's automatic.

Another approach would be to add all the content to a "source" div and move items to the col div until it's full and repeat with the next col.

Have a look at Prototype or jQuery; they should give you lots of tools to move stuff around in the document.

[EDIT] Instead of only relying on jQuery functions, I suggest to create one or two objects which keep track of the current page and the current column, etc. These give you stable foundations to stand on from which you can fire the helper methods.

Answer 2

I'd need the exact same thing for a personnal project (an epub reader). Any news on that "filling up method" ?