Using the DocumentViewer in Pure HTML and JavaScript

The new prerelease version of the TX Text Control DocumentViewer NuGet package allows you to host the required backend endpoints in an ASP.NET or ASP.NET Core Web Application. This backend can then be used by the Angular version of the DocumentViewer.

But this backend also allows you to initialize the TX Text Control DocumentViewer in a pure HTML and JavaScript environment.

In order to use this, you will have to create a trial access token to use the backend server.

Adding the Viewer to HTML

1. Add the Script tag to your HTML file in the head section:

   <script src="https://backend.textcontrol.com/TextControl/GetResource?Resource=minimized.tx-viewer.min.js&access-token=yourtoken"></script>

   view raw test.html hosted with ❤ by GitHub

   When hosted on your own, replace https://backend.textcontrol.com with your endpoint URL.

2. Add a hosting element to your HTML:

   <div id="txViewerHost"></div>

   view raw test.html hosted with ❤ by GitHub

3. Add the following script tag to your HTML and set the id of the hosting element to the containerID property:

   	<script>
   	// create a new DocumentViewer
   	TXDocumentViewer.init( {
   	containerID: 'txViewerHost',
   	viewerSettings: {
   	toolbarDocked: true,
   	dock: "Fill",
   	isSelectionActivated: true,
   	showThumbnailPane: true,
   	basePath: 'https://backend.textcontrol.com',
   	}
   	});
   	</script>

   view raw test.html hosted with ❤ by GitHub

   Also here, replace the basePath with your endpoint URL when hosted on your own.