Pagination using Hydrogen Sulfide 🧫

Pagination using Hydrogen Sulfide 🧫

  • bookiza
  • 2 minutes
  • July 15, 2019

Have a long scroll that you need to chop into smaller pages? Turn it all into a formatted stack of pages on a Superbook?

Meet the h2s library–an intelligent and human-friendly paginator that cuts down really, really, long scrolls into a vertically oriented, symmetrical, Superbook compatible, layout enforced, and formatted stack of pages.

Pages ready to compress and go into a Superbook container. 😉

Hydrogen Sulfide or h2s is a node-based CLI tool that prints all the content and assets on a live-formated page of a pre-determined size line-by-line. It does so to simulate line-tracking on the digital book by keeping the height proportionate to the width of the page using a strong layout defined within a template of a Bookiza app.


h2s node library paginator logo.
Give that scroll a little sulfur treatment with a powerful Superbook paginator.


The pages are then cut up to always render above-the-fold and can potentially be sat on a codex style deck of web pages—aka, Superbook.

See the Superbook format to learn more about this open web book format.

What's under the hood?

h2s uses the grand and mighty puppeteer from Google under the hood. Since the Puppeteer library is enormous, h2s may act up a little when installing it for the first time.

Worry not. There is help out there or feel free to raise an issue on Github if you find it difficult to install on your system. Once your installation is complete, command h2s in the following format:

  $ h2s [options] [command]

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

The overall api?

The api surface of the h2s library is minimal, and it has only three commands to issue.

  1. $ h2s objectify # Turn sanitized.html into an ‘array like’ JSON.
  2. $ h2s pagify # Paginate with gadda-gadda line-tracking!
  3. $ h2s bookify # Compile markup into a formatted stack

With just these three commands, anyone can convert a markdown-compatible markup into a Superbook compatible codex. Automatically!

Further explanation

  1. Place the sanitized.html in the ./interim folder. The Interim folder is usually a sibling to the manuscript folder at the root of your Bookiza project.

  2. Execute $ h2s objectify first to pull out the contents on the scroll and turn them into a set of key-value pairs (JSON) called .prebook.

  3. Run $ h2s pagify next to paginate and format the pages as per the layout template specified in the ./templates folder.

  4. Run $ h2s bookify to hydrate the content and produce the book. And voila, your Superbook is ready!

Now you can start the Bookiza server (using $ bookiza server) to load your book in development mode at localhost:4567.

That’s it.

h2s makes it possible to convert old pesky files into an actual book on the web. Turn your scrolls into codex quickly for more accessibility.

A massive hint: Turn your PDF or ePub or Word file into a markdown file first and then let h2s do its magic on the clean, sanitized HTML for you automatically.

About the author

Sonica Arora

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

https://bubblin.io/sonica