Implement auto-layout for reflowable EPUB

[JayPanoz]

With version 2 of ReadiumCSS, implementers are losing the responsive layout that can be mapped to the auto value in user-settings (typically with 1 column or 2 columns as the two other values for this setting).

As researched, developed, and tested in Readium Playground, such an “auto-layout mode” can be tied to a minimal and an optimal line-lengths (as a number of characters, based on the ch length), with the number of columns being determined from these 2 values.

The experimental implementation in Playground is relying on a canvas and measureText to compute these line-lengths depending on the font-family used, a sample of text (e.g. paragraph of content, description in metadata, etc.), letter-spacing and word-spacing, the padding/gap of the page, etc. Then it will check how many optimal line-lengths the current window can host.

Caveats are:

• word-spacing needs a text-sample to approximate the average of spaces per line;
• letter-spacing and word-spacing are not implemented for canvas in Safari at the moment;
• neither are writing-mode and text-orientation so there’s no support for CJK out of the box.

These two last issues can be solved using the same technique though (by rendering character per character, with an offset).

[chocolatkey]

@JayPanoz would the path forwards for you be to port your implementation in the playground to the ts-toolkit?

[JayPanoz]

@chocolatkey I guess so, although there’s some overlap with #75 at first sight. We should probably address some things in common e.g. breakpoint if that happens to be supported for a full-fledged “auto-layout” for FXL.