In This Topic ▼

deletionCSSClass Property

Summary

The CSS class to be associated with text tagged as DifferenceOperation.Delete.

Syntax

TypeScript

JavaScript

Object.defineProperty(MarkdownReportOptions.prototype, 'deletionCSSClass', 
   get: function(), 
   set: function(value) 
)

deletionCSSClass: string;

Property Value

A string corresponding to the CSS class name. The default value is markdownDelete.

Example

GenerateMarkdownReport.ts

DocumentHelper.ts

GenerateMarkdownReport.js

DocumentHelper.js

GenerateMarkdownReport.html

import { DocumentHelper } from "../../utilities/DocumentHelper"; 
 
export class DocumentDifference_GenerateMarkdownReportExample { 
   public constructor() { 
      lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null); 
      DocumentHelper.initFactory(); 
   } 
 
   public run = (buttonID: string) => { 
      const exampleButton = document.getElementById(buttonID); 
      exampleButton.onclick = this.compareDocument; 
   } 
 
   compareDocument = () => { 
 
      const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
      const url2 = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
      const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
      lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
         .done((document1: lt.Document.LEADDocument) => { 
            lt.Document.DocumentFactory.loadFromUri(url2, loadDocumentOptions) 
               .done((document2: lt.Document.LEADDocument) => { 
                  const options = new lt.Document.Compare.DocumentCompareOptions(); 
                  lt.Document.LEADDocument.compare([document1.documentId, document2.documentId], options) 
                     .done((diff) => { 
                        diff.generateMarkdownReport("text/markdown", new lt.Document.Compare.MarkdownReportOptions()) 
                           .done((response) => { 
                              const blob = new Blob([response], { type: "text/plain" }); 
                              const link = document.createElement('a'); 
                              link.href = window.URL.createObjectURL(blob); 
                              const fileName = "MarkdownReport.md"; 
                              link.download = fileName; 
                              link.target = "_blank"; 
                              link.rel = "noopener noreferrer"; 
                              document.body.appendChild(link); 
                              link.click(); 
                              link.remove(); 
                           }) 
                           .fail(DocumentHelper.showServiceError); 
                     }) 
                     .fail(DocumentHelper.showServiceError); 
               }) 
               .fail(DocumentHelper.showServiceError); 
         }) 
         .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 DocumentDifference_GenerateMarkdownReportExample { 
   constructor() { 
      lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null); 
      DocumentHelper.initFactory(); 
   } 
 
   run = (buttonID) => { 
      const exampleButton = document.getElementById(buttonID); 
      exampleButton.onclick = this.compareDocument; 
   } 
 
   compareDocument = () => { 
 
      const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
      const url2 = "https://demo.leadtools.com/images/pdf/leadtools.pdf"; 
      const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
      lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
         .done((document1) => { 
            lt.Document.DocumentFactory.loadFromUri(url2, loadDocumentOptions) 
               .done((document2) => { 
                  const options = new lt.Document.Compare.DocumentCompareOptions(); 
                  lt.Document.LEADDocument.compare([document1.documentId, document2.documentId], options) 
                     .done((diff) => { 
                        diff.generateMarkdownReport("text/markdown", new lt.Document.Compare.MarkdownReportOptions()) 
                           .done((response) => { 
                              const blob = new Blob([response], { type: "text/plain" }); 
                              const link = document.createElement('a'); 
                              link.href = window.URL.createObjectURL(blob); 
                              const fileName = "MarkdownReport.md"; 
                              link.download = fileName; 
                              link.target = "_blank"; 
                              link.rel = "noopener noreferrer"; 
                              document.body.appendChild(link); 
                              link.click(); 
                              link.remove(); 
                           }) 
                           .fail(DocumentHelper.showServiceError); 
                     }) 
                     .fail(DocumentHelper.showServiceError); 
               }) 
               .fail(DocumentHelper.showServiceError); 
         }) 
         .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 | GenerateMarkdownReport</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.DocumentDifference.GenerateMarkdownReport(); 
      example.run("exampleButton"); 
   }; 
</script> 
</html>