Adds logic to index.html to auto focus the pdf

jakenvac commented 7 months ago

When using keyboard navigation, focusing the browser window does not focus the PDF iframe and thus using Up/Down do not scroll the pdf. Currently, to work around this, I press tab when I switch to my browser to focus the pdf.

This isn't something that is noticeable if you navigate to your browser window by clicking in the frame as it inherently focuses the PDF (because that's what was clicked on).

This PR adds three small changes:

in the 'message' websocket listener, .focus() is called on the target element.
A DOMContentLoaded listener is added to focus the PDF on first load.
Unrelated to this bug, but I've also fixed the overscroll & removed the strange borders of the embedded pdf reader.

I've tested this in firefox and chrome:

In firefox it works as intended.
In chrome it doesn't regress any behavior, but also doesn't fix the focus issue. Chrome's PDF reader focuses the pdf viewer toolbar first. So pressing tab to get to the actual page is still required before the arrow keys work.

Update: I don't think it's possible to fix this for chrome.

jakenvac commented 7 months ago

~I will do some follow up work to support chrome, but I'm happy to do this as a separate PR if this current firefox fix is acceptable as is.~

Update: I don't think we can programmatically focus the pdf body in chrome's reader.

jakenvac commented 7 months ago

@ItsEthra Thanks for taking the time to engage with this PR. It's odd that you don't experience the same behavior. I'm wondering if it's OS specific? I'm running MacOS.

ItsEthra commented 7 months ago

Yes it might be a Mac os only thing. I'm on arch linux. Though it can also be that I'm using Firefox nightly.

jakenvac commented 7 months ago

I've tried firefox nightly on my machine and I still have the same issue so I would chalk it up to the OS. No hard feelings if you don't want to merge - It's always frustrating when the cause of an issue isn't immediately clear. "Fixes" can end up being hacks.

Otherwise, if you would like to merge, I've noticed the check is failing, but I'm not very familiar with nix. I'm not sure what's going on with the cargo.lock (or why it's changed on my end) as I only changed the HTML file.

ItsEthra commented 7 months ago

Honestly I don't know nix either but updating lock file seems to help so i don't really care. Thanks for the contribution.

ItsEthra / typst-live

Adds logic to index.html to auto focus the pdf #11