Overview

About WebViewer

PDFTron WebViewer is a cross-platform solution that offers a seamless and effective way to embed viewing of PDF and other document formats directly within your Web application.

"View any document, anywhere."

Any document: By converting all supported document types into a web-optimized XPS based file, called XOD, the WebViewer is able to deliver consistent results in viewing different document types. With the support of PDFNet's virtual printer driver, any document type that can be printed to a printer can be converted to a XOD file!

Anywhere: the WebViewer is actually comprised of multiple browser clients: HTML5, mobile, Silverlight, and Flash. By default, WebViewer uses its HTML5 viewer as the preferred choice. It leverages the latest browser technologies to provide the most features (including annotations, DRM, and offline viewing). For users with older browsers, the Silverlight or Flash viewer will be loaded as a fallback to allow for maximum readership.

A summary of viewer technology preference
HTML5: IE9 and above, Firefox, Chrome, Safari, Opera
Mobile: Safari iOS 5 and above, Android 2.2 and above
Silverlight: IE7, IE8
Flash: IE6 or below

What's Included

The WebViewer solution consists of a universal viewer wrapper (WebViewer.js) and WebViewer implementations (ReaderControl) written in various browser technologies. WebViewer.js will detect users' browser environment and choose the best viewer technology to use.

WebViewer Package File Structure:
  • html5: folder containing the primary HTML5 and Mobile WebViewer
  • silverlight: folder containing the fallback Silverlight WebViewer
  • flash: folder containing the fallback Flash WebViewer
  • doc: documentation for WebViewer.js
  • samples a collection of WebViewer samples
  • WebViewer.js: the un-minified debug version of the universal WebViewer control
  • WebViewer.min.js: the minified universal WebViewer control
  • clientaccesspolicy.xml: a client access policy to be placed in the root web server folder to support Silverlight

Components

Components within WebViewer HTML5 Viewer:

The DocumentViewer is a control that provides the core features of XOD viewing. There are no menus or any other UI controls; this allows you to create drastically different UI layouts (e.g. your own custom flip page control.)
See: CoreControls.js DocViewer.html

The HTML5 ReaderControl is a full-feature, customizable control that builds on top of DocumentViewer. Provided is a UI menu for navigation, as well as a side panel for display information like thumbnail previews and bookmarks. The ReaderControl has all the features that a user would expect from a document reading application. There is also a customization framework that makes it easy to customize the look-and-feel, or even add your own custom features! The UI controls are compatible with jQuery UI themes, so it's easy to re-skin and re-brand the ReaderControl. Moreover, the ReaderControl provides a complete framework for annotations! While it is recommended to use the customization framework for any customizations, the source code for ReaderControl is publicly available and may be modified directly.
See: ReaderControl.js ReaderControl.html ReaderControl.css

The MobileReaderControl is an alternate ReaderControl based on HTML5 that is optimized for tablets and other mobile touch devices. This viewer provides the same core features of ReaderControl but presented in a different user interface that takes account of touch events and limited screen space.
See: MobileReaderControl.js MobileReaderControl.html

Components with WebViewer Silverlight & Flash:

Similar to HTML5, WebViewer Silverlight and Flash also have corresponding DocumentViewer and ReaderControl components. These are fully usable UI controls for reading XOD files as an alternative to HTML5. Note that these ReaderControls do not provide all the functionality supported in HTML5. Namely, these controls currently do not support annotations.