1

I'm working on an app that is a book-reader and it is developed using epubjs-rn. I want to know how I Can get the book total number of pages and the numeric index of the current page. I will be grateful if somebody teach me this.

Elessar
  • 93
  • 2
  • 11

1 Answers1

0

This is not super clear cut, the concept of "page numbers" in the tradition sense does not really work. But what we do have is the total number of locations.

For the prop onLocationsReady record the total number of locations.

onLocationsReady={(locations) => {
  this.setState({totalNumberOfLocations: locations.total});
})

Then looking at the onLocationChange prop

onLocationChange={(visibleLocation) => {
  this.setState({visibleLocation});
});

Then what you can do is have all the necessary information to computes the rough "page" or location number and percentage:

  // give the current "page" or location
  _formatCurrentPosition(){
    return Math.floor(this.state.totalNumberOfLocations * (this.state.visibleLocation.start.percentage.toFixed(4)));
  }

  // formats the percentage since this can be very long
  _formatProgressPercentage(){
    return Math.floor(this.state.visibleLocation.start.percentage.toFixed(4) * 100);
  }

Note

On mount visibleLocation will be unknown so you will need to make sure the visible location and total number of locations is available prior to rendering

Jonathon
  • 56
  • 6
  • _formatCurrentPosition() is wrong. EPUBJS accepts an integer for the spine or an EPUBCFI as a string. If you try to send this calculation you will get an error since the integer will be higher than the number of spines. – Des Jan 05 '22 at 12:34