WebThumbnailViewer JavaScript Client Class

WebThumbnailViewer Client Object

The LEADTOOLS WebThumbnailViewer control includes a client-side Javascript class to update the server control without posting the entire page back to the server. Most of the WebThumbnailViewer server properties can be accessed through the Javascript class. You can access the LEADTOOLS WebThumbnailViewer control on the client-side by using the ASP.NET generated ClientID on the WebForm.

Client Naming

The client-side version of the control uses the same naming convention as the server control version for easier coding. All Leadtools public class definitions in WebThumbnailViewer.js and Utilities.js contain the prefix "ltwf" to avoid conflicts with any other components on the page.

Client Public Methods/Properties

All server side object properties can be accessed on the client by using two methods: "GetServerPropertyName", and "SetServerPropertyName", where "ServerPropertyName" is replaced with the name of the property to be accessed or set.

The following table lists the Server properties and the mapped client methods:

Property\Method Name(Server)	Method Name(Client)	Description	Input Type
N/A	ID	Gets the web control identifier generated by ASP.NET.	-
WebThumbnailViewer.Add(imageUrl, firstPage, lastPage)	add(url: string, firstPageIndex: integer, lastPageIndex: integer);	Adds a new thumbnail element(s) from an image to the end of the WebThumbnailsViewer control.	url: String representing the image url. firstPageIndex: Int representing the 1-based index of the first page to load. lastPageIndex: Int representing the 1-based index of the last page to load. Must be greater than or equal to firstPageIndex. You can pass -1 to load from firstPageIndex to the last page in the file.
WebThumbnailViewer.Add(imageUrl, firstPage, lastPage, text)	add(url: string, firstPageIndex: integer, lastPageIndex: integer, thumbText: string);	Adds a new thumbnail element(s) from an image to the end of the WebThumbnailsViewer control and specify the thumbnail text.	url: String representing the image url. firstPageIndex: Int representing the 1-based index of the first page to load. lastPageIndex: Int representing the 1-based index of the last page to load. Must be greater than or equal to firstPageIndex. You can pass -1 to load from firstPageIndex to the last page in the file. thumbText: String representing thumbnail item text.
WebThumbnailViewer.Insert(imageUrl, firstPage, lastPage, thumbIndex)	insert(url: string, firstPageIndex: integer, lastPageIndex: integer, thumbIndex: integer);	Inserts a new thumbnail element(s) from an image to the specified index of the WebThumbnailsViewer control.	url: String representing the image url. firstPageIndex: Int representing the 1-based index of the first page to load. lastPageIndex: Int representing the 1-based index of the last page to load. Must be greater than or equal to firstPageIndex. You can pass -1 to load from firstPageIndex to the last page in the file. thumbIndex: Int representing the 0-based index at which the new thumbnail element(s) should be inserted.
WebThumbnailViewer.Insert(imageUrl, firstPage, lastPage, thumbIndex, text)	insert(url: string, firstPageIndex: integer, lastPageIndex: integer, thumbIndex: integer, thumbText: string);	Inserts a new thumbnail element(s) from an image to the specified index of the WebThumbnailsViewer control and specify the thumbnail text.	url: String representing the image url. firstPageIndex: Int representing the 1-based index of the first page to load. lastPageIndex: Int representing the 1-based index of the last page to load. Must be greater than or equal to firstPageIndex. You can pass -1 to load from firstPageIndex to the last page in the file. thumbIndex: Int representing the 0-based index at which the new thumbnail element(s) should be inserted. thumbText: String representing thumbnail item text.
BackColor	getBackColor():string setBackColor(value:String)	Gets or sets the background color of the control.	String representing the CSS background color.
BorderColor	getBorderColor():string setBorderColor(value:String)	Gets or sets the border color of the control.	String representing the CSS border color.
BorderStyle	getBorderStyle():string setBorderStyle(value:String)	Gets or sets the border style of the control.	String representing the CSS border style.
BorderWidth	getBorderWidth():int setBorderWidth(value:Int)	Gets or sets the border width of the web control.	Int representing the border width of the web control.
WebThumbnailViewer.Clear()	clear()	Removes all thumbnail elements from the WebThumbnailsViewer control.	-
Columns	getColumns():int setColumns(value:Int)	Gets or sets the number of columns of thumbnails there will be.	Int representing the number of columns of thumbnails.
Count	getCount():int	Gets the number of thumbnails in the viewer.	-
Width	getWidth():int setWidth(value:Int)	Gets or sets the width of the web control in pixels.	Int representing the width of the web control.
Height	getHeight():int setHeight(value:Int)	Gets or sets the height of the web control in pixels.	Int representing the height of the web control.
WebThumbnailViewer.HorizontalAlignMode	getHorizontalAlignMode():ImageViewerAlignMode setHorizontalAlignMode(value:ImageViewerAlignMode)	Gets or sets the horizontal alignment used when displaying the image.	ImageViewerAlignMode representing the horizontal alignment used when displaying the image. (0-2), 0:Near, 1:Center, 2:Far
WebThumbnailViewer.LayoutDirection	getLayoutDirection():Leadtools.Web.Controls.LayoutDirection setLayoutDirection(value:Leadtools.Web.Controls.LayoutDirection)	Gets or sets the orientation of the thumbnail viewer.	Leadtools.Web.Controls.LayoutDirection representing the orientation of the thumbnail viewer. (0-1), 0:Horizontal, 1:Vertical
WebThumbnailViewer.ResourcesPath	getResourcesPath():String	Gets the virtual path to where resources(icons, scripts) are located.	-
WebThumbnailViewer.Rows	getRows():int setRows(value:Int)	Gets or sets the number of rows of thumbnails there will be.	Int representing the number of rows of thumbnails there will be.
WebThumbnailViewer.SelectedIndex	getSelectedIndex():int setSelectedIndex(value:Int)	Gets or sets the 0-based index of the selected thumbnail.	Int representing the 0-based index of the selected thumbnail.
WebThumbnailViewer.SelectedThumbStyle	getSelectedThumbStyle():ThumbnailStyle	Gets the style of the selected thumbnail.	-
WebThumbnailViewer.GetThumbnailInfo	getThumbnailInfo():ltwfThumbnailInfo	Gets information about a specific thumbnail element.	-
WebThumbnailViewer.GetThumbnailText	getThumbnailText(thumbIndex: integer): string;	Get the thumbnail text for a specific thumbnail element.	thumbIndex: Int representing the 0-based index of the thumbnail element about which to obtain its text.
WebThumbnailViewer.SetThumbnailText	setThumbnailText(index: thumbIndex, thumbText: string);	Set the thumbnail text for a specific thumbnail element.	thumbIndex: Int representing the 0-based index of the thumbnail to be updated. thumbText: String representing the new thumbnail text.
WebThumbnailViewer.EnsureVisible	ensureVisible(thumbIndex: integer);	Ensures that the specified thumbnail item is visible within the control, scrolling the contents of the control if necessary.	thumbIndex: Int representing the 0-based index of thumbnail item to scroll into view.
WebThumbnailViewer.ThumbPadding	getThumbPadding():int setThumbPadding(value:Int)	Gets or sets the number of pixels padded around each thumbnail.	Int representing the number of pixels padded around each thumbnail.
WebThumbnailViewer.ThumbsDirection	getThumbsDirection():Leadtools.Web.Controls.ThumbnailsDirection setThumbsDirection(value:Leadtools.Web.Controls.ThumbnailsDirection)	Gets or sets the flow of the thumbnails.images.	ThumbnailsDirection represents the flow of the thumbnails.images. (0-1), 0:LeftToRight, 1:TopToBottom
WebThumbnailViewer.ThumbSize	getThumbSize():ltwfSize setThumbSize(value:ltwfSize)	Gets or sets the size (width/height) in pixels of the thumbnail.	ltwfSize representing the size (width/height) in pixels of the thumbnail.
WebThumbnailViewer.ThumbSpacing	getThumbSpacing():int setThumbSpacing(value:Int)	Gets or sets the number of pixels between each two adjacent thumbnails.	Int representing the number of pixels between each two adjacent thumbnails.
WebThumbnailViewer.ThumbStyle	getThumbStyle():ThumbnailStyle	Gets the style of the unselected thumbnail.	-
Tooltip	getTooltip():string setTooltip(value:String)	Gets the text displayed when the mouse hovers over the web control.	String representing the text displayed when the mouse hovers over the web control.
WebThumbnailViewer.VerticalAlignMode	getVerticalAlignMode():ImageViewerAlignMode setVerticalAlignMode(value:ImageViewerAlignMode)	Gets or sets the vertical alignment to display the image.	ImageViewerAlignMode (0-2), 0:Near, 1:Center, 2:Far.
WebThumbnailViewer.ShowItemText	getShowItemText(): boolean setShowItemText(value: boolean)	Gets or sets a value indicates whether the thumbnail item text is shown in the control or not.	true if the thumbnail text shown otherwise false.
WebThumbnailViewer.BrowserImageFormat	getBrowserImageFormat(): integer;	Gets the format of the thumbnail image to be displayed in the thumbnail viewer.	-
WebThumbnailViewer.ViewerID	getViewerID():string	Gets the ID of the WebImageViewer used to display the selected thumbnail.	-
WebThumbnailViewer.InputProfile	getInputProfile(): string setInputProfile(value: string)	Gets or sets the url of the XML file that contains the codecs options to be used as load options.	string url of the XML file that contains the codecs options to be used as load options.
WebThumbnailViewer.OutputProfile	getOutputProfile(): string setOutputProfile(value: string)	Gets or sets the url of the XML file that contains the options to be used as codecs save options for the image displayed by the WebThumbnailViewer.	string the url of the XML file that contains the options to be used as codecs save options for the image displayed by the WebThumbnailViewer.
Visible	getVisible():bool setVisible(value:Boolean)	Gets or sets whether show/hide the control on the web page.	String representing whether to show\hide the control. True to show the control; false to hide it.
N/A	Update(viewer: WebImageViewer);	Updates the current selected thumbnail element's image by the image of the passed WebImageViewer control.	viewer: The client javascript representation of the WebImageViewer control.

Client Public Events

All public client-side Leadtools events can be overridden with your own function. The following example displays a Javascript alert whenever the SelectedIndex property is changed on the WebThumbnailViewer client object.

WebThumbnailViewer1.SelectedIndexChanged = mySelectedIndexChanged; 
function mySelectedIndexChanged() 
{ 
  alert("SelectedIndex Changed!"); 
}

The following table lists the client-side events that can be overridden:

Event Name(Server)	Event Name(Client)	Raised when
N/A	BackColorChanged	BackColor property is changed.
N/A	BorderColorChanged	BorderColor property is changed.
N/A	BorderStyleChanged	BorderStyle property is changed.
N/A	BorderWidthChanged	BorderWidth property is changed.
WebThumbnailViewer.PropertyChanged	ColumnsChanged	Columns property is changed.
WebThumbnailViewer.PropertyChanged	HorizontalAlignModeChanged	HorizontalAlignMode property is changed.
WebThumbnailViewer.PropertyChanged	LayoutDirectionChanged	LayoutDirection property is changed.
WebThumbnailViewer.PropertyChanged	RowsChanged	Rows property is changed.
WebThumbnailViewer.PropertyChanged	SelectedIndexChanged	SelectedIndex property is changed.
WebThumbnailViewer.PropertyChanged	SelectedThumbStyleChanged	SelectedThumbStyle property is changed.
WebThumbnailViewer.PropertyChanged	ThumbPaddingChanged	ThumbPadding property is changed.
WebThumbnailViewer.PropertyChanged	ThumbsDirectionChanged	ThumbsDirection property is changed.
WebThumbnailViewer.PropertyChanged	ThumbSizeChanged	ThumbSize property is changed.
WebThumbnailViewer.PropertyChanged	ThumbSpacingChanged	ThumbSpacing property is changed.
WebThumbnailViewer.PropertyChanged	ThumbStyleChanged	ThumbStyle property is changed.
WebThumbnailViewer.PropertyChanged	VerticalAlignModeChanged	VerticalAlignMode property is changed.
WebThumbnailViewer.PropertyChanged	VerticalAlignModeChanged	VerticalAlignMode property is changed.
N/A	VisibleChanged	Visible property is changed.