In This Topic ▼

originalPageNumber Property

Summary

The number of this page in the original document.

Syntax

TypeScript

JavaScript

Object.defineProperty(DocumentPage.prototype, 'originalPageNumber', 
   get: function() 
)

readonly originalPageNumber: number;

Property Value

1-based number of this page in the original document.

Remarks

OriginalPageNumber is the number of this DocumentPage in the original document file. When the document is loaded, OriginalPageNumber and PageNumber will contain the same value. If the user modifies the pages of the document by adding, removing or replacing pages, then the two values will differ. OriginalPageNumber will never change and will still holds the value in the original document while PageNumber will return the current updated number of the page in the document.

When a page is added to the document by the user, the value of OriginalPageNumber will be -1 since it does not correspond to an item in the original document.

This DocumentPage will use OriginalPageNumber when the user calls the methods to obtain data from the original document such as getImageUrl.

Refer to Loading Using LEADTOOLS Document Library for more information.

Example

LoadFromUri.ts

DocumentHelper.ts

LoadFromUri.js

DocumentHelper.js

LoadFromUri.html

import { DocumentHelper } from "../../utilities/DocumentHelper"; 
 
export class DocumentFactory_LoadFromUriExample { 
    private imgEle: HTMLElement; 
    public constructor() { 
       lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", function ( 
          setLicenseResult 
       ) { 
          if (setLicenseResult.result) { 
             console.log("LEADTOOLS client license set successfully"); 
          } else { 
             var msg = "LEADTOOLS License is missing, invalid or expired\nError:\n";  
             alert(msg);  
          } 
       }); 
        DocumentHelper.initFactory(); 
    } 
 
    public run = (buttonID: string, imgID: string) => { 
        document.getElementById(buttonID).onclick = this.loadFromUri; 
        this.imgEle = document.getElementById(imgID); 
    } 
 
    /** 
     * Load a new document from URI 
     */ 
    loadFromUri = () => { 
        const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
        const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
        lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
            .done((document: lt.Document.LEADDocument) => { 
                DocumentHelper.log("Document loaded with " + document.pages.count + " pages", document); 
 
                // Show the PDF image of the first page 
                const page = document.pages.item(0); 
                (this.imgEle as HTMLImageElement).src = page.getSvgUrl(lt.Document.DocumentGetSvgOptions.none); 
            }) 
            .fail(DocumentHelper.showServiceError); 
    } 
}

export class DocumentHelper { 
   static showServiceError = (jqXHR, statusText, errorThrown) => { 
      alert("Error returned from service. See the console for details."); 
      const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown); 
      console.error(serviceError); 
   } 
 
   static log = (message: string, data?: any) => { 
      const outputElement = document.getElementById("output"); 
      if (outputElement) { 
         const time = (new Date()).toLocaleTimeString(); 
         const textElement = document.createElement("p"); 
         textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message; 
         outputElement.insertBefore(textElement, outputElement.firstChild); 
      } 
 
      if (!data) 
         console.log(message); 
      else 
         console.log(message, data); 
   } 
 
   static initFactory = () => { 
      // To communicate with the DocumentsService, it must be running! 
      // Change these parameters to match the path to the service. 
      lt.Document.DocumentFactory.serviceHost = "http://localhost:40000"; 
      lt.Document.DocumentFactory.servicePath = ""; 
      lt.Document.DocumentFactory.serviceApiPath = "api"; 
   } 
}

import { DocumentHelper } from "../../utilities/DocumentHelper"; 
 
export class DocumentFactory_LoadFromUriExample { 
    imgEle; 
    constructor() { 
       lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", function ( 
          setLicenseResult 
       ) { 
          if (setLicenseResult.result) { 
             console.log("LEADTOOLS client license set successfully"); 
          } else { 
             var msg = "LEADTOOLS License is missing, invalid or expired\nError:\n"; 
             alert(msg); 
          } 
       }); 
        DocumentHelper.initFactory(); 
    } 
 
    run = (buttonID, imgID) => { 
        document.getElementById(buttonID).onclick = this.loadFromUri; 
        this.imgEle = document.getElementById(imgID); 
    } 
 
    /** 
     * Load a new document from URI 
     */ 
    loadFromUri = () => { 
        const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
        const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
        lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
            .done((document) => { 
                DocumentHelper.log("Document loaded with " + document.pages.count + " pages", document); 
 
                // Show the PDF image of the first page 
                const page = document.pages.item(0); 
                this.imgEle.src = page.getSvgUrl(lt.Document.DocumentGetSvgOptions.none); 
            }) 
            .fail(DocumentHelper.showServiceError); 
    } 
}

export class DocumentHelper { 
   static showServiceError = (jqXHR, statusText, errorThrown) => { 
      alert("Error returned from service. See the console for details."); 
      const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown); 
      console.error(serviceError); 
   } 
 
   static log = (message, data) => { 
      const outputElement = document.getElementById("output"); 
      if (outputElement) { 
         const time = (new Date()).toLocaleTimeString(); 
         const textElement = document.createElement("p"); 
         textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message; 
         outputElement.insertBefore(textElement, outputElement.firstChild); 
      } 
 
      if (!data) 
         console.log(message); 
      else 
         console.log(message, data); 
   } 
 
   static initFactory = () => { 
      // To communicate with the DocumentsService, it must be running! 
      // Change these parameters to match the path to the service. 
      lt.Document.DocumentFactory.serviceHost = "http://localhost:40000"; 
      lt.Document.DocumentFactory.servicePath = ""; 
      lt.Document.DocumentFactory.serviceApiPath = "api"; 
   } 
}

<!doctype html> 
<html lang="en"> 
<title>Document Example | LoadFromUri</title> 
 
<head> 
   <script src="https://code.jquery.com/jquery-2.2.4.min.js" 
      integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 
 
   <script src="../../LT/Leadtools.js"></script> 
   <script src="../../LT/Leadtools.Controls.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Engine.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Designers.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Rendering.Javascript.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Automation.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Main.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Color.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Core.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Effects.js"></script> 
   <script src="../../LT/Leadtools.Document.js"></script> 
   <script src="../../LT/Leadtools.Document.Viewer.js"></script> 
   <link rel="stylesheet" type="text/css" href="../../css/examples.css"> 
 
   <!-- All demo files are bundled and appended to the window --> 
   <script src="../../bundle.js" type="text/javascript"></script> 
</head> 
 
<body> 
   <div> 
      <button type="button" id="exampleButton">Run Example</button> 
   </div> 
   <div id="output"></div> 
   <div> 
      <img id="img" /> 
   </div> 
</body> 
 
<script> 
   window.onload = () => { 
      const example = new window.examples.DocumentFactory.LoadFromUri(); 
      example.run("exampleButton"); 
   }; 
</script> 
</html>