Jupyter-book: right-side navbar Unable to locate in Chinese mode

[Fdango]

https://fdango.github.io/bookT/intro.html#linux%E7%9A%84%E8%B5%B7%E6%BA%90，
I made a demo.

[choldgraf]

I see the right sidebar - perhaps your screen is too narrow? Once the screen becomes to narrow then the sidebar disappears. Here's a screenshot from my computer:

[Fdango]

When you click on the Chinese Catalogue on the right，Unable to locate intermediate specific fragments。It jumps to the top of the page。 @choldgraf

[choldgraf]

Ah interesting - I see what you mean. I'm not sure why that happens, unfortunately :-( I've never worked with Chinese characters before. I'd guess maybe it is a UTF-8 encoding problem? Would love some help figuring out a fix for this one if somebody has an idea.

[Fdango]

At the same time，I am also looking for this problem。Thank you for your attention。

[40660367]

Ah interesting - I see what you mean. I'm not sure why that happens, unfortunately :-( I've never worked with Chinese characters before. I'd guess maybe it is a UTF-8 encoding problem? Would love some help figuring out a fix for this one if somebody has an idea.

---

I found this fragment in the \jupyter_book\book_template_includes\onthispage.html

{% assign toc_items = my_toc | split: '#' %}
{% if toc_items.size > 1 %}

{{ page.toc_label | default: site.data.ui-text[site.locale].toc_label }}

{{ my_toc | markdownify | strip }}

{% endif %}

I guess this line {{ my_toc | markdownify | strip }} didn't encoding the chinese charset into url-encoding format.. maybe that cause the problem.

[choldgraf]

I'm happy to review PRs that give a shot at fixing this, I'd love for Jupyter Book to support chinese characters

[40660367]

I'm happy to review PRs that give a shot at fixing this, I'd love for Jupyter Book to support chinese characters

tks for your help. and another multi-language support problem when a md or ipynb file include chinese charset was built or create.
I modify the source code from the build.py, because python open method didn't speficy the encoding parameter, that default use the GBK encoding in my enviorment, i added it and specify into UTF-8. that works.
BUT the right in page anchor still fail~

[Fdango]

@choldgraf I have done a lot of experiments and found that the anchor itself is not a problem, but there is a little hit, but I do not know where to capture this incident, can you help me look at it? Thank you

[choldgraf]

Hmmm - could you describe what the issue seems to be? I don't have a ton of time to devote to this particular issue right now, but if you post information then hopefully folks in the community could help out (and I can help as I have the cycles)

[Fdango]

I found that the root of the problem is that this anchor. JS conflicts with its own anchor, but the library has only one anchors. add ("main h1, main h2, main h3, main h4") custom, so ask for help.

[GasperPaul]

So I had this same issue with Cyrrilic TOC and anchors in my book. I dig a bit and found that there are, basically, 3 different problems:

1. tocbot generates wrong classes for the right-side TOC links, if the activeListItemClass is set to an empty string:

forEach.call(tocLis, function (tocLi) {
  tocLi.className = tocLi.className.split(SPACE_CHAR + options.activeListItemClass).join('')
})

(See here in the tocbot repo.)

In case of an empty activeListItemClass this code will generate a mangled class like toc-linknode-name--H2, which you can observe right now in any Jupyter Book instance. Here it expects that class to be toc-link node-name--H2. This is even causing an error in the console when clicking on the TOC links.

I set activeListItemClass to be a space char and it fixed this particular issue.

1. Turbolinks has a longstanding issue with anchors: see turbolinks/turbolinks#75

The best solution is to add data-turbolinks="false" to the TOC links. Because they are generated dynamically at page load we'll need to do this in initToc().

1. Anchors from anchor.js are not working because of the same Turbolinks issue. It's fixed the same way as 2.

I'll make a PR soon.

[choldgraf]

Thanks for the analysis, and looking forward to a PR @GasperPaul !

[GasperPaul]

@choldgraf Here's a PR. Hope this helps. If things work out and I have time I'll be glad to work on a few other issues too.