Update the learning/ examples with basic HiDPI-screen support

[Snuffleupagus]

This is essentially a simplified version of the code that's used in PDFPageView, which will hopefully reduce the number of issues opened specifically about blurry rendering.
However, note that ideally users should base their implementations on the components/ examples rather than using the API directly (the "viewer components" already support HiDPI-screens).

[handhikadj]

tried this on: https://jsfiddle.net/hrumnspz/
still, the quality is not as good as using the Viewer component

[Snuffleupagus]

still, the quality is not as good as using the Viewer component

Is there really no difference at all?
(Anyway, you probably want to use the "viewer components"-examples instead since they handle not just HiDPI but many other things for you :-)

Please keep in mind here that these examples are purposely intended to be very simple ones showcasing the most basic API usage, and that we cannot include the same code as in PDFPageView since that'd make the examples really difficult to read/understand.

[handhikadj]

Actually what I want to achieve is using the prev-next example with the quality of Viewer component. Could I achieve it?
So instead of showing all of the pages, I want to have something exactly like the prev-next example which showing the document one by one. What steps should I step on on this?

[Snuffleupagus]

Actually what I want to achieve is using the prev-next example with the quality of Viewer component. Could I achieve it?

Take a look at the "singlepageviewer" example, in https://github.com/mozilla/pdf.js/tree/master/examples/components
Using that one as a basis, it should be possible to add e.g. a toolbar with previous/next buttons and get similar functionality there (although this discussion now seem somewhat unrelated to the PR).

[timvandermeij]

The question is then: is there a noticeable difference after this fix? If not, I'd say we keep the examples as simple as possible. If there is in fact a good difference, I think we can accept this patch.

[Snuffleupagus]

The question is then: is there a noticeable difference after this fix?

I honestly don't know, since I don't use a HiDPI-screen on my main computer and thus simply copied some (reasonable looking) code over from the viewer :-)
Since this is a somewhat recurring question my hope is that it'd, assuming it in fact works, reduce some user confusion.

[handhikadj]

@Snuffleupagus It's noticeable on my eyes using 4K LG Monitor and Mac M1 (which has Retina display).

[timvandermeij]

Let's indeed do this if it has a noticeable effect. Thanks!

[Snuffleupagus]

Looking at https://mozilla.github.io/pdf.js/examples/index.html#interactive-examples, I notice that those unfortunately didn't update.
In hindsight that's not really surprising, since they're hosted externally, but it's a bit annoying not being able to update those easily.