AngularEpubViewer

This is a simple epub viewer component for angular4+ websites.

All issues and pull requests are welcome!

$3

https://androidovshchik.github.io/AngularEpubViewer

$3

``
npm install epubjs@0.2.x --save
npm install angular-epub-viewer --save
`

(Actual version of the 2-nd branch for epub.js may be found here)

Then add required epub.js script to your .angular-cli.json

`
{
...
"apps": [
{
...
"scripts": [
"../node_modules/epubjs/build/epub.js",
...
]
}
]
}

`

Optional scripts:

> "../node_modules/epubjs/build/hooks.js"
>
> includes default plugins

> "../node_modules/epubjs/build/libs/zip.min.js" (recommended)
>
> includes JSZip.js library

> "../node_modules/epubjs/build/libs/localforage.min.js"
>
> includes localForage.js library

Other official plugins may be found here

In folder add-ons are also available my own hooks, include them such way:

"../node_modules/angular-epub-viewer/add-ons/YOUR_CHOSEN_HOOK_NAME.js"

$3

Compatibility coming with wicked-good-xpath

Include these scripts in .angular-cli.json:

`
"../node_modules/epubjs/examples/wgxpath.install.js",
"../node_modules/epubjs/hooks/extensions/wgxpath.js"
`

More info here

$3

*.module.ts file

`js
import { AngularEpubViewerModule } from 'angular-epub-viewer';

@NgModule({
...
imports: [
...
AngularEpubViewerModule
]
})
`

*.component.html file

`html


Previous page
Next page
`

*.component.ts file

`js
@Component({
...
})
export class AppComponent {

@ViewChild('epubViewer')
epubViewer: AngularEpubViewerComponent;

openFile(event) {
this.epubViewer.openFile(event.target.files[0]);
}
}
`

$3

Fields:

| Signature | Short Description |
| :------------- |:-------------|
| epub: ePub | Primary object |
| root: ElementRef | Root container's DOM reference |
| currentLocation: EpubLocation | Current location of document's rendered part |
| documentReady: boolean | Indicates whenever document is ready |
| isChapterDisplayed: boolean | Indicates whenever chapter is displayed |
| computingPagination: boolean | Indicates whenever pagination is computing |
| searchingText: boolean | Indicates whenever searching text |

Input parameters:

| Signature | Default value | Short Description |
| :------------- |:-------------|:-------------|
| padding: string | null | Root container's padding in px, em, etc |
| autoPagination: boolean | false | Enables auto calculate of pagination after document is ready or viewport has been changed |
| autoMetadata: boolean | false | Enables auto loading of metadata after document is ready |
| autoTOC: boolean | false | Enables auto loading of table of contents after document is ready |

Output events:

| Signature | Short Description |
| :------------- |:-------------|
| onDocumentReady: EventEmitter | Get event when document is loaded |
| onChapterUnloaded: EventEmitter | Get event when chapter is unloaded |
| onChapterDisplayed: EventEmitter | Get event when chapter is displayed |
| onLocationFound: EventEmitter | Get event about the current location |
| onSearchFinished: EventEmitter | Get event about search results |
| onPaginationComputed: EventEmitter | Get event about pagination |
| onMetadataLoaded: EventEmitter | Get event about metadata |
| onTOCLoaded: EventEmitter | Get event about table of contents |
| onErrorOccurred: EventEmitter | Get event when any error occurred |

Methods:

| Signature | Short Description |
| :------------- |:-------------|
| openLink(link: string): void | Opens EPUB document by link |
| openFile(file: File): void | Opens EPUB document file |
| goTo(location: string or number): void | Navigates to the specified url or EPUB CFI or page |
| nextPage(): void | Navigates to the next page |
| previousPage(): void | Navigates to the previous page |
| searchText(text: string): void | Searches all text matches in the current chapter |
| setStyle(style: string, value: string): void | Adds style to be attached to the document's body element |
| resetStyle(style: string): void | Removes a style from the rendered document |
| computePagination(): void | Calculates pagination as output event |
| loadMetadata(): void | Loads metadata as output event |
| loadTOC(): void | Loads table of contents as output event |

$3

`
git clone https://github.com/androidovshchik/AngularEpubViewer.git
cd AngularEpubViewer
git submodule update --init --recursive
npm install
npm start
``

Open http://localhost:4200 in browser

$3

$3

EPUB is a registered trademark of the IDPF.