Support vertical writing modes

[chocolatkey]

Vertical writing modes (e.g. vertical-rl), primarily of interest for Japanese e-books, are currently not supported and result in breakage of the reader:

On webkit-based engines (Safari), this can be improved through the use of -webkit-column-axis: horizontal, but outside of that, the layout must be significantly altered, along with the functionality of the reflowable document engine. The common trick seems to be hiding the next columns underneath the current one, as used by this Japan-optimized EPUB reader:

@JayPanoz you have done lots of research in this with regards to readium-css, what is your opinion on how to incorporate support into the toolkit?

[JayPanoz]

For the benefit of everyone, the summary of my past research on that topic.

So yeah, these non-standard properties were added into Webkit, it seems specifically so that iBooks – now known as Apple Books – can paginate vertical writing modes properly.

It was strongly recommended we don’t even touch it with a stick when designing pagination in ReadiumCSS as there was no desire nor reason to standardise them in CSS multicol – pagination should be part of a bigger fragmentation spec, not multicol. So we decided not to use a vendor-specific solution, knowing it wouldn’t solve the issue in other rendering engines.

That’s probably why hiding the next columns underneath the current one is what a lot of Reading Systems have been doing – and swiping/taps on the x-axis, etc. are (sometimes) re-mapped on the y-axis. And this indeed is the approach recommended in ReadiumCSS docs due to the limitations of CSS multicol.

That being said, @danielweck switched to his own implementation of pagination/fragmentation for vertical writing for instance, because of significant issues with columns while advancing on support and features quicker than anyone else, so it could also be a good opportunity to see if there’s a possibility to list and fix them.