In Redium Reader CFI - is it possible to go exact CFI location in a reflowable document when search text location are multiple in a page

[VaishNathani]

For example, using the readium reader 0.30, If I search for word "two" in my reflowable epub document, if there are 4 occurrences of word "two" on the page and I list 4 results in search result panel on right hand side, with the page number and small amount of text containing the searched word. ideally I should go correct location within the same page depending fragment of text surrounding word that I have searched for. Currently, if I click 2nd or 3rd or 4th search result in the panel, it always takes me to beginning part of the page and not to exact location where the searched word is.

Below is my code

if (idref !== null) { this.ebook.reader.openSpineItemElementCfi(idref, cfi, this.ebook.reader); }

If there are 4 results for word "two" on a single page, each click on search panel results should take me to right location on the page and not always to beginning of the concerned page. While my code takes me to the correct page each time, it does not take me to particular location within the particular page.

Is this possible? can anyone please guide me how or share a code snippet.

Thanks, Vaishali

[VaishNathani]

@danielweck Hi can you help me? are you the right person to put this query to?

[danielweck]

If I understand your description correctly, I think the answer is: No, it is not logically possible to "scroll" the paginated layout of reflowable documents in order meet to the actual location of an arbitrary range of text within a single or double page spread (CSS columns). I use the term logically because once the text formatting constraints are set (e.g. font size, margins, etc.) then the paginated layout is also fixed: it would be totally counter-intuitive to somehow alter the columns of text in order to accommodate the position of a particular search result. Instead, if a page (or two-page spread) contains more than one search result, an adequate UX could consist in highlighting all the search results, and in visually-animating / changing the colour / etc. of the single search result the user is requesting / activating. This is in fact how several web browsers implement this feature, albeit in a (typically) vertically-scrolled layout: if a search result is already in-view, and not too close to the top / bottom boundary of the visible viewport, then there is no scrolling at all, just a visual effect to emphasize the current search result.

I hope this helps. Closing this issue now, but please feel free to re-open if you think I have not answered your question correctly.

[VaishNathani]

@danielweck Thanks for the reply Daniel. To be more clear, there is no scrolling, even though in reflowable document the page number is same technically, for example say page 13, the search result we want to travel to may appear after clicking arrow (>) on right side of the page at least 4 to 5 times to travel to that portion of page where we have the result, meaning the page 13 is really long. so even after making a double page spread, our result may not appear on either of this two pages of double page spread. The search result we are interested in and we searched may appear after clicking next > arrow on right hand side may be 4 to 5 times. Technically all results are on page 13 but our result lies somewhere beyond double page spread. I hope I made myself more understandable. Any Suggestions or is there is a solution for this kind of scenario? Is this possible with readiumJS or do you have any alternative solution?

@danielweck can you please also suggest a good way to reference SDK or any helpful API or examples where they show way/usage of ReadiumJs, shared and all related libraries. Thanks!

[danielweck]

@JCCR what do you think? Personally I do not really understand the problem description, sorry @VaishNathani :) Thanks!