Rotating pages in PDF using JavaScript

------ | ------------- E_0 | 0 E_90 | 1 E_180 | 2 E_270 | 3

UI rotation functions can be found on the DocumentViewer object. These rotation functions modify what is being displayed in WebViewer, not the actual PDF data.

• getRotation: Returns the rotation of a page in the UI
• getCompleteRotation: Returns the total rotation of a page, this is the temporary page rotation plus any permanently built in document rotation
• setRotation: Sets the rotation for the specified page or all pages in WebViewer
• rotateClockwise: Rotates the specified page or all pages clockwise in WebViewer
• rotateCounterClockwise: Rotates the specified page or all pages counterclockwise in WebViewer

There is only one function for manipulating rotation in the actual PDF data and it's found on the Document object.

• rotatePages: Rotate an array of pages, this does affect the PDF data and the downloaded file. It returns a promise when the operation is complete.

An example of rotations being used can be seen below

WebViewer(...)
  .then(instance => {
    const docViewer = instance.Core.documentViewer;
    const rotation = instance.Core.Core.PageRotation;

    docViewer.addEventListener('documentLoaded', async () => {
      const doc = docViewer.getDocument();
      const page1 = 1, page2 = 2, page3 = 3;

      // ---- Rotating pages in WebViewer ----------------
      docViewer.rotateClockwise(page1);
      docViewer.getRotation(page1); // returns 1 i.e. PageRotation.E_90
      docViewer.getCompleteRotation(page1); // returns 1 i.e. PageRotation.E_90

      // At this point, page 1 is rotated in WebViewer while page 2 and 3 are not rotated.
      // However if the user downloads the PDF, all pages are NOT rotated.
      // This is because the pages are rotated in the UI but the file data hasn't been changed.

      // ---- Rotating pages in the PDF file data ---------------
      await doc.rotatePages([page1], rotation.E_90);
      // At this point the first page is rotated 180 degrees relative to
      // its orientation originally but if the file is downloaded page 1
      // will only be rotated 90 degrees. This is because it has a 90 degree
      // temporary rotation and a 90 degree built in document rotation

      docViewer.getRotation(page1);
      // 1 i.e. PageRotation.E_90

      docViewer.getCompleteRotation(page1);
      // 2 i.e. PageRotation.E_180, getCompleteRotation returns the total rotation of the page
      // 90 degrees temporary rotation + 90 degrees permanent rotation

      // permanently rotate 180 degrees more
      await doc.rotatePages([page1], rotation.E_180);
      docViewer.getRotation(page1);
      // still return 1 i.e. PageRotation.E_90, the temporary rotation hasn't changed

      docViewer.getCompleteRotation(page1);
      // now returns 0 i.e. PageRotation.E_0, 90 degrees temporary rotation + 270 degrees permanent rotation
    });
  });