kiwix-js-pwa icon indicating copy to clipboard operation
kiwix-js-pwa copied to clipboard

Jumping to a heading in Table of Contents only works well in Wikimedia ZIMs

Open Jaifroid opened this issue 2 years ago • 0 comments

No doubt because the code that makes the ToC is specialized for and thoroughly tested on Wikipedia ZIMs, I hadn't noticed till now that it does not work well for arbitrary Zimit ZIMs. It does gather all H1, H2, H3, H4 headings and makes a nice ToC, but jumping to a heading seems to depend on there being an anchor at that heading. If the page was not authored with the appropriate anchors, the browser cannot then jump to the heading using a simple hyperlink.

The way to fix this is quite easy, since we have a nicely constructed ToC (see screenshot). When the user clicks on one of these headings, we simply need to locate the heading using DOM traversal methods and inject an anchor with Kiwix prefix in to that heading. Then we can instruct the browser to scroll to it using the usual scrollIntoView method.

image

Jaifroid avatar Jun 14 '22 18:06 Jaifroid