WebImageViewer JavaScript Client Class

WebImageViewer Client Object

The LEADTOOLS WebImageViewer control includes a client-side Javascript class to update the server control without posting the entire page back to the server. Most of the WebImageViewer server properties can be accessed through the Javascript class. You can access the LEADTOOLS WebImageViewer 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 the WebImageViewer.js and Utilities.js files 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
WebImageViewer.ApplyCommand	ApplyCommand(cmd: XXXCommand);	Applies a client image processing command to the current image to process it.	cmd: any client image processing command to apply to the image.
N/A	ID	Gets the web control identifier generated by ASP.NET.	-
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.
WebImageViewer.DropShadowColor	getDropShadowColor():string setDropShadowColor(value:String)	Gets or sets the drop shadow color.	String representing the CSS drop shadow color.
WebImageViewer.DropShadowSize	getDropShadowSize():int setDropShadowSize(value:Int)	Gets or sets the shadow size of the frame that you add to image.	Int representing the shadow size.
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.
WebImageViewer.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
WebImageViewer.HorizontalRealScaleFactor	GetHorizontalRealScaleFactor():Double	Gets the real horizontal scale factor used to display the image.	-
WebImageViewer.ImageBorderSize	getImageBorderSize():int setImageBorderSize(value:Int)	Gets or sets the number of pixels to leave as buffer between the control and the image.	Int represents the number of pixels to leave as buffer between the control and the image.
WebImageViewer.ImageFrameColor	getImageFrameColor():string setImageFrameColor(value:String)	Gets or sets the color of the image frame.	String representing the CSS color of the image frame.
WebImageViewer.ImageFrameSize	getImageFrameSize():int setImageFrameSize(value:Int)	Gets or sets the size of the frame to be added to the image.	Int representing the size of the frame.
WebImageViewer.ImageInfo	getImageInfo():ltwfImageInfo	Gets information about the image currently loaded in the control.	-
WebImageViewer.ImageUrl	getImageUrl():string	Gets the URL of the image currently loaded.	-
WebImageViewer.InteractiveZoomPercent	getInteractiveZoomPercent():int setInteractiveZoomPercent(value:Int)	Gets or sets the percentage that the Leadtools.Web.Controls.WebImageViewer.ScaleFactor property will change when one of the Leadtools.Web.Controls.ImageViewerMouseInteractiveMode zoom interactive modes used.	Int representing the percentage that the Leadtools.Web.Controls.WebImageViewer.ScaleFactor property will change when one of the Leadtools.Web.Controls.ImageViewerMouseInteractiveMode zoom interactive modes used.
WebImageViewer.MaxScrollPosition	getMaxScrollPosition():ltwfPoint	Gets the maximum scroll position the image can scroll to.	-
WebImageViewer.MouseInteractiveMode	getMouseInteractiveMode():ltwfMouseInteractiveMode	Gets the behavior of the left/right mouse button when interacting with the viewer.	-
WebImageViewer.OpenImageUrl	OpenImageUrl(imageUrl: String, pageIndex: Int);	Opens the image from an URL or a virtual path and displays it	imageUrl: The URL or virtual directory of the image to load pageIndex: 0-based index of the page to open
WebImageViewer.ResourcesPath	getResourcesPath():String	Gets the virtual path to where resources(icons, scripts) are located.	-
WebImageViewer.ScaleFactor	getScaleFactor():Double setScaleFactor(value:Double)	Gets or sets the zoom factor used to display the image.	Double representing the zoom factor to be used in displaying the image 1 means displaying the image in original width/height (1:1).
WebImageViewer.ScrollBarVisible	getScrollBarVisible():bool	Gets the visibility of the scrollbars.	-
WebImageViewer.ScrollPosition	getScrollPosition():ltwfPoint setScrollPosition(value:ltwfPoint)	Gets or sets the scroll bar position.	ltwfPoint representing the scroll bar position
WebImageViewer.SizeMode	getSizeMode():ImageViewerSizeMode setSizeMode(value:ImageViewerSizeMode)	Gets or sets how the control displays the image and the automatic adjustments of the display rectangles.	Int (0-4), 0:Normal, 1:Stretch, 2:FitAlways, 3:FitWidth, 4: Fit.
WebImageViewer.TileSize	getTileSize():ltwfSize setTileSize(value:ltwfSize)	Gets or sets the size (width/height) in pixels of the tiles that the image is divided.	ltwfSize representing the size (width/height) in pixels of the tiles that the image is divided.
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.
WebImageViewer.UseDpi	getUseDpi():bool setUseDpi(value:bool)	Gets or sets whether the control uses the image's DPI (Dot Per Inch) to calculate the physical resolution for the image or not.	True to use the image's DPI (Dot Per Inch) to calculate the physical resolution; false to ignore it.
WebImageViewer.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.
WebImageViewer.VerticalRealScaleFactor	getVerticalRealScaleFactor():Double	Gets the real vertical scale factor used to display the image.	-
WebImageViewer.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.
WebImageViewer.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 WebImageViewer.	string the url of the XML file that contains the options to be used as codecs save options for the image displayed by the WebImageViewer.
Visible	getVisible():bool setVisible(value:bool)	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.

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 ImageUrl property is changed on the WebImageViewer client object.

            WebImageViewer1.ScaleFactorChanged = myScaleFactorChanged;
            function myScaleFactorChanged()
            {
              alert("ScaleFactor 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.
WebImageViewer.PropertyChanged	DropShadowColorChanged	DropShadowColor property is changed.
WebImageViewer.PropertyChanged	DropShadowSizeChanged	DropShadowSize property is changed.
WebImageViewer.PropertyChanged	HorizontalAlignModeChanged	HorizontalAlignMode property is changed.
WebImageViewer.ImageChanged	ImageChanged	New image is loaded in the web control.
WebImageViewer.ImageDataChanged	ImageDataChanged	The current image data is changed by applying an image processing command.
WebImageViewer.PropertyChanged	ImageBorderSizeChanged	ImageBorderSize property is changed.
WebImageViewer.PropertyChanged	ImageFrameColorChanged	ImageFrameColor property is changed.
WebImageViewer.PropertyChanged	ImageFrameSizeChanged	ImageFrameSize property is changed.
WebImageViewer.PropertyChanged	InteractiveZoomPercentChanged	InteractiveZoomPercent property is changed.
WebImageViewer.PropertyChanged	MouseInteractiveModeChanged	MouseInteractiveMode property is changed.
WebImageViewer.PropertyChanged	ScaleFactorChanged	ScaleFactor property is changed.
WebImageViewer.PropertyChanged	ScrollPositionChanged	ScrollPosition property is changed.
WebImageViewer.PropertyChanged	SizeModeChanged	SizeMode property is changed.
WebImageViewer.PropertyChanged	TileSizeChanged	TileSize property is changed.
WebImageViewer.PropertyChanged	UseDpiChanged	UseDpi property is changed.
WebImageViewer.PropertyChanged	VerticalAlignModeChanged	VerticalAlignMode property is changed.
N/A	VisibleChanged	Visible property is changed.