New to Telerik UI for ASP.NET AJAX? Start a free 30-day trial

Telerik.Web.UI.RadImageEditor

Class

Definition

Namespace:Telerik.Web.UI

Inheritance: Telerik.Web.UI.RadWebControlTelerik.Web.UI.RadImageEditor

Events

add_commandExecuted

Adds a commandExecuted event handler for the radimageeditor

JS

add_commandExecuted

Parameters:handlerFunction

The event handler function to attach

add_commandExecuting

Adds a commandExecuting event handler for the radimageeditor

JS

add_commandExecuting

Parameters:handlerFunction

The event handler function to attach

add_imageChanged

Adds a imageChanged event handler for the radimageeditor

JS

add_imageChanged

Parameters:handlerFunction

The event handler function to attach

add_imageChanging

Adds a imageChanging event handler for the radimageeditor

JS

add_imageChanging

Parameters:handlerFunction

The event handler function to attach

add_load

Adds a load event handler for the radimageeditor

JS

add_load

Parameters:handlerFunction

The event handler function to attach

add_resizeEnd

Adds a resizeEnd event handler for the radimageeditor

JS

add_resizeEnd

Parameters:handlerFunction

The event handler function to attach

add_resizeStart

Adds a resizeStart event handler for the radimageeditor

JS

add_resizeStart

Parameters:handlerFunction

The event handler function to attach

add_saved

Adds a saved event handler for the radimageeditor

JS

add_saved

Parameters:handlerFunction

The event handler function to attach

add_saving

Adds a saving event handler for the radimageeditor

JS

add_saving

Parameters:handlerFunction

The event handler function to attach

add_shortCutHit

Adds a shortCutHit event handler for the radimageeditor

JS

add_shortCutHit

Parameters:handlerFunction

The event handler function to attach

add_toolsDialogClosed

Adds a toolsDialogClosed event handler for the radimageeditor

JS

add_toolsDialogClosed

Parameters:handlerFunction

The event handler function to attach

remove_commandExecuted

Removes a commandExecuted event handler from the radimageeditor

JS

remove_commandExecuted

Parameters:handlerFunction

The event handler function to remove

remove_commandExecuting

Removes a commandExecuting event handler from the radimageeditor

JS

remove_commandExecuting

Parameters:handlerFunction

The event handler function to remove

remove_imageChanged

Removes a imageChanged event handler from the radimageeditor

JS

remove_imageChanged

Parameters:handlerFunction

The event handler function to remove

remove_imageChanging

Removes a imageChanging event handler from the radimageeditor

JS

remove_imageChanging

Parameters:handlerFunction

The event handler function to remove

remove_load

Removes a load event handler from the radimageeditor

JS

remove_load

Parameters:handlerFunction

The event handler function to remove

remove_resizeEnd

Removes a resizeEnd event handler from the radimageeditor

JS

remove_resizeEnd

Parameters:handlerFunction

The event handler function to remove

remove_resizeStart

Removes a resizeStart event handler from the radimageeditor

JS

remove_resizeStart

Parameters:handlerFunction

The event handler function to remove

remove_saved

Removes a saved event handler from the radimageeditor

JS

remove_saved

Parameters:handlerFunction

The event handler function to remove

remove_saving

Removes a saving event handler from the radimageeditor

JS

remove_saving

Parameters:handlerFunction

The event handler function to remove

remove_shortCutHit

Removes a shortCutHit event handler from the radimageeditor

JS

remove_shortCutHit

Parameters:handlerFunction

The event handler function to remove

remove_toolsDialogClosed

Removes a toolsDialogClosed event handler from the radimageeditor

JS

remove_toolsDialogClosed

Parameters:handlerFunction

The event handler function to remove

Methods

addShortCut

Adds a shortcut with the specified name (keyword) and shortcut string (the combination of keys).

JS

addShortCut(String shortcutName, String shortcutString): void

Parameters:shortcutNameString

The shortcut name

shortcutStringString

The Keyboard combination for the shortcut. Letter case is ignored.

addTextToImage

Adds text to the image in the specified position

JS

addTextToImage(Number x, Number y, Telerik.Web.UI.ImageEditor.ImageText text): void

Parameters:xNumber

The X coordinate of the text

yNumber

The Y coordinate of the text

textTelerik.Web.UI.ImageEditor.ImageText

The text to add to the image

applyChangesOnServer

Forces the changes made to the image to be applied on the server

JS

applyChangesOnServer(): void

applyFilter

Executes the provided filter against the current editable image and adds the operation to the undo stack

JS

applyFilter(Telerik.Web.UI.ImageEditor.Filters.IPixelFilter filter): void

Parameters:filterTelerik.Web.UI.ImageEditor.Filters.IPixelFilter

The filter to be applied

changeImageOpacity

Changes the opacity of the image

JS

changeImageOpacity(Number opacity, Boolean shouldUpdateUI): void

Parameters:opacityNumber

The opacity that is applied to the image

shouldUpdateUIBoolean

Flag whether the UI

closeToolsPanel

Closes the tools panel

JS

closeToolsPanel(): void

editImageOnServer

Initiates an ASP.NET client callback to the server and raises the ImageEditing server side event. The EditableImage can be retrieved from the event arguments, and edited accordingly.

JS

editImageOnServer(String commandName, String commandText, String commandArgument, Function callbackFunction): void

Parameters:commandNameString

The command name that will be passed to the server and respective client events. It should be unique.

commandTextString

The command text that will be used to record the operation in the Undo

commandArgumentString

The additional command argument that will be passed to the server. By default empty string is passed.

callbackFunctionFunction

The function that will be called after response is received from the server. Two parameters are sent to this function

executeCommand

Executes an ImageEditor's command and opens the corresponding dialog. Does not fire the client-side events.

JS

executeCommand(String commandName): void

Parameters:commandNameString

The name of the command to execute

fire

Fires an ImageEditor's command with the full set of client-side events

JS

fire(String commandName, Object args): void

Parameters:commandNameString

The name of the command to fire

argsObject

Event arguments accompanying the firing of the command

flipHorizontal

Flips the image in the Horizontal direction

JS

flipHorizontal(): void

flipImage

Flips the image in a horizontal or vertical direction

JS

flipImage(Telerik.Web.UI.ImageEditor.FlipDirection flipDirection, Boolean shouldUpdateUI, Boolean forceChanges): void

Parameters:flipDirectionTelerik.Web.UI.ImageEditor.FlipDirection

The direction of flipping

shouldUpdateUIBoolean

Flag whether the UI

forceChangesBoolean

Flag whether the previously set flip direction should be taken under consideration

flipVertical

Flips the image in the Vertical direction

JS

flipVertical(): void

get_bottomZone

Gets a reference to the bottom docking zone of the ToolBar panel.

JS

get_bottomZone(): Object

Returns:

Object

The reference to the bottom docking zone of the ToolBar panel

get_currentCommand

Gets the currently executing command

JS

get_currentCommand(): String

Returns:

String

The name of the command

get_currentToolWidget

Gets the current tool widget, i.e. the object holding the dialog's functionality

JS

get_currentToolWidget(): Telerik.Web.UI.ImageEditor.ToolWidget

Returns:

Telerik.Web.UI.ImageEditor.ToolWidget

A reference to the widget

get_enableResize

Gets the flag to indicate whether the resizing of the ImageEditor control is enabled

JS

get_enableResize(): Boolean

Returns:

Boolean

Is resize enabled flag

get_formDecorator

Gets the FormDecorator, used in decorating the dialog's UI

JS

get_formDecorator(): Telerik.Web.UI.RadFormDecorator

Returns:

Telerik.Web.UI.RadFormDecorator

A reference to the RadFormDecorator

get_height

Gets the height of the ImageEditor control's element

JS

get_height(): Number

Returns:

Number

The height of the control

get_isRedoAvailable

Gets a flag whether the a redo command is available in the redo stack

JS

get_isRedoAvailable(): Boolean

Returns:

Boolean

Is redo available flag

get_isUndoAvailable

Gets a flag whether the a undo command is available in the undo stack

JS

get_isUndoAvailable(): Boolean

Returns:

Boolean

Is undo available flag

get_left

Gets the left/x coordinate of the element's location

JS

get_left(): Number

Returns:

Number

The value of the left

get_leftZone

Gets a reference to the left docking zone of the ToolBar panel.

JS

get_leftZone(): Object

Returns:

Object

The reference to the left docking zone of the ToolBar panel

get_location

Gets the location of the ImageEditor control's element

JS

get_location(Boolean forceCalculation): Sys.UI.Point

Parameters:forceCalculationBoolean

Flag to force recalculation of the element

Returns:

Sys.UI.Point

The position of the control

get_lowerZoomBound

Gets the lower limit of the zoom level. This is the lowest percentage value up to which the user can zoom out the image in the RadImageEditor.

JS

get_lowerZoomBound(): Number

Returns:

Number

The lower zoom limit. The default is 25.

get_operationsToRedo

Gets the redo stack of operations

JS

get_operationsToRedo(): Array

Returns:

Array

The redo stack

get_operationsToUndo

Gets the undo stack of operations

JS

get_operationsToUndo(): Array

Returns:

Array

The undo stack

get_resizeHandle

Gets a reference to the resizing handle element, i.e. the element, by which the user resizes the ImageEditor's element

JS

get_resizeHandle(): Object

Returns:

Object

A reference ot the resize handle

get_rightZone

Gets a reference to the right docking zone of the ToolBar panel.

JS

get_rightZone(): Object

Returns:

Object

The reference to the right docking zone of the ToolBar panel

get_shortcuts

Gets shortcuts set to the ImageEditor control on the server.

JS

get_shortcuts(): Array

Returns:

Array

Two dimensional array containing the shortcuts of the ImageEditor set on the server.

get_toolBarContainer

Gets a reference to the Toolbar's container DOM element

JS

get_toolBarContainer(): Object

Returns:

Object

The Toolbar

get_toolBarMode

Gets the ToolBar Mode of the ImageEditor control.

JS

get_toolBarMode(): Telerik.Web.UI.ImageEditor.ToolBarMode

Returns:

Telerik.Web.UI.ImageEditor.ToolBarMode

The ToolBar Mode of the ImageEditor control.

get_toolBarPanel

Gets a reference to the ToolBar panel(the movable dock container).

JS

get_toolBarPanel(): Object

Returns:

Object

The reference to the ToolBar panel

get_toolBarPosition

Gets the position of the RadImageEditor ToolBar.

JS

get_toolBarPosition(): Telerik.Web.UI.ImageEditor.ToolBarPosition

Returns:

Telerik.Web.UI.ImageEditor.ToolBarPosition

The position of the RadImageEditor ToolBar.

get_toolGroups

Gets a collection of the different tool groups in the Tools" panel

JS

get_toolGroups(): Array

Returns:

Array

The collection of the different tool groups in the Tools

get_tools

Gets a dictionary of the present tools in the Tools" panel

JS

get_tools(): Array

Returns:

Array

The dictionary of the present tools in the Tools

get_toolsPanel

Gets a reference to the Tools" panel

JS

get_toolsPanel(): Object

Returns:

Object

The reference to the Tools

get_top

Gets the top/y coordinate of the element's location

JS

get_top(): Number

Returns:

Number

The value of the top

get_topZone

Gets a reference to the top docking zone of the ToolBar panel.

JS

get_topZone(): Object

Returns:

Object

The reference to the top docking zone of the ToolBar panel

get_upperZoomBound

Gets the upper limit of the zoom level. This is the highest percentage value up to which the user can zoom in the image in the RadImageEditor.

JS

get_upperZoomBound(): Number

Returns:

Number

The upper zoom limit. The default is 400.

get_viewport

Gets a reference to the DOM element holding the edited image

JS

get_viewport(): Object

Returns:

Object

The reference to the viewport

get_width

Gets the width of the ImageEditor control's element

JS

get_width(): Number

Returns:

Number

The width of the control

get_xmlHttpPanel

Gets a reference to the XmlHttpPanel that manages the loading of the dialogs

JS

get_xmlHttpPanel(): Telerik.Web.UI.RadXmlHttpPanel

Returns:

Telerik.Web.UI.RadXmlHttpPanel

A reference to the XmlHttpPanel

getEditableImage

Gets a reference to the current EditableImage

JS

getEditableImage(): Telerik.Web.UI.ImageEditor.EditableImage

Returns:

Telerik.Web.UI.ImageEditor.EditableImage

The current EditableImage

getImage

Gets a reference to the image element being edited

JS

getImage(): Object

Returns:

Object

The reference to the DOM image element

initCallback

Initializes an internal callback using a XmlHttpPanel

JS

initCallback(String target): void

Parameters:targetString

Data to send to the server

insertImage

Inserts image (clip art) into the editable image at the specified position

JS

insertImage(Number x, Number y, String imgSrc, Array operations): void

Parameters:xNumber

The X coordinate of the image

yNumber

The Y coordinate of the image

imgSrcString

The client URL of the image to insert.

operationsArray

Array of operations to apply to the clip art image

openToolsPanel

Opens the tools panel with the current tool widget

JS

openToolsPanel(): void

redo

Redoes the previously undone editing steps of the image

JS

redo(Number depth): void

Parameters:depthNumber

The depth

removeShortCut

Removes a shortcut with the specified name (keyword).

JS

removeShortCut(String shortcutName): void

Parameters:shortcutNameString

The shortcut name

repaint

Redraws the ImageEditor

JS

repaint(): void

resetChanges

Resets the changes to the current image and reverts it to the original one

JS

resetChanges(): void

resizeImage

Resizes the current image. This operation changes the image.

JS

resizeImage(Number width, Number height, Boolean shouldUpdateUI): void

Parameters:widthNumber

The width

heightNumber

The height

shouldUpdateUIBoolean

Flag whether the UI

rotateImage

Rotates the current image clockwise with the specified enum angle value

JS

rotateImage(Telerik.Web.UI.ImageEditor.Rotation rotation, Boolean shouldUpdateUI): void

Parameters:rotationTelerik.Web.UI.ImageEditor.Rotation

Enum to determine the angle value. Only orthogonal values

shouldUpdateUIBoolean

Flag whether the UI

rotateLeft90

Rotates the current image 90 degrees counterclockwise, i.e. 270 degrees clockwise

JS

rotateLeft90(): void

rotateRight90

Rotates the current image 90 degrees clockwise

JS

rotateRight90(): void

saveClientState

Stores the client-state changes made during the client-side existence of the control

JS

saveClientState(): void

saveImageOnClient

Downloads the image through the browser's save dialog on the user's PC

JS

saveImageOnClient(Object fileName): void

Parameters:fileNameObject

The name of the file

saveImageOnServer

Saves the image to the server in the same directory as the original image

JS

saveImageOnServer(Object fileName, Boolean overwrite): void

Parameters:fileNameObject

The name of the file

overwriteBoolean

Flag to allow an image with the same name to be overwritten

set_currentCommand

Sets the currently executing command

JS

set_currentCommand(String value): void

Parameters:valueString

The name of the command

set_currentToolWidget

Sets the current tool widget

JS

set_currentToolWidget(Telerik.Web.UI.ImageEditor.ToolWidget value): void

Parameters:valueTelerik.Web.UI.ImageEditor.ToolWidget

The new current widget

set_enableResize

Enables/disables the resizing of the ImageEditor control

JS

set_enableResize(Boolean value): void

Parameters:valueBoolean

Flag to enable

set_height

Sets the height of the ImageEditor control's element

JS

set_height(Number value): void

Parameters:valueNumber

The value in pixels

set_width

Sets the width of the ImageEditor control's element

JS

set_width(Number value): void

Parameters:valueNumber

The value in pixels

setShortCut

Sets a shortcut with the specified name (keyword) and shortcut string (the combination of keys). If the shortcut name exists, the existing shortcut is removed.

JS

setShortCut(String shortcutName, String shortcutString): void

Parameters:shortcutNameString

The shortcut name

shortcutStringString

The Keyboard combination for the shortcut. Letter case is ignored.

setToggleState

(Un)checks a ToolBar button

JS

setToggleState(String toolName, Boolean value): void

Parameters:toolNameString

The name of the button

valueBoolean

The value of the state

undo

Undoes the last editing steps of the image

JS

undo(Number depth): void

Parameters:depthNumber

The depth

zoomBestFit

Zooms the image to best fit in the viewport

JS

zoomBestFit(): void

zoomImage

Zooms(scales) the image by the specified level in percents. This operation does not change the image

JS

zoomImage(Number zoomLevel, Boolean shouldUpdateUI): void

Parameters:zoomLevelNumber

The level

shouldUpdateUIBoolean

Flag whether the UI

zoomIn

Zooms in the current image by 50%, i.e. if the current zoom level is 100, after zoom in the level will be 150

JS

zoomIn(): void

zoomOut

Zooms out the current image by 50%, i.e. if the current zoom level is 100, after zoom in the level will be 50

JS

zoomOut(): void

Not finding the help you need?

Contact Support