@mstechusa/eviewer7 NPM

eViewer

A HTML5-based document viewer built on Angular and JavaScript technologies for the highest level of performance and integration into your applications. eViewer is multi-platform, multi-device compatible to provide the greatest versatility and amazing user experience.

Supported platform

eViewer requires the following for deployment:

Server OS: Linux(x64) excluding Alpine, Windows(x64)
Java: 8 and higher or .Net Core

eViewer Installation

Install the dependencies and devDependencies and start the server.

Install eViewer

npm i @mstechusa/eviewer7 --save

Import and instantiate eViewer

    import eViewerApp from "eviewer7/js/eViewer7";
    this.eViewerObj = new eViewerApp("demoUser");
	var options = {
		contextMenuOptions: {
		  overrideContextMenus: false,
		  location: [
			"documentView",
			"pageThumbnails",
			"docThumbnails",
			"toolbar",
			"docTab",
		  ],
		},
	};
	eViewerObj
		.loadViewer("viewer", null, null, "best-fit", options)
		.then(() => {
			eViewerObj.registerLicense(licenseKey);
			setViewerOptions();
		});		
	});

    await import("@mstechusa/eviewer7/styles.css");
    await import("@mstechusa/eviewer7/scripts");
    await import("@mstechusa/eviewer7/runtime");
    await import("@mstechusa/eviewer7/polyfills");
    await import("@mstechusa/eviewer7/main");
    await import("@mstechusa/eviewer7/js/events");

Load Document

    let docUrl = "http://www.africau.edu/images/default/sample.pdf";
    let saveUrl = "";
    let serverUrl = "";
    let annotationUrl = "";
    let userName = "demouser";
    let isEditMode = true;
    let repoType = "filesystem";
    let fileName = "";
    let password = "";

    let savePayloadType = 'multipart/form-data';
    // let savePayloadType = 'application/json;

    let options = {
      type: "GET",
      headers: {
        Authorization:
          "Bearer ",
      },
      savePayLoadType: savePayloadType,
    };
	
	this.eViewerObj.setDocumentEndPointOptions(options, serverUrl, saveUrl, userName);
    let documentSrvc = this.eViewerObj.getDocumentService();
	let clientDocID = "client_" + uuid();
    documentSrvc
      .loadDocumentWithOptions(
        docUrl,
        annotationUrl,
		clientDocID,
        userName,
        // optional parmeters
		{
          isEditMode: true,
          repoType: "filesystem",
          password: "",
          landingPage: this.state.landingPgNo,
		  pageFilters: this.getPageVisibility(),
          tabStyle: {
             backgroundColor: "white",
             color: "black",
             fontWeight: "900",
             fontStyle: "italic",
             fileName: "OUTFOCUS",
             icon: "",
           },
           focusTabStyle: {
             backgroundColor: "red",
             color: "white",
             fontWeight: "900",
             fontStyle: "underline",
             fileName: "INFOCUS",
             icon: "",
           },		  
        }
      )
      .then((response) => {
        console.log("Document laoded");
      });