Pagination using Hydrogen Sulfide 🧫

Pagination using Hydrogen Sulfide 🧫

  • bookiza
  • 2 minutes
  • July 15, 2019

Have a long scroll that you need to paginate into a Superbook?

Meet h2s, an intelligent paginator that chops a long inaccesible scroll down into a symmetrical—Superbook compatible—paginated stack (codex). 😉

Hydrogen Sulfide or h2s is a CLI tool written in plain javascript to chop down very, and we mean very, long HTML scrolls into formattable pages of equal size. It does so keeping the height proportionate to width of the page using a strong layout on a Bookiza template. The pages are cut-up in such a manner that they will always render above-the-fold and can potentially be sat on a codex style deck of webpages—ala, a Superbook.

See the Superbook format to learn more. Better still, try reading a book of your interest on a tablet.

How does it work?:

h2s uses Puppeteer by Google under the hood. Since Puppeteer is enormous h2s may act up a little when you’re installing it for the first time. Worry not, there is help out there or feel free to raise an issue on Github with us for help.

Once your installation is successful, there is a very small surface of an api that you need to remember. And the commands go like this:

$ h2s [options] [command]

Options: -V, –version output the version number -v, –version output the version number -h, –help output usage information

Commands

  1. $ h2s objectify # Turn sanitized.html into an ‘array like’ JSON.
  2. $ h2s pagify # Paginate with gadda-gadda line-tracking!
  3. $ h2s bookify # Templatize markup with layout to form actual pages

With just these three commands you can convert any markdown-compatible markup into a Superbook compatible codex.

What do the commands do?:

  1. Place your sanitized.html in an ./interim folder that is sibling to the manuscript folder at the root of your Bookiza project.

  2. Execute $ h2s objectify to pull up the contents into a set of key: value pairs.

  3. Run $ h2s pagify to paginate the key: value pairs according to a responsive template at ./templates folder.

  4. Run $ h2s bookify to apply layout on paginated content and produce book. And voila, your Superbook is ready!

  5. Start $ bookiza server to load your book in development mode at localhost:4567.

That’s it. Your scroll is now available like book, all paginated, formatted alongwith line-tracking!

About the author

Sonica Arora

A tree hugger at heart. Code, stories & coffee.

https://bubblin.io/sonica