Client-side preferences

<< Click to Display Table of Contents >>

Navigation:  Gnostice Document Studio .NET > Going Deeper > Document Viewing > ASP.NET > Customizing the look and feel >

Client-side preferences

The appearance and behavior of the ASP.NET Document Viewer can be customized to match the overall user interface of the web application. Most of the appearance related preferences are specified on the client-side using JavaScript.

 

The following code snippet shows how to pass the preferences when constructing the document viewer object in JavaScript.

 

 

    var documentViewer;

    $(document).ready(function() {

      var preferences = new gnostice.Preferences();

      

      // Specifies whether the toolbar of the viewer should be displayed.
      preferences.toolbarVisible = true;
 
      // Specifies whether only the needed pages of the document should be rendered.
      preferences.lazyLoading = true;
 
      // Specifies whether status notification should be shown.
      preferences.showStatusNotifications = true;
 
      // Specifies whether full screen control needs to be displayed.
      preferences.visibleFullScreen = true;
 
      // Specifies initial view settings with which document when loaded needs to be displayed.
      preferences.initialView.zoomValue = gnostice.ZoomMode.actualSize;
      preferences.initialView.rotationAngle = gnostice.RotationAngle.zero;
      preferences.initialView.colorInversionApplied = false;
      preferences.initialView.navigationPaneOpened = true;
 
      // Specifies whether file operation controls needs to be displayed.
      preferences.visibleFileOperationControls.open = true;
      preferences.visibleFileOperationControls.download = true;
      preferences.visibleFileOperationControls.downloadAs = true;
      preferences.visibleFileOperationControls.print = true;
      preferences.visibleFileOperationControls.save = true;
      preferences.visibleFileOperationControls.propertiesInfo = true;
      preferences.visibleFileOperationControls.unlockRestrictedPdf = true;
 
      // Specifies whether page navigation controls needs to be displayed.
      preferences.visibleNavigationControls.firstPage = true;
      preferences.visibleNavigationControls.prevPage = true;
      preferences.visibleNavigationControls.nextPage = true;
      preferences.visibleNavigationControls.lastPage = true;
      preferences.visibleNavigationControls.pageIndicator = true;
      preferences.visibleNavigationControls.gotoPage = true;
 
      // Specifies whether page magnification controls needs to be displayed.
      preferences.visibleZoomControls.zoomIn = true;
      preferences.visibleZoomControls.zoomOut = true;
      preferences.visibleZoomControls.fixedSteps = true;
 
      // Specifies whether page rotation operation controls needs to be displayed.
      preferences.visibleRotationControls.clockwise = true;
      preferences.visibleRotationControls.counterClockwise = true;
 
      // Specifies whether color inversion controls needs to be displayed.
      preferences.visibleColorInversionControls.allPages = true;
 
      // Specifies whether signature controls needs to be displayed.
      preferences.visibleSignatureControls.sign = true;
 
      // Specifies navigation pane settings for navigation controls.
      preferences.navigationPane.visible = true;
      preferences.navigationPane.width = 180;
      preferences.navigationPane.position = gnostice.NavigationPanePosition.auto;
      preferences.navigationPane.enableThumbnails = true;
      preferences.navigationPane.enableBookmarks = true;
 
      // Specifies text search operation controls.
      preferences.search.enableQuickSearch = true;
      preferences.search.visibleQuickSearchControls = true;
      preferences.search.highlightColor = "yellow";
 
      // Specifies hyperlink access settings.
      preferences.security.hyperlinkNavigation.access = gnostice.HyperlinkAccess.alwaysAsk;
 
      // Specifies password dialog settings.
      preferences.security.password.enablePasswordDialog = true;
      preferences.security.password.maxNumberOfPasswordRetries = 3;
 
      // Specifies settings for form fields.
      preferences.interactiveElements.form.highlightColor = "rgba(204, 215, 255, 0.5)";
      preferences.interactiveElements.form.readonlyColor = "rgba(128, 128, 128, 0.5)";
      preferences.interactiveElements.form.focusColor = "rgba(255, 255, 255, 0.8)";
      preferences.interactiveElements.form.listContainerBackgroundColor = "rgba(255, 255, 255, 1)";
      preferences.interactiveElements.form.listItemHoverBackgroundColor = "";
      preferences.interactiveElements.form.allowJavaScriptExecution = true;
 
      // Specifies settings for annotations.
      preferences.interactiveElements.annotations.commentsPanelDisplayColor = "rgb(255, 245, 245)";
      preferences.interactiveElements.annotations.userFieldDisplayColor = "blue";
 
      // Specifies settings for signature fields.
      preferences.interactiveElements.signatures.strokeColor = "black";
      preferences.interactiveElements.signatures.strokeWidth = gnostice.StrokeWidth.Thin;
      preferences.interactiveElements.signatures.allowSavingUserSignatures = true;
      preferences.interactiveElements.signatures.maxNumberOfSavedUserSignatures = 2;
      preferences.interactiveElements.signatures.allowCreatingNewUserSignatures = true;
      preferences.interactiveElements.signatures.allowUploadingNewUserSignatures = true;
      preferences.interactiveElements.signatures.allowDeletingUserSignatures = true;
      preferences.interactiveElements.signatures.maxNumberOfSignaturesAllowedPerPage = -1;
      preferences.interactiveElements.signatures.maxNumberOfSignaturesAllowedPerDocument = -1;
 

      // Specifies printing related settings.
      preferences.print.fitToPaperShrink = false;
      preferences.print.fitToPaperExpand = false;
      preferences.print.centerOnPaper = false;
      preferences.print.paperSize = "A4";

 
    // Specifies UI language selection settings.
     preferences.localization.language = "en_US";
     preferences.localization.resourcePath = "Scripts/localization/";

 

     documentViewer = new gnostice.DocumentViewer('doc-viewer-id', preferences);

    });

 

 

 

 

The DocumentViewer.preferences object groups all the preferences under one head. Directly under it are the top-level settings while other related settings are placed under sub-groups.

Top level preferences

The following preferences are directly under the DocumentViewer.preferences object.

Property

Type

Default Value

Description

toolbarVisible

Boolean

true

Specifies whether toolbar of the viewer should be displayed.

lazyLoading

Boolean

true

Specifies whether all the pages of the document should be continued to be loaded and displayed in the background after the viewer frame is loaded. If set to true then the pages will be loaded on need basis.

showStatusNotifications

Boolean

false

Specifies whether status notifications should be shown.

visibleFullScreen

Boolean

true

Specifies whether full-screen control needs to be displayed.

Initial view preferences

These preferences are used to specify the view settings with which the first document is loaded. They are under the DocumentViewer.preferences.initialView object.

Property

Type

Default Value

Description

zoomValue

Enumeration or number

actualSize

Specifies page magnification with which a document needs to be displayed. Possible values are a number (ex. 100 for 100% zoom), or ZoomMode.fitWidth, ZoomMode.fitHeight, ZoomMode.fitPage, and ZoomMode.actualSize.

rotationAngle

Enumeration

zero

Specifies the rotation angle to be applied to the page contents within the viewer. Possible values are RotationAngle.zero, RotationAngle.clockwise90, RotationAngle.clockwise180, RotationAngle.clockwise270, RotationAngle.counterClockwise90, RotationAngle.counterClockwise180, and RotationAngle.counterClockwise270

colorInversionApplied

Boolean

false

Specifies whether color inversion should be applied when a document is displayed.

navigationPaneOpened

Boolean

true

Specifies whether the navigation pane should be opened.

Toolbar controls visibility preferences

These preferences are grouped into functionally related sub-groups. They control the visibility of individual toolbar controls.

Sub-group

Property

Type

Default Value

Description

File operation controls.

Settings are under preferences.visibleFileOperationControls object.

open

Boolean

true

Specifies whether "File Open" control needs to be displayed.

download

Boolean

true

Specifies whether "File Download" control needs to be displayed.

downloadAs

Boolean

true

Specifies whether "File DownloadAs" control needs to be displayed.

print

Boolean

true

Specifies whether "File Print" control needs to be displayed.

save

Boolean

true

Specifies whether "Save" control needs to be displayed.

propertiesInfo

Boolean

true

Specifies whether "Properties Info" control needs to be displayed.

unlockRestrictedPdf

Boolean

false

Specifies whether the unlock control needs to be displayed when a restricted (owner-password-protected) PDF is loaded.

Navigation controls.

settings are under preferences.visibleNavigationControls object.

firstPage

Boolean

true

Specifies whether first page control needs to be displayed.

prevPage

Boolean

true

Specifies whether previous page control needs to be displayed.

nextPage

Boolean

true

Specifies whether next page control needs to be displayed.

lastPage

Boolean

true

Specifies whether last page control needs to be displayed.

pageIndicator

Boolean

true

Specifies whether page indicator control needs to be displayed.

gotoPage

Boolean

true

Specifies whether goto page text input needs to be enabled.

Zoom controls.

Settings are under preferences.visibleZoomControls object.

zoomIn

Boolean

true

Specifies whether page zoom-in control needs to be displayed.

zoomOut

Boolean

true

Specifies whether page zoom-out control needs to be displayed.

fixedSteps

Boolean

true

Specifies whether page magnification drop-down options list needs to be displayed.

Rotation controls.

Settings are under preferences.visibleRotationControls object.

clockwise

Boolean

true

Specifies whether clockwise page rotation needs to be displayed.

counterClockwise

Boolean

true

Specifies whether counterClockwise page rotation needs to be displayed.

Color inversion controls.

Settings are under preferences.visibleColorInversionControls

allPages

Boolean

true

Specifies whether "All Pages Inversion Color" control needs to be displayed.

Signature controls.

Settings are under preferences.visibleSignatureControls

sign

Boolean

true

Specified whether signature controls need to be displayed.

Navigation pane preferences

These preferences control the appearance of the navigation pane that docks to the left edge of the main view. They are under the preferences.navigationPane.

Property

Type

Default Value

Description

visible

Boolean

true

Specifies whether the navigation pane is visible.

width

Integer

180

Specifies the width of the navigation pane in pixels.

position

Enumeration

auto

Specifies the position of the navigation pane. Possible values are NavigationPanePosition.auto, NavigationPanePosition.fixed, and NavigationPanePosition.float.

enableThumbnails

Boolean

true

Specifies whether the thumbnails tab is visible.

enableBookmarks

Boolean

true

Specifies whether the bookmarks tab is visible.

Text search preferences

These preferences control the appearance and behavior of the quick search functionality. They are under the preferences.search object.

Property

Type

Default Value

Description

enableQuickSearch

Boolean

true

Specifies whether quick search should be enabled.

visibleQuickSearchControls

Boolean

true

Specifies whether quick search control needs to be displayed on the toolbar.

highlightColor

String

yellow

Specifies the text highlight color for the search results in the viewer.

Security related preferences

The security related preferences are under the preferences.security object.

Sub-group

Property

Type

Default Value

Description

Hyperlink navigation.

Settings are under preferences.security.hyperlinkNavigation object.

access

Enumeration

alwaysAsk

Specifies access settings for embedded hyperlinks. Possible values are HyperlinkAccess.allow, HyperlinkAccess.block, HyperlinkAccess.alwaysAsk, and HyperlinkAccess.custom.

custom

Object

See table below.

Specifies custom security settings for embedded hyperlinks. See below for the details about this object.

Document open password.

Settings are under preferences.security.password object.

enablePasswordDialog

Boolean

true

Specifies whether to prompt for document open password when opening encrypted documents.

maxNumberOfPasswordRetries

Integer

3

Specifies the maximum number of attempts for entering the password to open the document.

Hyperlink access custom settings

The hyperlink settings are under the preferences.security.hyperlinkNavigation.custom object.

Property

Type

Default Value

Description

blockedSites

Array of string

<empty array>

Specifies list of blocked URLs.

trustedSites

Array of string

<empty array>

Specifies list of allowed URLs.

showPermissionDialog

Boolean

true

Specifies whether hyperlink access permission dialog box should be shown.

Interactive features preferences

These preferences are grouped under interactiveElements object and are further sub-grouped into functionally related settings. They control the appearance and behavior of interactive features such as PDF forms, annotations, and signatures.

Sub-group

Property

Type

Default Value

Description

PDF forms.

Settings are under preferences.interactiveElements.form object.

highlightColor

String

rgba(204, 215, 255, 0.5)

Specifies highlight color for the interactive form fields. Example: "rgba(204, 215, 255, 0.5)"

readonlyColor

String

rgba(128, 128, 128, 0.5)

Specifies color for the form fields which are read-only. Example "rgba(128, 128, 128, 0.5)"

focusColor

String

rgba(255, 255, 255, 0.8)

Specifies color for the form field which has focus. Default is the field background color as specified in the PDF file. Example "rgba(255, 255, 255, 0.8)"

listContainerBackgroundColor

String

rgba(255, 255, 255, 1)

Specifies background color for list containers such as combo box list. Default is white. Example "rgba(255, 255, 255, 1)"

listItemHoverBackgroundColor

String

rgba(204, 215, 255, 1)

Specifies background color for list item hover and selection. Default is form field highlight color with alpha value set to 1.

allowJavaScriptExecution

Boolean

true

Specifies whether JavaScript code present in the PDF file is allowed to be executed. Default is true.

PDF annotations.

Settings are under preferences.interactiveElements.annotations object.

commentsPanelDisplayColor

String

rgb(255, 245, 245)

Specifies the background color of the comments panel. Example "rgb(255, 245, 245)"

userFieldDisplayColor

String

blue

Specifies the foreground color of the user name text. Example "blue"

PDF hand-written signatures.

Settings are under preferences.interactiveElements.signatures object.

strokeColor

String

black

Specifies stroke color for drawing user signature in the viewer.

strokeWidth

Enumeration

Thin

Specifies stroke width for drawing user signature in the viewer. Possible values are StrokeWidth.Thin, StrokeWidth.Medium, and StrokeWidth.Thick.

allowSavingUserSignatures

Boolean

true

Specifies whether the user is shown the option to add their hand-written signature to the user signatures panel for later reuse.

maxNumberOfSavedUserSignatures

Integer

2

Specifies the maximum number of signatures that the user is allowed to add to the user signatures panel.

allowCreatingNewUserSignatures

Boolean

true

Specifies whether user should be allowed to create new user signatures.

allowUploadingNewUserSignatures

Boolean

true

Specifies whether user should be allowed to upload new user signatures.

allowDeletingUserSignatures

Boolean

true

Specifies whether user should be allowed to delete user signatures.

maxNumberOfSignaturesAllowedPerPage

Integer

-1 (unlimited)

Specifies maximum number of signatures allowed per page.

maxNumberOfSignaturesAllowedPerDocument

Integer

-1 (unlimited)

Specifies maximum number of signatures allowed per document.

Print preferences

These preferences are used to specify the printing related settings. They are under the preferences.print object.

Property

Type

Default Value

Description

fitToPaperShrink

Boolean

false

Specifies whether to shrink an oversize page to the paper size while printing.

fitToPaperExpand

Boolean

false

Specifies whether to expand a page to the paper size while printing.

centerOnPaper

Boolean

false

Specifies whether to center the page on the paper while printing.

paperSize

String

A4

Specifies the paper size to be used while printing. Supported values are: "A0", "A1", "A2", "A3", "A4", "A5", "B4", "B5", "Letter", "Legal", "Tabloid". This setting applies only when "fitToPaperShrink", "fitToPaperExpand" or "centerPages" setting is "true" and it ensures that the document viewer fits the contents of each page to the specified paper size. The user may still choose to override the paper size in the print dialog that the browser displays.

Localization preferences

These preferences are used to specify the localization of the document viewer. They are under the preferences.localization object.

Property

Type

Default Value

Description

language

String

en

Specifies current UI language.

resourcePath

String

Scripts/localization/

Specifies path of the resources containing the localized language strings.