nuxeo-development-framework 4.1.6 → 4.1.7

package/src/lib/components/documents/components/document-scan/document-scan.component.ts

@@ -1,1156 +0,0 @@
-import { APP_BASE_HREF, DatePipe } from '@angular/common';
-import {
-  AfterViewInit,
-  Component,
-  EventEmitter, Inject,
-  Input,
-  OnInit,
-  Output,
-  ViewEncapsulation
-} from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
-import Dynamsoft from 'dwt';
-import { Subscription } from 'rxjs';
-import { DocumentsService } from '../../services/documents.service';
-import { DocumentScanService } from './document-scan.service';
-
-/**
- * Document Scan is a reusable nuxeo API & Scanner integrated component,
- * that utilizes the scanner to create and upload PDF file as a batch, then provide
- * that batch for consumption
- *
- * @title
- * Document Scan
- *
- * @example
- *
- * <app-document-scan
- *   (file)="onSuccess($event)"
- * ></app-document-scan>
- */
-@Component({
-  selector: 'app-document-scan',
-  templateUrl: './document-scan.component.html',
-  styleUrls: ['./document-scan.component.scss'],
-  host: { class: 'scanner' },
-  encapsulation: ViewEncapsulation.None
-})
-export class ScanComponent implements OnInit, AfterViewInit {
-  uploadedFile;
-  onMinimizingSubscription : Subscription;
-
-  @Input() useStoredFile = false;
-  @Input() hideUploadButton=false;
-  /** Event emitted when a batch is uploaded */
-  @Output()
-  file: EventEmitter<any> = new EventEmitter();
-
-  DWObject;
-  selectSources: HTMLSelectElement;
-  DWTSourceCount = 0;
-  filename = '';
-  containerId = 'dwtcontrolContainer';
-  bWASM = Dynamsoft.Lib.env.bMobile || Dynamsoft.DWT.UseLocalService;
-  _iLeft;
-  _iTop;
-  _iRight;
-  _iBottom;
-  _strTempStr = '';
-  re = /^\d+$/;
-  strre = /^[\s\w]+$/;
-  refloat = /^\d+\.*\d*$/i;
-  innerHTML: string;
-  constructor(
-    public translate: TranslateService,
-    public documentsService: DocumentsService,
-    public datePipe: DatePipe,
-    public DocumentScanService : DocumentScanService,
-    @Inject('environment') private environment,
-    @Inject(APP_BASE_HREF) private baseHref: string
-  ) { }
-  ngOnInit(): void {
-    Dynamsoft.DWT.ResourcesPath = this.baseHref + '/assets/dwt-resources';
-    ///
-    Dynamsoft.DWT.AutoLoad = true;
-    ///
-    // const width = window.outerWidth * 0.3;
-    // const height = window.outerHeight * 0.3;
-    Dynamsoft.DWT.Containers = [
-      {
-        WebTwainId: 'DWTObject',
-        ContainerId: 'dwtcontrolContainer',
-        Width: '100%',
-        Height: '100%'
-      }
-    ];
-
-    Dynamsoft.DWT.ProductKey = this.environment.dynamsoftProductKey;
-        // Dynamsoft.DWT.Trial = false;
-    // Dynamsoft.DWT.Debug = false; // only for debugger output
-
-    ///
-    Dynamsoft.DWT.IfAddMD5InUploadHeader = false;
-
-    ///
-    Dynamsoft.DWT.IfConfineMaskWithinTheViewer = false;
-    Dynamsoft.MSG = {
-      ConvertingToBase64: this.translate.instant(
-        'scanner.ConvertingToBase64'
-      ),
-      ConvertingToBlob: this.translate.instant(
-        'scanner.ConvertingToBlob'
-      ),
-      Downloading: this.translate.instant('scanner.Downloading'),
-      Encoding: this.translate.instant('scanner.Encoding'),
-      Err_BrowserNotSupportWasm: this.translate.instant(
-        'scanner.Err_BrowserNotSupportWasm'
-      ),
-      Init_AllJsLoaded: Dynamsoft.MSG.Init_AllJsLoaded,
-      Init_CheckDWT: Dynamsoft.MSG.Init_CheckDWT,
-      Init_CheckDWTVersion: Dynamsoft.MSG.Init_CheckDWTVersion,
-      Init_CheckingLicense: Dynamsoft.MSG.Init_CheckingLicense,
-      Init_CompilingWasm: Dynamsoft.MSG.Init_CompilingWasm,
-      Init_ConfiguringDWT: Dynamsoft.MSG.Init_ConfiguringDWT,
-      Init_CreatingDWT: Dynamsoft.MSG.Init_CreatingDWT,
-      Init_DownloadingWasm: Dynamsoft.MSG.Init_DownloadingWasm,
-      Init_FireBeforeInitEvt: Dynamsoft.MSG.Init_FireBeforeInitEvt,
-      Init_GetLicenseInfoForDWT: Dynamsoft.MSG.Init_GetLicenseInfoForDWT,
-      Init_InitActiveX: Dynamsoft.MSG.Init_InitActiveX,
-      Init_InitDynamsoftService: Dynamsoft.MSG.Init_InitDynamsoftService,
-      Init_InitH5: Dynamsoft.MSG.Init_InitH5,
-      Init_InitWasm: Dynamsoft.MSG.Init_InitWasm,
-      Init_LoadingViewerJs: Dynamsoft.MSG.Init_LoadingViewerJs,
-      Init_LookingLicense: Dynamsoft.MSG.Init_LookingLicense,
-      Init_SetLicenseForDWT: Dynamsoft.MSG.Init_SetLicenseForDWT,
-      Loading: this.translate.instant('scanner.Loading'),
-      LoadingPdf: this.translate.instant('scanner.LoadingPdf'),
-      LoadingTiff: this.translate.instant('scanner.LoadingTiff'),
-      SavingPdf: this.translate.instant('scanner.SavingPdf'),
-      SavingTiff: this.translate.instant('scanner.SavingTiff'),
-      Uploading: this.translate.instant('scanner.Uploading')
-    };
-    Dynamsoft.DWT.CustomizableDisplayInfo = {
-      errorMessages: this.translate.instant('scanner.errorMessages'),
-
-      // launch
-      generalMessages: this.translate.instant('scanner.generalMessages'),
-
-      customProgressText: this.translate.instant(
-        'scanner.customProgressText'
-      ),
-
-      // image editor
-      buttons: this.translate.instant('scanner.buttons'),
-
-      dialogText: this.translate.instant('scanner.dialogText')
-    };
-
-    Dynamsoft.DWT.OnWebTwainReady = (): any => {
-      this.pageonload();
-      this.Dynamsoft_OnReady();
-    };
-    Dynamsoft.DWT.Load();
-
-    this.onMinimizingSubscription = this.DocumentScanService.onMinimizing.subscribe(res => {
-      this.convertToBlobForSaving();
-    })
-  }
-  ngAfterViewInit() {
-    this.pageonload();
-    if(this.useStoredFile){
-        if(this.DocumentScanService.storedFile){
-          setTimeout(() => {
-            this.setStoredFileToScanner(this.DocumentScanService.storedFile);
-          }, 2000);
-        }
-    }
-
-  }
-
-  setStoredFileToScanner(result){
-    this.DWObject.LoadImageFromBinary(
-      result,
-      function() {
-          console.log('success');
-      },
-      function(errorCode, errorString) {
-          console.log(errorString);
-      }
-  );
-  }
-
-  pageonload() {
-    this.HideLoadImageForLinux();
-    const twainsource: any = document.getElementById('source');
-    if (twainsource) {
-      twainsource.options.length = 0;
-      twainsource.options.add(
-        new Option(this.translate.instant('scanner.pleaseWait'), '0')
-      );
-      twainsource.options[0].selected = true;
-    }
-
-    this.initiateInputs();
-  }
-
-  HideLoadImageForLinux() {
-    const o = document.getElementById('liLoadImage');
-    if (o) {
-      if (Dynamsoft.Lib.env.bLinux) { o.style.display = 'none'; }
-      else { o.style.display = ''; }
-    }
-  }
-
-  initiateInputs() {
-    const allinputs = document.getElementsByTagName('input');
-    for (let i = 0; i < allinputs.length; i++) {
-      if (allinputs[i].type === 'checkbox') {
-        allinputs[i].checked = false;
-      } else if (allinputs[i].type === 'text') {
-        allinputs[i].value = '';
-      }
-    }
-    //@ts-ignore
-    if (Dynamsoft.Lib.env.bIE === true && Dynamsoft.Lib.env.bWin64 === true) {
-      let o = document.getElementById('samplesource64bit');
-      if (o) { o.style.display = 'inline'; }
-
-      o = document.getElementById('samplesource32bit');
-      if (o) { o.style.display = 'none'; }
-    }
-  }
-
-  initDllForChangeImageSize() {
-    const vInterpolationMethod: any = document.getElementById(
-      'InterpolationMethod'
-    );
-    vInterpolationMethod.options.length = 0;
-    vInterpolationMethod.options.add(new Option('NearestNeighbor', '1'));
-    vInterpolationMethod.options.add(new Option('Bilinear', '2'));
-    vInterpolationMethod.options.add(new Option('Bicubic', '3'));
-  }
-
-  setDefaultValue() {
-    const vGray: any = document.getElementById('Gray');
-    if (vGray) { vGray.checked = true; }
-
-    const varImgTypepng2: any = document.getElementById('imgTypepng2');
-    if (varImgTypepng2) { varImgTypepng2.checked = true; }
-    const varImgTypepng: any = document.getElementById('imgTypepng');
-    if (varImgTypepng) { varImgTypepng.checked = true; }
-
-    const _strDefaultSaveImageName = 'WebTWAINImage';
-    const _txtFileNameforSave: any = document.getElementById(
-      'txt_fileNameforSave'
-    );
-    if (_txtFileNameforSave) {
-      _txtFileNameforSave.value = _strDefaultSaveImageName;
-    }
-
-    const _txtFileName: any = document.getElementById('txt_fileName');
-    if (_txtFileName) { _txtFileName.value = _strDefaultSaveImageName; }
-
-    const _chkMultiPageTIFF_save: any = document.getElementById(
-      'MultiPageTIFF_save'
-    );
-    if (_chkMultiPageTIFF_save) { _chkMultiPageTIFF_save.disabled = true; }
-    const _chkMultiPagePDF_save: any = document.getElementById(
-      'MultiPagePDF_save'
-    );
-    if (_chkMultiPagePDF_save) { _chkMultiPagePDF_save.disabled = true; }
-    const _chkMultiPageTIFF: any = document.getElementById('MultiPageTIFF');
-    if (_chkMultiPageTIFF) { _chkMultiPageTIFF.disabled = true; }
-    const _chkMultiPagePDF: any = document.getElementById('MultiPagePDF');
-    if (_chkMultiPagePDF) { _chkMultiPagePDF.disabled = true; }
-  }
-
-  // Check if the control is fully loaded.
-  Dynamsoft_OnReady() {
-    const liNoScanner = document.getElementById('pNoScanner');
-    // If the ErrorCode is 0, it means everything is fine for the control. It is fully loaded.
-    this.DWObject = Dynamsoft.DWT.GetWebTwain('dwtcontrolContainer');
-    if (this.DWObject) {
-      if (this.DWObject.ErrorCode === 0) {
-        this.DWObject.LogLevel = 0;
-        this.DWObject.IfAllowLocalCache = true;
-        this.DWObject.ImageCaptureDriverType = 4;
-        this.setDefaultValue();
-
-        this.DWObject.RegisterEvent(
-          'OnTopImageInTheViewChanged',
-          this.Dynamsoft_OnTopImageInTheViewChanged
-        );
-        this.DWObject.RegisterEvent(
-          'OnMouseClick',
-          this.Dynamsoft_OnMouseClick
-        );
-
-        let twainsource: any = document.getElementById('source');
-        if (!twainsource) {
-          twainsource = document.getElementById('webcamsource');
-        }
-
-        const vCount = this.DWObject.SourceCount;
-        this.DWTSourceCount = vCount;
-
-        if (twainsource) {
-          twainsource.options.length = 0;
-          for (let i = 0; i < vCount; i++) {
-            twainsource.options.add(
-              new Option(this.DWObject.GetSourceNameItems(i), i.toString())
-            );
-          }
-        }
-
-        // If source list need to be displayed, fill in the source items.
-        if (vCount === 0) {
-          if (liNoScanner) {
-            if (Dynamsoft.Lib.env.bWin) {
-              liNoScanner.style.display = 'block';
-              liNoScanner.style.textAlign = 'center';
-            } else { liNoScanner.style.display = 'none'; }
-          }
-        }
-
-        if (vCount > 0) {
-          this.source_onchange();
-        }
-
-        if (Dynamsoft.Lib.env.bWin) { this.DWObject.MouseShape = false; }
-
-        const btnScan: any = document.getElementById('btnScan');
-        if (btnScan) {
-          if (vCount === 0) { btnScan.disabled = true; }
-          else {
-            btnScan.disabled = false;
-          }
-        }
-
-        if (!Dynamsoft.Lib.env.bWin && vCount > 0) {
-          if (document.getElementById('lblShowUI')) {
-            document.getElementById('lblShowUI').style.display = 'none';
-          }
-          if (document.getElementById('ShowUI')) {
-            document.getElementById('ShowUI').style.display = 'none';
-          }
-        } else {
-          if (document.getElementById('lblShowUI')) {
-            document.getElementById('lblShowUI').style.display = '';
-          }
-          if (document.getElementById('ShowUI')) {
-            document.getElementById('ShowUI').style.display = '';
-          }
-        }
-
-        this.initDllForChangeImageSize();
-
-        this._iLeft = 0;
-        this._iTop = 0;
-        this._iRight = 0;
-        this._iBottom = 0;
-
-        for (let i = 0; i < document.links.length; i++) {
-          if (document.links[i].className === 'ShowtblLoadImage') {
-            document.links[i].onclick = this.showtblLoadImage_onclick;
-          }
-          if (document.links[i].className === 'ClosetblLoadImage') {
-            document.links[i].onclick = this.closetblLoadImage_onclick;
-          }
-        }
-        if (vCount === 0) {
-          if (Dynamsoft.Lib.env.bWin) {
-            if (
-              document.getElementById('aNoScanner') &&
-              window['bDWTOnlineDemo']
-            ) {
-              if (document.getElementById('div_ScanImage').style.display === '') {
-                this.showtblLoadImage_onclick();
-              }
-            }
-            if (document.getElementById('Resolution')) {
-              document.getElementById('Resolution').style.display = 'none';
-            }
-          }
-        } else {
-          const divBlank = document.getElementById('divBlank');
-          if (divBlank) { divBlank.style.display = 'none'; }
-        }
-
-        this.updatePageInfo();
-        const ua = navigator.userAgent.toLowerCase();
-        if (!ua.indexOf('msie 6.0')) {
-        }
-
-        this.DWObject.RegisterEvent(
-          'OnPostTransfer',
-          this.Dynamsoft_OnPostTransfer
-        );
-        this.DWObject.RegisterEvent(
-          'OnPostLoad',
-          this.Dynamsoft_OnPostLoadfunction
-        );
-        this.DWObject.RegisterEvent(
-          'OnPostAllTransfers',
-          this.Dynamsoft_OnPostAllTransfers
-        );
-        this.DWObject.RegisterEvent(
-          'OnImageAreaSelected',
-          this.Dynamsoft_OnImageAreaSelected
-        );
-        this.DWObject.RegisterEvent(
-          'OnImageAreaDeSelected',
-          this.Dynamsoft_OnImageAreaDeselected
-        );
-        this.DWObject.RegisterEvent(
-          'OnGetFilePath',
-          this.Dynamsoft_OnGetFilePath
-        );
-      }
-    }
-  }
-
-  showtblLoadImage_onclick() {
-    switch (document.getElementById('tblLoadImage').style.visibility) {
-      case 'hidden':
-        document.getElementById('tblLoadImage').style.visibility = 'visible';
-        document.getElementById('Resolution').style.visibility = 'hidden';
-        break;
-      case 'visible':
-        document.getElementById('tblLoadImage').style.visibility = 'hidden';
-        document.getElementById('Resolution').style.visibility = 'visible';
-        break;
-      default:
-        break;
-    }
-    if (document.getElementById('pNoScanner')) {
-      // document.getElementById("tblLoadImage").style.top = ds_gettop(document.getElementById("pNoScanner")) + pNoScanner.offsetHeight + "px";
-      // document.getElementById("tblLoadImage").style.left = ds_getleft(document.getElementById("pNoScanner")) + 0 + "px";
-    }
-    return false;
-  }
-
-  closetblLoadImage_onclick() {
-    document.getElementById('tblLoadImage').style.visibility = 'hidden';
-    document.getElementById('Resolution').style.visibility = 'visible';
-    return false;
-  }
-
-  // --------------------------------------------------------------------------------------
-  // ************************** Used a lot *****************************
-  // --------------------------------------------------------------------------------------
-  updatePageInfo() {
-    const totalImage: any = document.getElementById('DW_TotalImage');
-    const currentImage: any = document.getElementById('DW_CurrentImage');
-    if (totalImage) { totalImage.value = this.DWObject.HowManyImagesInBuffer; }
-    if (currentImage) {
-      currentImage.value = this.DWObject.CurrentImageIndexInBuffer + 1;
-    }
-  }
-
-  appendMessage(strMessage) {
-    this._strTempStr += strMessage;
-    const _divMessageContainer = document.getElementById('DWTemessage');
-    if (_divMessageContainer) {
-      _divMessageContainer.innerHTML = this._strTempStr;
-      _divMessageContainer.scrollTop = _divMessageContainer.scrollHeight;
-    }
-  }
-
-  checkIfImagesInBuffer() {
-    if (this.DWObject.HowManyImagesInBuffer === 0) {
-      this.appendMessage('There is no image in buffer.<br />');
-      return false;
-    } else { return true; }
-  }
-
-  checkErrorString() {
-    return this.checkErrorStringWithErrorCode(
-      this.DWObject.ErrorCode,
-      this.DWObject.ErrorString
-    );
-  }
-
-  checkErrorStringWithErrorCode(errorCode, errorString, responseString = null) {
-    if (errorCode === 0) {
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' + errorString + '</b></span><br />'
-      );
-
-      return true;
-    }
-    if (errorCode === -2115) {
-      // Cancel file dialog
-      return true;
-    }
-    else {
-      if (errorCode === -2003) {
-        const ErrorMessageWin = window.open(
-          '',
-          'ErrorMessage',
-          'height=500,width=750,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no'
-        );
-        ErrorMessageWin.document.writeln(responseString); // this.DWObject.HTTPPostResponseString);
-      }
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' + errorString + '</b></span><br />'
-      );
-      return false;
-    }
-  }
-  // --------------------------------------------------------------------------------------
-  // ************************** Used a lot *****************************
-  // --------------------------------------------------------------------------------------
-  ds_getleft(el) {
-    let tmp = el.offsetLeft;
-    el = el.offsetParent;
-    while (el) {
-      tmp += el.offsetLeft;
-      el = el.offsetParent;
-    }
-    return tmp;
-  }
-  ds_gettop(el) {
-    let tmp = el.offsetTop;
-    el = el.offsetParent;
-    while (el) {
-      tmp += el.offsetTop;
-      el = el.offsetParent;
-    }
-    return tmp;
-  }
-
-  Over_Out_DemoImage(obj, url) {
-    obj.src = url;
-  }
-  source_onchange() {
-    if (document.getElementById('divTwainType')) {
-      document.getElementById('divTwainType').style.display = '';
-    }
-
-    if (document.getElementById('source')) {
-      const cIndex = (document.getElementById('source') as HTMLSelectElement)
-        .selectedIndex;
-      if (Dynamsoft.Lib.env.bMac) {
-        const strSourceName = this.DWObject.GetSourceNameItems(cIndex);
-        if (strSourceName.indexOf('ICA') === 0) {
-          if (document.getElementById('lblShowUI')) {
-            document.getElementById('lblShowUI').style.display = 'none';
-          }
-          if (document.getElementById('ShowUI')) {
-            document.getElementById('ShowUI').style.display = 'none';
-          }
-        } else {
-          if (document.getElementById('lblShowUI')) {
-            document.getElementById('lblShowUI').style.display = '';
-          }
-          if (document.getElementById('ShowUI')) {
-            document.getElementById('ShowUI').style.display = '';
-          }
-        }
-      } else { this.DWObject.SelectSourceByIndex(cIndex); }
-    }
-  }
-
-  mediaType_onchange() {
-    const MediaType: any = document.getElementById('MediaType');
-    if (MediaType && MediaType.options.length > 0) {
-      const valueMediaType = MediaType.options[MediaType.selectedIndex].text;
-      if (valueMediaType !== '') {
-        if (!this.DWObject.Addon.Webcam.SetMediaType(valueMediaType)) {
-          this.appendMessage('<b>Error setting MediaType value: </b>');
-          this.appendMessage(
-            '<span style=\'color:#cE5E04\'><b>' +
-            this.DWObject.ErrorString +
-            '</b></span><br />'
-          );
-          return;
-        }
-      }
-    }
-
-    const ResolutionWebcam: any = document.getElementById('ResolutionWebcam');
-    if (ResolutionWebcam) {
-      ResolutionWebcam.options.length = 0;
-      const aryResolution = this.DWObject.Addon.Webcam.GetResolution();
-      const countResolution = aryResolution.GetCount();
-      for (let i = 0; i < countResolution; i++) {
-        const value = aryResolution.Get(i);
-        ResolutionWebcam.options.add(new Option(value, value));
-      }
-    }
-  }
-
-  /*-----------------Acquire Image---------------------*/
-
-  acquireImage() {
-    const cIndex = (document.getElementById('source') as HTMLSelectElement)
-      .selectedIndex;
-    if (cIndex < 0) { return; }
-
-    this.DWObject.SelectSourceByIndex(cIndex);
-    this.DWObject.CloseSource();
-    this.DWObject.OpenSource();
-    this.DWObject.IfShowUI = (document.getElementById(
-      'ShowUI'
-    ) as HTMLInputElement).checked;
-
-    let i;
-    for (i = 0; i < 3; i++) {
-      if (
-        (document.getElementsByName('PixelType').item(i) as HTMLInputElement)
-          .checked === true
-      ) {
-        this.DWObject.PixelType = i;
-      }
-    }
-    if (this.DWObject.ErrorCode !== 0) {
-      this.appendMessage('<b>Error setting PixelType value: </b>');
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' +
-        this.DWObject.ErrorString +
-        '</b></span><br />'
-      );
-    }
-    this.DWObject.Resolution = (document.getElementById(
-      'Resolution'
-    ) as HTMLInputElement).value;
-    if (this.DWObject.ErrorCode !== 0) {
-      this.appendMessage('<b>Error setting Resolution value: </b>');
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' +
-        this.DWObject.ErrorString +
-        '</b></span><br />'
-      );
-    }
-
-    const bADFChecked = (document.getElementById('ADF') as HTMLInputElement)
-      .checked;
-    this.DWObject.IfFeederEnabled = bADFChecked;
-    if (bADFChecked === true && this.DWObject.ErrorCode !== 0) {
-      this.appendMessage('<b>Error setting ADF value: </b>');
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' +
-        this.DWObject.ErrorString +
-        '</b></span><br />'
-      );
-    }
-
-    const bDuplexChecked = (document.getElementById(
-      'Duplex'
-    ) as HTMLInputElement).checked;
-    this.DWObject.IfDuplexEnabled = bDuplexChecked;
-    if (bDuplexChecked === true && this.DWObject.ErrorCode !== 0) {
-      this.appendMessage('<b>Error setting Duplex value: </b>');
-      this.appendMessage(
-        '<span style=\'color:#cE5E04\'><b>' +
-        this.DWObject.ErrorString +
-        '</b></span><br />'
-      );
-    }
-    if (
-      Dynamsoft.Lib.env.bWin ||
-      (!Dynamsoft.Lib.env.bWin && this.DWObject.ImageCaptureDriverType === 0)
-    ) {
-      this.appendMessage(
-        'Pixel Type: ' +
-        this.DWObject.PixelType +
-        '<br />Resolution: ' +
-        this.DWObject.Resolution +
-        '<br />'
-      );
-    }
-    this.DWObject.IfDisableSourceAfterAcquire = true;
-    this.DWObject.AcquireImage();
-  }
-
-  /*-----------------Load Image---------------------*/
-  btnLoadImagesOrPDFs_onclick() {
-
-    const OnPDFSuccess = () => {
-      this.appendMessage('Loaded an image successfully.<br/>');
-      this.updatePageInfo();
-    };
-
-    const OnPDFFailure = (errorCode, errorString) => {
-      this.checkErrorStringWithErrorCode(errorCode, errorString);
-    };
-
-    this.DWObject.IfShowFileDialog = true;
-    this.DWObject.Addon.PDF.SetResolution(200);
-    this.DWObject.Addon.PDF.SetConvertMode(
-      Dynamsoft.DWT.EnumDWT_ConvertMode.CM_RENDERALL
-    );
-    this.DWObject.LoadImageEx(
-      '',
-      Dynamsoft.DWT.EnumDWT_ImageType.IT_ALL,
-      OnPDFSuccess,
-      OnPDFFailure
-    );
-  }
-
-  // --------------------------------------------------------------------------------------
-  // ************************** Edit Image ******************************
-
-  // --------------------------------------------------------------------------------------
-  btnShowImageEditor_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.ShowImageEditor();
-  }
-
-  btnRotateRight_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.RotateRight(this.DWObject.CurrentImageIndexInBuffer);
-    this.appendMessage('<b>Rotate right: </b>');
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-  btnRotateLeft_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.RotateLeft(this.DWObject.CurrentImageIndexInBuffer);
-    this.appendMessage('<b>Rotate left: </b>');
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-
-  btnRotate180_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.Rotate(this.DWObject.CurrentImageIndexInBuffer, 180, true);
-    this.appendMessage('<b>Rotate 180: </b>');
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-
-  btnMirror_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.Mirror(this.DWObject.CurrentImageIndexInBuffer);
-    this.appendMessage('<b>Mirror: </b>');
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-  btnFlip_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.Flip(this.DWObject.CurrentImageIndexInBuffer);
-    this.appendMessage('<b>Flip: </b>');
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-
-  /*----------------------Crop Method---------------------*/
-  btnCrop_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    if (
-      this._iLeft !== 0 ||
-      this._iTop !== 0 ||
-      this._iRight !== 0 ||
-      this._iBottom !== 0
-    ) {
-      this.DWObject.Crop(
-        this.DWObject.CurrentImageIndexInBuffer,
-        this._iLeft,
-        this._iTop,
-        this._iRight,
-        this._iBottom
-      );
-      this._iLeft = 0;
-      this._iTop = 0;
-      this._iRight = 0;
-      this._iBottom = 0;
-      this.appendMessage('<b>Crop: </b>');
-      if (this.checkErrorString()) {
-        return;
-      }
-      return;
-    } else {
-      this.appendMessage(
-        '<b>Crop: </b>failed. Please first select the area you\'d like to crop.<br />'
-      );
-    }
-  }
-  /*----------------Change Image Size--------------------*/
-  btnChangeImageSize_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    switch (document.getElementById('ImgSizeEditor').style.visibility) {
-      case 'visible':
-        document.getElementById('ImgSizeEditor').style.visibility = 'hidden';
-        break;
-      case 'hidden':
-        document.getElementById('ImgSizeEditor').style.visibility = 'visible';
-        break;
-      default:
-        break;
-    }
-    // document.getElementById("ImgSizeEditor").style.top = ds_gettop(document.getElementById("btnChangeImageSize")) + document.getElementById("btnChangeImageSize").offsetHeight + 15 + "px";
-    // document.getElementById("ImgSizeEditor").style.left = ds_getleft(document.getElementById("btnChangeImageSize")) - 14 + "px";
-
-    const iWidth = this.DWObject.GetImageWidth(
-      this.DWObject.CurrentImageIndexInBuffer
-    );
-    if (iWidth !== -1) {
-      (document.getElementById('img_width') as HTMLInputElement).value = iWidth;
-    }
-    const iHeight = this.DWObject.GetImageHeight(
-      this.DWObject.CurrentImageIndexInBuffer
-    );
-    if (iHeight !== -1) {
-      (document.getElementById(
-        'img_height'
-      ) as HTMLInputElement).value = iHeight;
-    }
-  }
-  btnCancelChange_onclick() {
-    document.getElementById('ImgSizeEditor').style.visibility = 'hidden';
-  }
-
-  btnChangeImageSizeOK_onclick() {
-    document.getElementById('img_height').className = '';
-    document.getElementById('img_width').className = '';
-    if (
-      !this.re.test(
-        (document.getElementById('img_height') as HTMLInputElement).value
-      )
-    ) {
-      document.getElementById('img_height').className += ' invalid';
-      document.getElementById('img_height').focus();
-      this.appendMessage('Please input a valid <b>height</b>.<br />');
-      return;
-    }
-    if (
-      !this.re.test(
-        (document.getElementById('img_width') as HTMLInputElement).value
-      )
-    ) {
-      document.getElementById('img_width').className += ' invalid';
-      document.getElementById('img_width').focus();
-      this.appendMessage('Please input a valid <b>width</b>.<br />');
-      return;
-    }
-    this.DWObject.ChangeImageSize(
-      this.DWObject.CurrentImageIndexInBuffer,
-      (document.getElementById('img_width') as HTMLInputElement).value,
-      (document.getElementById('img_height') as HTMLInputElement).value,
-      (document.getElementById('InterpolationMethod') as HTMLSelectElement)
-        .selectedIndex + 1
-    );
-    this.appendMessage('<b>Change Image Size: </b>');
-    if (this.checkErrorString()) {
-      document.getElementById('ImgSizeEditor').style.visibility = 'hidden';
-      return;
-    }
-  }
-  // --------------------------------------------------------------------------------------
-  // ************************** Save Image***********************************
-  // --------------------------------------------------------------------------------------
-
-
-  btnSave_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    const strimgType_save = 'pdf';
-
-    this.DWObject.IfShowFileDialog = true;
-    const _txtFileNameforSave: any = document.getElementById('txt_fileName');
-    if (_txtFileNameforSave) { _txtFileNameforSave.className = ''; }
-    let bSave: any = false;
-
-    const strFilePath = _txtFileNameforSave.value + '.' + strimgType_save;
-
-    const OnSuccess = () => {
-      this.appendMessage('<b>Save Image: </b>');
-      this.checkErrorStringWithErrorCode(0, 'Successful.');
-    };
-
-    const OnFailure = (errorCode, errorString) => {
-      this.checkErrorStringWithErrorCode(errorCode, errorString);
-    };
-
-    bSave = this.DWObject.SaveAllAsPDF(strFilePath, OnSuccess, OnFailure);
-
-    if (bSave) { this.appendMessage('<b>Save Image: </b>'); }
-    if (this.checkErrorString()) {
-      return;
-    }
-  }
-  // --------------------------------------------------------------------------------------
-  // ************************** Upload Image***********************************
-  // --------------------------------------------------------------------------------------
-  makeid(length) {
-    let result = '';
-    const characters =
-      'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-    const charactersLength = characters.length;
-    for (let i = 0; i < length; i++) {
-      result += characters.charAt(Math.floor(Math.random() * charactersLength));
-    }
-    return result;
-  }
-
-  convertToBlob() {
-    this.DocumentScanService.uploadStart.emit(true);
-    const pages = [];
-    for (let index = 0; index < this.DWObject?.HowManyImagesInBuffer; index++) {
-      pages.push(index);
-    }
-    this.DWObject.ConvertToBlob(
-      pages,
-      Dynamsoft.DWT.EnumDWT_ImageType.IT_PDF,
-      (result, indices, type) => {
-        result.lastModifiedDate = new Date();
-        result.name = 'scan-' + this.datePipe.transform(result.lastModifiedDate, 'dd-MM-yyyy') + '.pdf';
-        this.DocumentScanService.uploadBatch(result).subscribe((batch) => {
-          batch.forEach(doc => {
-            this.file.next(doc);
-          });
-        });
-      },
-      (errorCode, errorString) => {
-        console.log(errorString);
-        this.DocumentScanService.uploadStart.emit(false);
-      }
-    );
-  }
-
-
-  convertToBlobForSaving() {
-    const pages = [];
-    for (let index = 0; index < this.DWObject?.HowManyImagesInBuffer; index++) {
-      pages.push(index);
-    }
-    this.DWObject.ConvertToBlob(
-      pages,
-      Dynamsoft.DWT.EnumDWT_ImageType.IT_PDF,
-      (result, indices, type) => {
-        result.lastModifiedDate = new Date();
-        result.name = 'scan-' + this.datePipe.transform(result.lastModifiedDate, 'dd-MM-yyyy') + '.pdf';
-        this.DocumentScanService.storedFile = result;
-        this.onMinimizingSubscription ? this.onMinimizingSubscription.unsubscribe() : '';
-      },
-      (errorCode, errorString) => {
-        console.log(errorString);
-      }
-    );
-  }
-  // --------------------------------------------------------------------------------------
-  // ************************** Navigator functions***********************************
-  // --------------------------------------------------------------------------------------
-
-  btnFirstImage_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.CurrentImageIndexInBuffer = 0;
-    this.updatePageInfo();
-  }
-
-  btnPreImage_wheel() {
-    if (this.DWObject.HowManyImagesInBuffer !== 0) { this.btnPreImage_onclick(); }
-  }
-
-  btnNextImage_wheel() {
-    if (this.DWObject.HowManyImagesInBuffer !== 0) { this.btnNextImage_onclick(); }
-  }
-
-  btnPreImage_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    } else if (this.DWObject.CurrentImageIndexInBuffer === 0) {
-      return;
-    }
-    this.DWObject.CurrentImageIndexInBuffer =
-      this.DWObject.CurrentImageIndexInBuffer - 1;
-    this.updatePageInfo();
-  }
-  btnNextImage_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    } else if (
-      this.DWObject.CurrentImageIndexInBuffer ===
-      this.DWObject.HowManyImagesInBuffer - 1
-    ) {
-      return;
-    }
-    this.DWObject.CurrentImageIndexInBuffer =
-      this.DWObject.CurrentImageIndexInBuffer + 1;
-    this.updatePageInfo();
-  }
-
-  btnLastImage_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.CurrentImageIndexInBuffer =
-      this.DWObject.HowManyImagesInBuffer - 1;
-    this.updatePageInfo();
-  }
-
-  btnRemoveCurrentImage_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.RemoveAllSelectedImages();
-    if (this.DWObject.HowManyImagesInBuffer === 0) {
-      (document.getElementById(
-        'DW_TotalImage'
-      ) as HTMLInputElement).value = this.DWObject.HowManyImagesInBuffer;
-      (document.getElementById('DW_CurrentImage') as HTMLInputElement).value =
-        '';
-      return;
-    } else {
-      this.updatePageInfo();
-    }
-  }
-
-  btnRemoveAllImages_onclick() {
-    if (!this.checkIfImagesInBuffer()) {
-      return;
-    }
-    this.DWObject.RemoveAllImages();
-    (document.getElementById('DW_TotalImage') as HTMLInputElement).value = '0';
-    (document.getElementById('DW_CurrentImage') as HTMLInputElement).value = '';
-  }
-  setlPreviewMode() {
-    const varNum = parseInt(
-      (
-        (document.getElementById('DW_PreviewMode') as HTMLSelectElement)
-          .selectedIndex + 1
-      ).toString(),
-      10
-    );
-    const btnCrop: any = document.getElementById('btnCrop');
-    if (btnCrop) {
-      let tmpstr = btnCrop.src;
-      if (varNum > 1) {
-        tmpstr = tmpstr.replace('Crop.', 'Crop_gray.');
-        btnCrop.src = tmpstr;
-        btnCrop.onclick = function () { };
-      } else {
-        tmpstr = tmpstr.replace('Crop_gray.', 'Crop.');
-        btnCrop.src = tmpstr;
-        btnCrop.onclick = () => {
-          this.btnCrop_onclick();
-        };
-      }
-    }
-
-    this.DWObject.SetViewMode(varNum, varNum);
-    if (Dynamsoft.Lib.env.bMac || Dynamsoft.Lib.env.bLinux) {
-      return;
-    } else if (
-      (document.getElementById('DW_PreviewMode') as HTMLSelectElement)
-        .selectedIndex !== 0
-    ) {
-      this.DWObject.MouseShape = true;
-    } else {
-      this.DWObject.MouseShape = false;
-    }
-  }
-
-  // --------------------------------------------------------------------------------------
-  // *********************************radio response***************************************
-  // --------------------------------------------------------------------------------------
-  rdTIFF_onclick() {
-    const _chkMultiPageTIFF: any = document.getElementById('MultiPageTIFF');
-    _chkMultiPageTIFF.disabled = false;
-    _chkMultiPageTIFF.checked = false;
-
-    const _chkMultiPagePDF: any = document.getElementById('MultiPagePDF');
-    _chkMultiPagePDF.checked = false;
-    _chkMultiPagePDF.disabled = true;
-  }
-
-  rdPDF_onclick() {
-    const _chkMultiPageTIFF: any = document.getElementById('MultiPageTIFF');
-    _chkMultiPageTIFF.checked = false;
-    _chkMultiPageTIFF.disabled = true;
-
-    const _chkMultiPagePDF: any = document.getElementById('MultiPagePDF');
-    _chkMultiPagePDF.disabled = false;
-    _chkMultiPagePDF.checked = true;
-  }
-
-  rd_onclick() {
-    const _chkMultiPageTIFF: any = document.getElementById('MultiPageTIFF');
-    _chkMultiPageTIFF.checked = false;
-    _chkMultiPageTIFF.disabled = true;
-
-    const _chkMultiPagePDF: any = document.getElementById('MultiPagePDF');
-    _chkMultiPagePDF.checked = false;
-    _chkMultiPagePDF.disabled = true;
-  }
-
-  // --------------------------------------------------------------------------------------
-  // ************************** Dynamic Web TWAIN Events***********************************
-  // --------------------------------------------------------------------------------------
-
-  Dynamsoft_OnPostTransfer = () => {
-    this.updatePageInfo();
-  }
-
-  Dynamsoft_OnPostLoadfunction = (path, name, type) => {
-    this.updatePageInfo();
-  }
-
-  Dynamsoft_OnPostAllTransfers = () => {
-    this.DWObject.CloseSource();
-    this.updatePageInfo();
-    this.checkErrorString();
-  }
-
-  Dynamsoft_OnMouseClick = index => {
-    this.updatePageInfo();
-  }
-
-  Dynamsoft_OnMouseRightClick = index => {
-    // To add
-  }
-
-  Dynamsoft_OnImageAreaSelected = (index, left, top, right, bottom) => {
-    this._iLeft = left;
-    this._iTop = top;
-    this._iRight = right;
-    this._iBottom = bottom;
-  }
-
-  Dynamsoft_OnImageAreaDeselected = index => {
-    this._iLeft = 0;
-    this._iTop = 0;
-    this._iRight = 0;
-    this._iBottom = 0;
-  }
-
-  Dynamsoft_OnMouseDoubleClick() {
-    return;
-  }
-
-  Dynamsoft_OnTopImageInTheViewChanged = index => {
-    this._iLeft = 0;
-    this._iTop = 0;
-    this._iRight = 0;
-    this._iBottom = 0;
-    this.DWObject.CurrentImageIndexInBuffer = index;
-    this.updatePageInfo();
-  }
-
-  Dynamsoft_OnGetFilePath = (bSave, count, index, path, name) => { };
-}