yetangitu/epub.js
1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-02 14:49:16 +02:00
Code Issues Releases Wiki Activity

make rendition to emit mouseover/out event

Browse source
This commit is contained in:
Do Park 2023-10-28 14:50:55 -07:00
parent 583577b72a
commit 92488489db
3 changed files with 27 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

12
examples/highlights.html
View file

@ -112,6 +112,18 @@
// console.log(location);
});
rendition.on("markMouseover", () => {
console.log('mouseover from rendition');
});
rendition.on("markMouseout", () => {
console.log('mouseout from rendition');
});
rendition.on("markClicked", () => {
console.log('clicked from rendition');
});
// Apply a class to selected text
rendition.on("selected", function(cfiRange, contents) {
rendition.annotations.highlight(

14
src/rendition.js
View file

@ -419,6 +419,10 @@ class Rendition {
view.on(EVENTS.VIEWS.MARK_CLICKED, (cfiRange, data) => this.triggerMarkEvent(cfiRange, data, view.contents));
view.on(EVENTS.VIEWS.MARK_MOUSEOVER, (cfiRange, data) => this.triggerMarkMouseOverEvent(cfiRange, data, view.contents));
view.on(EVENTS.VIEWS.MARK_MOUSEOUT, (cfiRange, data) => this.triggerMarkMouseOutEvent(cfiRange, data, view.contents));
this.hooks.render.trigger(view, this)
.then(() => {
if (view.contents) {
@ -904,7 +908,7 @@ class Rendition {
* @memberof Rendition
*/
this.emit(EVENTS.RENDITION.SELECTED, cfirange, contents);
}
}
/**
* Emit a markClicked event with the cfiRange and data from a mark
@ -923,6 +927,14 @@ class Rendition {
this.emit(EVENTS.RENDITION.MARK_CLICKED, cfiRange, data, contents);
}
triggerMarkMouseOverEvent(cfiRange, data, contents){
this.emit(EVENTS.RENDITION.MARK_MOUSEOVER, cfiRange, data, contents);
}
triggerMarkMouseOutEvent(cfiRange, data, contents){
this.emit(EVENTS.RENDITION.MARK_MOUSEOUT, cfiRange, data, contents);
}
/**
* Get a Range from a Visible CFI
* @param {string} cfi EpubCfi String

2
src/utils/constants.js
View file

@ -51,6 +51,8 @@ export const EVENTS = {
LOCATION_CHANGED : "locationChanged",
RELOCATED : "relocated",
MARK_CLICKED : "markClicked",
MARK_MOUSEOUT: "markMouseout",
MARK_MOUSEOVER: "markMouseover",
SELECTED : "selected",
LAYOUT: "layout"
},