SUI .dialog.OKCancelDialog

SUI.dialog.OKCancelDialog is an empty dialog box with an OK and cancel button. It can serve as a base for most of your standard dialogs. There is an optional third button that can be activated.

Extends SUI.Window
Defined in: dialog/OKCancelDialog.js

Constructor summary
Attr.	Name / Description
public	SUI.dialog.OKCancelDialog(see, arg) Create an OK/Cancel dialog.

Events
Name	Description
onClose	onClose event handler. This event handler is called when the user clicks on the 'close' button on the window's caption.

Member summary
Attr.	Type	Name	Description
private	SUI.Border	_border	The box's border.
private	int	_bottom	The bottom position of the box.
private	HTMLElementNode	_el	The box's element node.
private	int	_height	The height of the box.
private	int	_left	The left position of the box.
private	int	_listeners	The listeners array.
private	int	_maxHeight	The maximum height of the box.
private	int	_maxWidth	The maximum width of the box.
private	int	_minHeight	The minimum height of the box.
private	int	_minWidth	The minimum width of the box.
private		_okClicked	Flag to prevent double actions on double clicking of the ok button
private	SUI.Padding	_padding	The box's padding.
private	SUI.Box	_parent	The box's parent element.
private	int	_right	The right position of the box.
private	int	_top	The top position of the box.
private	int	_width	The width of the box.
public		BORDER_WIDTH	The inner border width.
public		BUTTON_BAR_HEIGHT	The height of the button bar
public		CAPTION_HEIGHT	Height of the caption bar (excluding borders).
public		CAPTION_PADDING_LEFT	Padding left of the caption text in the caption bar.
public		CAPTION_PADDING_TOP	Padding top of the caption text in the caption bar.
public	SUI.Box[]	children	The list of children of this container.
public		CLOSE_RIGHT	Right offset of the close icon.
public		CLOSE_SIZE	Close icons size (width and height).
public		CLOSE_TOP	Top offset of the close icon.
public		CORNER_SIZE	Size of the corner draggers.
public		EXTRA_WINDOW_BORDER	Add some extra space to the border
public		HEIGHT	Default dialog height
public		INNER_BORDER_OUTLINE	Border width of border around the the inner window (without the caption bar).
public		OUTER_BORDER_OUTLINE	Border width of border around the whole window.
public		PANEL_BORDER	Thin line of the panel border
public		WIDTH	Default dialog width

Method summary
Attr.	Type	Name / Description
private		_layoutChildren() Layout the children of the Container. Use the anchors of the children to place them on the client area of the Container.
public		absPos() Get the absolute position (top/left) of this box on the page. Note: You can only use this function if the HTML content of the page is fully rendered.
public		add(child) Add a box component to the window.
public		addClass(cls) Add a CSS class name to the class list of the HTML element associated with the box.
public		addExtraButton(title, handler) Show an extra button on the button bar.
public		addListener(type, listener) Add/register a listener function. This way it is possible to register more than one listener function on one target.
public	SUI.Border	border(b) Get or set the border definition of the box.
public	int	bottom(b) Get or set the bottom of the box.
public		callListener(type) Call a listener function. Execute the default and additional listener functions. Note: the framework should not execute the default listeners directly but always through this method to ensure the execution of additional listener functions.
public	String	caption(text) Set or get the caption text.
public		center() Set the top and left so that the window will be centered when it will be drawn.
public		clientAreaPosition() Get the top, left, right and bottom offset of the client area relative to the outer dimensions of the window.
public	int	clientHeight() Get the client height of the box. The client height is the height of the box minus the top and bottom border and padding width.
public	int	clientWidth() Get the client width of the box. The client width is the width of the box minus the left and right border and padding width.
public		close() Close a modal window that was created buy calling 'show'
public		dataSaved() Close the dialog and notfiy the interface that data was saved.
public		display() Display the window control. Set the CSS size and position of the window's boxes.
public		draw() Draw the box on the screen. It executes a two phase process: a layout phase in which the size and positions of the box (and of it's contents, for more complex derivatives) is calculated and a display phase in which the CSS size and position of the box's (and possible it's child elements) is set.
public	HTMLElementNode	el() Get the HTML element node of the box.
public	Object	formToData() Function that is called by the dialog when the data needs to be harvested. Override this function with your own and the object that will be return is the argument for the onOK event listener.
public	int	height(h) Get or set the height of the box.
public		layOut() Lay out the the window. Calculate the sizes and positions of all the window's elements.
public	int	left(l) Get or set the left of the box.
public	int	maxHeight(mh) Get or set the maximum height of the box.
public	int	maxWidth(mw) Get or set the maximum width of the box.
public	int	minHeight(mh) Get or set the minimum height of the box.
public	int	minWidth(mw) Get or set the minimum width of the box.
public		onCancel() onCancel event handler: is executed when the user clicks on the Cancel button
public		onOK(data) onOK event handler: is executed when the user clicks on the OK button
public	SUI.Padding	padding(p) Get or set the padding definition of the box.
public	SUI.Box	parent(p) Get or set the parent box of the box. When setting the parent the box's element node will be appended to the parent box's HTML element node.
public		remove(child, parent) Remove a child box.
public		removeBox() Remove a box from the DOM tree.
public		removeClass(cls) Remove a CSS class name from the class list of the HTML element associated with the box.
public	int	right(r) Get or set the right of the box.
public		setClientHeight(h) Set the client area height of the dialog window to the specified height. Normally you're not really interested in the outer size if the dialog window, but in the space where your are adding your boxes. This way you can conveniently size the dialog window to fit your contents.
public		setClientWidth(w) Set the client area width of the dialog window to the specified width. Normally you're not really interested in the outer size if the dialog window, but in the space where your are adding your boxes. This way you can conveniently size the dialog window to fit your contents.
public		setDim() Set the CSS dimensions of this box and it's borders and padding. This is typically used in display functions to display boxes at the size and position that was calculated during layout.
public		setPos() Set the CSS postion of this box. This is typically used in display functions to display boxes at position that was calculated during layout. Note: use setDim if you want to set the position and size of the box.
public		setRect(t, l, w, h) Set the top, left, width and height of a box in one go.
public		show() Show a modal window. Before creating the window an overlay will be placed over the current window to disallow access to the other elements of the interface.
public	int	top(t) Get or set the top of the box.
public	int	width(w) Get or set the width of the box.

Constructor

public SUI.dialog.OKCancelDialog(see, object arg)

Create an OK/Cancel dialog.

Parameters:
Name	Type	Description
	see	base class
int	arg.clientWidth	Client width of the dialog window
int	arg.clientHeight	Client height of the dialog window
Function	arg.onOK	Event handler for the ok button
Function	arg.onCancel	Event handler for the cancel button

View source: dialog/OKCancelDialog.js, line 56

Members

private SUI.Border _border

The box's border.

Inherited From: SUI.Window#_border

View source: Box.js, line 672

private int _bottom

The bottom position of the box.

Inherited From: SUI.Window#_bottom

View source: Box.js, line 679

private HTMLElementNode _el

The box's element node.

Inherited From: SUI.Window#_el

View source: Box.js, line 686

private int _height

The height of the box.

Inherited From: SUI.Window#_height

View source: Box.js, line 693

private int _left

The left position of the box.

Inherited From: SUI.Window#_left

View source: Box.js, line 700

private int _listeners

The listeners array.

Inherited From: SUI.Window#_listeners

View source: Box.js, line 707

private int _maxHeight

The maximum height of the box.

Inherited From: SUI.Window#_maxHeight

View source: Box.js, line 714

private int _maxWidth

The maximum width of the box.

Inherited From: SUI.Window#_maxWidth

View source: Box.js, line 721

private int _minHeight

The minimum height of the box.

Inherited From: SUI.Window#_minHeight

View source: Box.js, line 728

private int _minWidth

The minimum width of the box.

Inherited From: SUI.Window#_minWidth

View source: Box.js, line 735

private _okClicked

Flag to prevent double actions on double clicking of the ok button

View source: dialog/OKCancelDialog.js, line 307

private SUI.Padding _padding

The box's padding.

Inherited From: SUI.Window#_padding

View source: Box.js, line 742

private SUI.Box _parent

The box's parent element.

Inherited From: SUI.Window#_parent

View source: Box.js, line 749

private int _right

The right position of the box.

Inherited From: SUI.Window#_right

View source: Box.js, line 756

private int _top

The top position of the box.

Inherited From: SUI.Window#_top

View source: Box.js, line 763

private int _width

The width of the box.

Inherited From: SUI.Window#_width

View source: Box.js, line 770

public BORDER_WIDTH

The inner border width.

Inherited From: SUI.Window#BORDER_WIDTH

View source: Window.js, line 89

public BUTTON_BAR_HEIGHT

The height of the button bar

View source: dialog/OKCancelDialog.js, line 201

public CAPTION_HEIGHT

Height of the caption bar (excluding borders).

Inherited From: SUI.Window#CAPTION_HEIGHT

View source: Window.js, line 125

public CAPTION_PADDING_LEFT

Padding left of the caption text in the caption bar.

Inherited From: SUI.Window#CAPTION_PADDING_LEFT

View source: Window.js, line 135

public CAPTION_PADDING_TOP

Padding top of the caption text in the caption bar.

Inherited From: SUI.Window#CAPTION_PADDING_TOP

View source: Window.js, line 130

public SUI.Box[] children

The list of children of this container.

Inherited From: SUI.Window#children

View source: AnchorLayout.js, line 93

public CLOSE_RIGHT

Right offset of the close icon.

Inherited From: SUI.Window#CLOSE_RIGHT

View source: Window.js, line 94

public CLOSE_SIZE

Close icons size (width and height).

Inherited From: SUI.Window#CLOSE_SIZE

View source: Window.js, line 99

public CLOSE_TOP

Top offset of the close icon.

Inherited From: SUI.Window#CLOSE_TOP

View source: Window.js, line 104

public CORNER_SIZE

Size of the corner draggers.

Inherited From: SUI.Window#CORNER_SIZE

View source: Window.js, line 109

public EXTRA_WINDOW_BORDER

Add some extra space to the border

View source: dialog/OKCancelDialog.js, line 191

public HEIGHT

Default dialog height

View source: dialog/OKCancelDialog.js, line 206

public INNER_BORDER_OUTLINE

Border width of border around the the inner window (without the caption bar).

Inherited From: SUI.Window#INNER_BORDER_OUTLINE

View source: Window.js, line 115

public OUTER_BORDER_OUTLINE

Border width of border around the whole window.

Inherited From: SUI.Window#OUTER_BORDER_OUTLINE

View source: Window.js, line 120

public PANEL_BORDER

Thin line of the panel border

View source: dialog/OKCancelDialog.js, line 196

public WIDTH

Default dialog width

View source: dialog/OKCancelDialog.js, line 211

Methods

private _layoutChildren()

Layout the children of the Container. Use the anchors of the children to place them on the client area of the Container.

Inherited From: SUI.Window#_layoutChildren

View source: AnchorLayout.js, line 153

public absPos()

Get the absolute position (top/left) of this box on the page. Note: You can only use this function if the HTML content of the page is fully rendered.

Inherited From: SUI.Window#absPos

View source: Box.js, line 202

public add( SUI.Box child)

Add a box component to the window.

Parameters:
Name	Type	Description
SUI.Box	child	Child box to add

Inherited From: SUI.Window#add

View source: Window.js, line 141

public addClass( String cls)

Add a CSS class name to the class list of the HTML element associated with the box.

Parameters:
Name	Type	Description
String	cls	the CSS class name to add

Inherited From: SUI.Window#addClass

View source: Box.js, line 229

public addExtraButton( String title, Function handler)

Show an extra button on the button bar.

Parameters:
Name	Type	Description
String	title	The text on the button
Function	handler	The function to execute on the onclick event of the button

View source: dialog/OKCancelDialog.js, line 219

public addListener( String type, Function listener)

Add/register a listener function. This way it is possible to register more than one listener function on one target.

Parameters:
Name	Type	Description
String	type	The listener type (i.e. "onClick", "onOK", etc).
Function	listener	The listener function.

Inherited From: SUI.Window#addListener

View source: Box.js, line 239

public SUI.Border border( SUI.Border b)

Get or set the border definition of the box.

Parameters:
Name	Type	Argument	Description
SUI.Border	b	<optional>	The new border definition (or none to use this method as a getter).

Returns:

SUI.Border the border definition of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#border

View source: Box.js, line 259

public int bottom( int b)

Get or set the bottom of the box.

Parameters:
Name	Type	Argument	Description
int	b	<optional>	The new bottom of the box (or none to use this method as a getter).

Returns:

int The bottom of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#bottom

View source: Box.js, line 302

public callListener( String type)

Call a listener function. Execute the default and additional listener functions. Note: the framework should not execute the default listeners directly but always through this method to ensure the execution of additional listener functions.

Parameters:
Name	Type	Description
String	type	The listener type (i.e. "onClick", "onOK", etc).

Inherited From: SUI.Window#callListener

View source: Box.js, line 275

public String caption( String text)

Set or get the caption text.

Parameters:
Name	Type	Description
String	text	The new caption text (null to use the method as getter)

Returns:

String The caption text (null if the method was used as setter)

Inherited From: SUI.Window#caption

View source: Window.js, line 152

public center()

Set the top and left so that the window will be centered when it will be drawn.

Inherited From: SUI.Window#center

View source: Window.js, line 164

public clientAreaPosition()

Get the top, left, right and bottom offset of the client area relative to the outer dimensions of the window.

Inherited From: SUI.Window#clientAreaPosition

View source: Window.js, line 227

public int clientHeight()

Get the client height of the box. The client height is the height of the box minus the top and bottom border and padding width.

Returns:

int The client height of the box.

Inherited From: SUI.Window#clientHeight

View source: Box.js, line 312

public int clientWidth()

Get the client width of the box. The client width is the width of the box minus the left and right border and padding width.

Returns:

int The client width of the box.

Inherited From: SUI.Window#clientWidth

View source: Box.js, line 322

public close()

Close a modal window that was created buy calling 'show'

Inherited From: SUI.Window#close

View source: Window.js, line 186

public dataSaved()

Close the dialog and notfiy the interface that data was saved.

View source: dialog/OKCancelDialog.js, line 298

public display()

Display the window control. Set the CSS size and position of the window's boxes.

Inherited From: SUI.Window#display

View source: Window.js, line 236

public draw()

Draw the box on the screen. It executes a two phase process: a layout phase in which the size and positions of the box (and of it's contents, for more complex derivatives) is calculated and a display phase in which the CSS size and position of the box's (and possible it's child elements) is set.

Inherited From: SUI.Window#draw

View source: Box.js, line 344

public HTMLElementNode el()

Get the HTML element node of the box.

Returns:

HTMLElementNode the HTML element node of the box.

Inherited From: SUI.Window#el

View source: Box.js, line 353

public Object formToData()

Function that is called by the dialog when the data needs to be harvested. Override this function with your own and the object that will be return is the argument for the onOK event listener.

Returns:

Object An object with form data.

View source: dialog/OKCancelDialog.js, line 241

public int height( int h)

Get or set the height of the box.

Parameters:
Name	Type	Argument	Description
int	h	<optional>	The new height of the box (or none to use this method as a getter).

Returns:

int The height of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#height

View source: Box.js, line 364

public layOut()

Lay out the the window. Calculate the sizes and positions of all the window's elements.

Inherited From: SUI.Window#layOut

View source: Window.js, line 268

public int left( int l)

Get or set the left of the box.

Parameters:
Name	Type	Argument	Description
int	l	<optional>	The new left of the box (or none to use this method as a getter).

Returns:

int The left of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#left

View source: Box.js, line 403

public int maxHeight( int mh)

Get or set the maximum height of the box.

Parameters:
Name	Type	Argument	Description
int	mh	<optional>	The new maximum height of the box (or none to use this method as a getter).

Returns:

int The maximum height of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#maxHeight

View source: Box.js, line 414

public int maxWidth( int mw)

Get or set the maximum width of the box.

Parameters:
Name	Type	Argument	Description
int	mw	<optional>	The new maximum width of the box (or none to use this method as a getter).

Returns:

int The maximum width of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#maxWidth

View source: Box.js, line 433

public int minHeight( int mh)

Get or set the minimum height of the box.

Parameters:
Name	Type	Argument	Description
int	mh	<optional>	The new minimum height of the box (or none to use this method as a getter).

Returns:

int The minimum height of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#minHeight

View source: Box.js, line 452

public int minWidth( int mw)

Get or set the minimum width of the box.

Parameters:
Name	Type	Argument	Description
int	mw	<optional>	The new minimum width of the box (or none to use this method as a getter).

Returns:

int The minimum width of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#minWidth

View source: Box.js, line 471

public onCancel()

onCancel event handler: is executed when the user clicks on the Cancel button

View source: dialog/OKCancelDialog.js, line 257

public onOK( Object data)

onOK event handler: is executed when the user clicks on the OK button

Parameters:
Name	Type	Description
Object	data	The from data represented as an object

View source: dialog/OKCancelDialog.js, line 250

public SUI.Padding padding( SUI.Padding p)

Get or set the padding definition of the box.

Parameters:
Name	Type	Argument	Description
SUI.Padding	p	<optional>	The new padding definition (or none to use this method as a getter).

Returns:

SUI.Padding The padding definition of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#padding

View source: Box.js, line 490

public SUI.Box parent( SUI.Box p)

Get or set the parent box of the box. When setting the parent the box's element node will be appended to the parent box's HTML element node.

Parameters:
Name	Type	Description
SUI.Box	p	The parent box for this box (or none to use this method as a getter).

Returns:

SUI.Box The parent box of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#parent

View source: Box.js, line 510

public remove( SUI.Box child, SUI.AnchorLayout parent)

Remove a child box.

Parameters:
Name	Type	Description
SUI.Box	child	a reference to the box to remove
SUI.AnchorLayout	parent	Container to remove box from (none for this)

Inherited From: SUI.Window#remove

View source: AnchorLayout.js, line 134

public removeBox()

Remove a box from the DOM tree.

Inherited From: SUI.Window#removeBox

View source: Box.js, line 523

public removeClass( String cls)

Remove a CSS class name from the class list of the HTML element associated with the box.

Parameters:
Name	Type	Description
String	cls	The CSS class name to remove.

Inherited From: SUI.Window#removeClass

View source: Box.js, line 532

public int right( int r)

Get or set the right of the box.

Parameters:
Name	Type	Description
int	r	The new right of the box (or none to use this method as a getter).

Returns:

int The right of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#right

View source: Box.js, line 543

public setClientHeight( int h)

Set the client area height of the dialog window to the specified height. Normally you're not really interested in the outer size if the dialog window, but in the space where your are adding your boxes. This way you can conveniently size the dialog window to fit your contents.

Parameters:
Name	Type	Description
int	h	New client height of the dialog

View source: dialog/OKCancelDialog.js, line 285

public setClientWidth( int w)

Set the client area width of the dialog window to the specified width. Normally you're not really interested in the outer size if the dialog window, but in the space where your are adding your boxes. This way you can conveniently size the dialog window to fit your contents.

Parameters:
Name	Type	Description
int	w	New client width of the dialog

View source: dialog/OKCancelDialog.js, line 268

public setDim()

Set the CSS dimensions of this box and it's borders and padding. This is typically used in display functions to display boxes at the size and position that was calculated during layout.

Inherited From: SUI.Window#setDim

View source: Box.js, line 552

public setPos()

Set the CSS postion of this box. This is typically used in display functions to display boxes at position that was calculated during layout. Note: use setDim if you want to set the position and size of the box.

Inherited From: SUI.Window#setPos

View source: Box.js, line 600

public setRect( int | SUI.Box t, int l, int w, int h)

Set the top, left, width and height of a box in one go.

Parameters:
Name	Type	Argument	Description
int \| SUI.Box	t		The new top of the box or another reference box to copy the values from.
int	l	<optional>	The new left of the box (if the t parameter wasn't a reference Box).
int	w	<optional>	The new width of the box (if the t parameter wasn't a reference Box).
int	h	<optional>	The new length of the box (if the t parameter wasn't a reference Box).

Inherited From: SUI.Window#setRect

View source: Box.js, line 620

public show()

Show a modal window. Before creating the window an overlay will be placed over the current window to disallow access to the other elements of the interface.

Inherited From: SUI.Window#show

View source: Window.js, line 327

public int top( int t)

Get or set the top of the box.

Parameters:
Name	Type	Argument	Description
int	t	<optional>	The new top of the box (or none to use this method as a getter).

Returns:

int The top of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#top

View source: Box.js, line 641

public int width( int w)

Get or set the width of the box.

Parameters:
Name	Type	Argument	Description
int	w	<optional>	The new width of the box (or none to use this method as a getter).

Returns:

int The width of the box (or null if this method was used as a setter).

Inherited From: SUI.Window#width

View source: Box.js, line 652

Namespaces

Classes

SUI.dialog.OKCancelDialog

Constructor summary

Events

Member summary

Method summary

Constructor

Parameters:

Members

Methods

Parameters:

Parameters:

Parameters:

Parameters:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Parameters:

Returns:

Returns:

Returns:

Returns:

Returns:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Parameters:

Returns:

Parameters:

Returns:

Parameters:

Parameters:

Parameters:

Returns:

Parameters:

Parameters:

Parameters:

Parameters:

Returns:

Parameters:

Returns:

SUI .dialog.OKCancelDialog