Replace PDF.JS 2.x with 4.x. && Learn how to use Node Modules (ES6) on web

[DiegoPino]

What?

I am old(ish) and using .mjs is not as intuitive in a Drupal environment as expected. .mjs are "modules" and are loaded differently. And even if Drupal allows us to do so (with a hidden library property/subproperty) there is nothing that ensure that a module will be available (the exports) by the time Drupal's behaviors kick in.

So ... async magic/reading 4 hours of messages of cool kids using nodejs and I found a way. Why also upgrading?

Found out that PDF.JS (2.x, one we had) could not read PDFs with "small defects" like many coming from the Internet Archive and older repos. Now those work. Pull coming tomorrow

• Updates: the most simplistic nav we have is not accessible and can be accessed via tabs too
• Working on adding search: First PDF/JS native one using a different class. Then IIIF Content Search Driven (since this is rendering a canvas, I can render on top of it annotations)... and we can use the IIIF manifest a normal PDF would generate... more settings. This will lead to a "Search IIIF results component/element we can reuse in other viewers)
• Add a wrapper around the rendered canvas. That way we can render FULL but also make the viewer less tall/less width and add scroll bars (this one for @alliomeria bc it allows me to add a grey background, more pdf-profesh right?)

[patdunlavey]

@DiegoPino I'm curious if this PDF.JS upgrade addresses accessibility issues with the 2.x version? We just received an accessibility audit of one of our sites that found a lot of issues with PDF.JS.

[DiegoPino]

@patdunlavey I have no idea. Could you share the accessibility issues there? Are those things we/could tap in?

[DiegoPino]

@patdunlavey i would love to have those as soon as possible, I need to move into other tasks (paging on IABookreader) + date Facet widgets and I fear things might fall out of radar. Will wait until tomorrow before making my pull.

[mlohnash]

@DiegoPino and @patdunlavey

I have made an excerpt from the recent CA-R accessibility audit with only the identified PDF.JS issues for Diego.

https://docs.google.com/spreadsheets/d/1A-gVddjGCrSRLkKzERFu9QlEk05MKIjf/edit?usp=sharing&ouid=101266773125396074198&rtpof=true&sd=true

[DiegoPino]

@mlohnash thanks ❤️ .

Ok this is important/useful.

Here is the issue. Archipelago does not provide the full PDF.js interface you are using. Our interface is super simplistic. Next/previous page and full render. All the rest you have there, e.g

https://californiarevealed.org/do/63881621-423b-4b03-918e-48b4934431c1

Is the default/demo viewer the folks at Mozilla provide. That is a custom development/add-on of your vendor (would love to get a pull folks!). And that is great you are doing that.

But what we do provide is the pdf.js binding (we now/via this issue will provide a pdf.mjs really, new as of 2024) so with the upcoming pull you would get what Mozilla has as more recent (keep reading)

This is the important piece for you all (and good news bc nothing in pdfjs is fixed!)

• Evaluate this here https://mozilla.github.io/pdf.js/web/viewer.html (that is using the default viewer.html, similar to what you have)
• Look at the source code of the HTML. Notice that everything there can be customized (aria/buttons, etc). Make it accessible!
• Apply to your custom enhancement in archipelago the same changes

@alliomeria also ping!

[DiegoPino]

@mlohnash better link. This is what can be customized in your theme/custom module for make it accessible
https://github.com/mozilla/pdf.js/blob/master/web/viewer.html

[mlohnash]

Thanks @DiegoPino! This is very exciting news. I really appreciate your thorough explanation.