displayModeManager.setDisplayMode() rendering the document a second time

Product:
pdftron/webviewer

Product Version:
8.9.0

Please give a brief summary of your issue:
Problems using VirtualDisplayMode when changing DisplayMode.

Please describe your issue and provide steps to reproduce it:
Using PDFTron without a WebViewer instance I change the DisplayMode like this:

const pdfTronCore = (window as any).Core;
const displayModeManager =
  this.documentViewer.getDisplayModeManager();
displayModeManager.setDisplayMode(
  new pdfTronCore.DisplayMode(
    this.documentViewer,
    DisplayModes.FacingContinuous
  )
);

Afterwards the document gets attached to DOM in FacingContinuous above the virtualListContainer like this:

Is there a better way to change the DisplayMode? Since I don’t use WebViewer I cannot use

instance.setLayoutMode(LayoutMode.FacingContinuous);

Any help appreciated!

Cheers,
the annoying guy with the custom UI :wink:

Hello jherbe!

This does look like a bug, thank you for reporting this. I assume this will also confirm that the other forum post is also a bug…

Ill add this to our backlog, thank you again.

Best regards,
Tyler Gordon
Web Development Support Engineer
PDFTron

Hey Tyler!

Thanks for the confirmation. Do you mean the post about the unnecessary iFrame? A fix for this would be awesome since it produces a vertical scrollbar in my layout.

Cheers,
jonas

Hey jherbe,

Yep! I believe our code for disabling the virtualListContainer might be the issue.

Best regards,
Tyler Gordon
Web Development Support Engineer
PDFTron

Hello @jherbe!

I have an update on this issue. It seems that all you need to do to fix it is to create a VirtualDisplayMode when switching between modes. For example:

  const displayManager = docViewer.getDisplayModeManager();
  const facingContinuous = new Core.VirtualDisplayMode(docViewer, Core.DisplayModes.FacingContinuous);
  displayManager.setDisplayMode(facingContinuous);

The takeaway point here is that if your UI currently has virtual displays enabled, then you need to set another virtual display when switching between display modes.

In our UI we do the following:

const displayMode = (displayModeManager.isVirtualDisplayEnabled())
      ? new window.Core.VirtualDisplayMode(documentViewer, mode)
      : new window.Core.DisplayMode(documentViewer, mode);

What you are seeing is basically adding a non-virtual display mode on top of the virtual display mode, instead of replacing it.

Let me know if this works out for you.

Best Regards,
Armando Bollain
Software Developer
PDFTron Systems, Inc.

Hey Armando,
this is in line with my observations. When I call my setDisplayMode method after loading a document, the error no longer occurs. I wasn’t sure if this was a page effect, but your explanation makes sense!
Thanks for pointing out new window.Core.VirtualDisplayMode(documentViewer, mode). My method uses new window.Core.DisplayMode(documentViewer, mode) like this:

  updateLayoutMode(displayMode: keyof typeof Core.DisplayModes) {
    const pdfTronCore = getPDFTronCore();
    const displayModeManager =
      this.pdfTronViewer.documentViewerInstance.getDisplayModeManager();
    const pdfTronDisplayMode = new pdfTronCore.DisplayMode(
      this.pdfTronViewer.documentViewerInstance,
      displayMode
    );
    displayModeManager.setDisplayMode(pdfTronDisplayMode);
  }

Core.VirtualDisplayMode() does not exist in Core namespace:

TS2339: Property 'VirtualDisplayMode' does not exist on type 'typeof Core'.

By the way: In your types.d.ts Core.DisplayModes is defined as an object:

var DisplayModes: {
        /**
         * Displays one page at a time.
         */
        Single: string;
        /**
         * Displays all the pages in a scrolling view in one column.
         */
        Continuous: string;
        /**
         * Displays up to two pages at a time, side by side.
         */
        Facing: string;
        /**
         * Displays all pages in a scrolling view in two columns.
         */
        FacingContinuous: string;
        /**
         * Displays all pages in a scrolling view in two columns.  The first row has a single page in the second column.
         */
        Cover: string;
        /**
         * Same as the Cover display mode except that it is not a scrolling view.
         */
        CoverFacing: string;
        /**
         * Any custom display mode.
         */
        Custom: string;
    };

Maybe this should be an enum?

Cheers,
Jonas

Hey Jonas,

Looking at the code, I can confirm that even though VirtualDisplayMode does exist in the Core namespace, it does not have the correct documentation for it to show up in the types file. This is why you are getting this TS error. I will update this so it shows up in the types, but in the meantime you should be able to suppress the warning, The constructor matches the parameters of the DisplayMode .

I’ll also change that object to an enum, thanks for pointing this out. Behind the scenes the Core is still developed in plain JS, and we generate the types based on JSDOC.

I’ll let you know through this ticket when I make the changes, it won’t make the December release but I can put it in a nightly build if you need it sooner rather than later.

Best Regards,
Armando Bollain
Software Developer
PDFTron Systems, Inc.

Hey Jonas,

I was able to make the change for the types - I’m attaching an updated types file for you to test. This file is only for testing purposes only as it may include APIs that are not out yet/are experimental. (I changed the extension to be a txt or it would not let me upload it).

Let me know if this works out for you - in the meantime I’ll proceed with getting this merged to our main prod branch.

types.d.ts.txt (2.1 MB)

Best Regards,
Armando Bollain
Software Developer
PDFTron Systems, Inc.

Hey Armando.

sorry for the late response! After adding the export statements I could use your file in the pdftron node module and it works. VirtualDisplayMode’s constructor expects “mode” to be type of string. I think this should be type of Core.DisplayModes once it is declared as enum.
I’ll keep an eye on the Changelog :wink:

thanks for your effort,
Jonas

1 Like