gerhardsletten / react-reader

An ePub-reader for React, powered by Epub.js
https://react-reader.metabits.no
Apache License 2.0
721 stars 132 forks source link

The percentage in location does not update if you change location from TOC too fast #166

Closed shiroyasha9 closed 10 months ago

shiroyasha9 commented 11 months ago

Hey, great work on the library. This might seem like a duplicate of #158, but hear me out. The rendition object that is provided by the getRendition prop gives you an event listener for location. The location object has 2 attributes - start and end. Inside them both, you get a percentage float which ranges from 0 at the start of the book, and 1 at the end of the book.

Here is how I am using it.

  const handleRendition = (rendition: Rendition) => {
    rendition.on('relocated', (location: Location) => {
      setCurrentBookPosition(
        Number((location.start.percentage * 100).toFixed(1))
      );
    });
  };

Location object for context

image

The problem I am encountering is that once the epub loads, if you immediately go to a different page using table of contents, the location object does not update, and the percentage and location are both 0 in start and end. The event listener is triggered, but the values are not updated.

image

It gets fixed if you wait for some time before navigating using TOC or between different pages without it.

Is there a way to fix this so that the location object gets the correct values at all times? I have read the limitations, but I could not understand how it relates to this particular issue. Open to assisting in any way I can, and thanks for your help!

gerhardsletten commented 11 months ago

@shiroyasha9 Your digging into the inner stuff of futurepress/epub.js) so you might have a better luck see how thepercentage get set in that repo.

To me percentage is always 0 with the alice-book in this repo. Might be better do use displayed object and calculate this yourself.