diff --git a/src/modules/EpubView/EpubView.js b/src/modules/EpubView/EpubView.js index c4a188d..0424479 100644 --- a/src/modules/EpubView/EpubView.js +++ b/src/modules/EpubView/EpubView.js @@ -22,7 +22,7 @@ class EpubView extends Component { document.addEventListener("keyup", this.handleKeyPress, false); } - initBook(first) { + initBook() { const { url, tocChanged, epubInitOptions } = this.props; if (this.book) { this.book.destroy(); @@ -69,7 +69,7 @@ class EpubView extends Component { initReader() { const { toc } = this.state; - const { location, epubOptions, getRendition, handleKeyPress } = this.props; + const { location, epubOptions, getRendition } = this.props; const node = this.viewerRef.current; this.rendition = this.book.renderTo(node, { contained: true, @@ -84,8 +84,7 @@ class EpubView extends Component { this.nextPage = () => { this.rendition.next(); }; - this.rendition.on("locationChanged", this.onLocationChange); - this.rendition.on("keyup", handleKeyPress || this.handleKeyPress); + this.registerEvents(); getRendition && getRendition(this.rendition); this.rendition.display( typeof location === "string" || typeof location === "number" @@ -94,6 +93,15 @@ class EpubView extends Component { ); } + registerEvents() { + const { handleKeyPress, handleTextSelected } = this.props; + this.rendition.on("locationChanged", this.onLocationChange); + this.rendition.on("keyup", handleKeyPress || this.handleKeyPress); + if (handleTextSelected) { + this.rendition.on('selected', handleTextSelected); + } + } + onLocationChange = loc => { const { location, locationChanged } = this.props; const newLocation = loc && loc.start; @@ -146,7 +154,8 @@ EpubView.propTypes = { epubInitOptions: PropTypes.object, epubOptions: PropTypes.object, getRendition: PropTypes.func, - handleKeyPress: PropTypes.func + handleKeyPress: PropTypes.func, + handleTextSelected: PropTypes.func }; export default EpubView; diff --git a/types/index.d.ts b/types/index.d.ts index e9fd2da..7259184 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -1,7 +1,8 @@ import * as React from "react"; import * as CSS from "csstype"; import { BookOptions } from "epubjs/types/book"; -import Rendition, { RenditionOptions } from "epubjs/types/rendition"; +import { RenditionOptions } from "epubjs/types/rendition"; +import { Contents, EpubCFI, Rendition } from "epubjs"; interface EpubViewProps { url: string | ArrayBuffer; @@ -15,6 +16,7 @@ interface EpubViewProps { tocChanged?(value: Toc): void; getRendition?(rendition: Rendition): void; handleKeyPress?(): void; + handleTextSelected?(cfiRange: EpubCFI, contents: Contents):void; } declare class EpubView extends React.Component {}