npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@loopspeed/epubjs

v0.3.89

Published

Parse and Render Epubs

Downloads

3

Readme

Epub.js v0.3

FuturePress Views

Epub.js is a JavaScript library for rendering ePub documents in the browser, across many devices.

Epub.js provides an interface for common ebook functions (such as rendering, persistence and pagination) without the need to develop a dedicated application or plugin. Importantly, it has an incredibly permissive Free BSD license.

Try it while reading Moby Dick

Why EPUB

Why EPUB

The EPUB standard is a widely used and easily convertible format. Many books are currently in this format, and it is convertible to many other formats (such as PDF, Mobi and iBooks).

An unzipped EPUB3 is a collection of HTML5 files, CSS, images and other media – just like any other website. However, it enforces a schema of book components, which allows us to render a book and its parts based on a controlled vocabulary.

More specifically, the EPUB schema standardizes the table of contents, provides a manifest that enables the caching of the entire book, and separates the storage of the content from how it’s displayed.

Getting Started

Get the minified code from the build folder:

<script src="../dist/epub.min.js"></script>

If using archived .epub files include JSZip:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.5/jszip.min.js"></script>

Set up a element to render to:

<div id="area"></div>

Create the new ePub, and then render it to that element:

<script>
  var book = ePub("url/to/book/package.opf");
  var rendition = book.renderTo("area", {width: 600, height: 400});
  var displayed = rendition.display();
</script>

Render Methods

Default

book.renderTo("area", { method: "default", width: "100%", height: "100%" });

View example

The default manager only displays a single section at a time.

Continuous

book.renderTo("area", { method: "continuous", width: "100%", height: "100%" });

View example

The continuous manager will display as many sections as need to fill the screen, and preload the next section offscreen. This enables seamless swiping / scrolling between pages on mobile and desktop, but is less performant than the default method.

Flow Overrides

Auto (Default)

book.renderTo("area", { flow: "auto", width: "900", height: "600" });

Flow will be based on the settings in the OPF, defaults to paginated.

Paginated

book.renderTo("area", { flow: "paginated", width: "900", height: "600" });

View example

Scrolled: book.renderTo("area", { flow: "scrolled-doc" });

View example

Documentation

API documentation is available at epubjs.org/documentation/0.3/

A Markdown version is included in the repo at documentation/API.md

Running Locally

install node.js

Then install the project dependences with npm

npm install

You can run the reader locally with the command

npm start

Examples

View All Examples

Testing

Test can be run by Karma from NPM

npm test

Building for Distribution

Builds are concatenated and minified using webpack and babel

To generate a new build run

npm run prepare

or to continuously build run

npm run watch

Hooks

Similar to a plugins, Epub.js implements events that can be "hooked" into. Thus you can interact with and manipulate the contents of the book.

Examples of this functionality is loading videos from YouTube links before displaying a chapter's contents or implementing annotation.

Hooks require an event to register to and a can return a promise to block until they are finished.

Example hook:

rendition.hooks.content.register(function(contents, view) {

    var elements = contents.document.querySelectorAll('[video]');
    var items = Array.prototype.slice.call(elements);

    items.forEach(function(item){
      // do something with the video item
    });

})

The parts of the rendering process that can be hooked into are below.

book.spine.hooks.serialize // Section is being converted to text
book.spine.hooks.content // Section has been loaded and parsed
rendition.hooks.render // Section is rendered to the screen
rendition.hooks.content // Section contents have been loaded
rendition.hooks.unloaded // Section contents are being unloaded

Reader

The reader has moved to its own repo at: https://github.com/futurepress/epubjs-reader/

Additional Resources

Gitter Chat

Epub.js Developer Mailing List

IRC Server: freenode.net Channel: #epub.js

Follow us on twitter: @Epubjs

  • http://twitter.com/#!/Epubjs

Other

EPUB is a registered trademark of the IDPF.