SUI.dialog.Calendar is a class to display a date/time dialog. Depending of the given arguments a date, time or datetime selection box is shown.
Extends
SUI.dialog.OKCancelDialog
Defined in:
dialog/Calendar.js
Attr. | Name / Description |
---|---|
public |
SUI.dialog.Calendar(see, arg) Show a modal dialog for date and/or time selection. |
Name | Description |
---|---|
onClose |
onClose event handler. This event handler is called when the user clicks on the 'close' button on the window's caption. |
Attr. | Type | Name | Description |
---|---|---|---|
private | SUI.Border |
The box's border. |
|
private | int |
The bottom position of the box. |
|
private | HTMLElementNode |
The box's element node. |
|
private | int |
The height of the box. |
|
private | int |
The left position of the box. |
|
private | int |
The listeners array. |
|
private | int |
The maximum height of the box. |
|
private | int |
The maximum width of the box. |
|
private | int |
The minimum height of the box. |
|
private | int |
The minimum width of the box. |
|
private |
Flag to prevent double actions on double clicking of the ok button |
||
private | SUI.Padding |
The box's padding. |
|
private | SUI.Box |
The box's parent element. |
|
private | int |
The right position of the box. |
|
private | int |
The top position of the box. |
|
private | int |
The width of the box. |
|
public |
Border width of borders around cells |
||
public |
(Standard) height of the calendar cells (including margin) |
||
public |
Margin between cells |
||
public |
(Standard) width of the calendar cells (including margin) |
||
public |
The height of the button bar |
||
public |
A little extra margin around the month calendar to give more space to the navigation bar |
||
public |
Size of the date navigation buttons |
||
public |
Height of the caption bar (excluding borders). |
||
public |
Padding left of the caption text in the caption bar. |
||
public |
Padding top of the caption text in the caption bar. |
||
public | SUI.Box[] |
The list of children of this container. |
|
public |
Right offset of the close icon. |
||
public |
Close icons size (width and height). |
||
public |
Top offset of the close icon. |
||
public |
Size of the corner draggers. |
||
public |
Margin of the month calendar |
||
public |
Add some extra space to the border |
||
public |
Height of the date navigation bar or the time header |
||
public |
fraction to calculate width for the month and year scrollers |
||
public |
Top of text in the header |
||
public |
Default dialog height |
||
public |
Border width of border around the the inner window (without the caption bar). |
||
public |
Border width of border around the whole window. |
||
public |
Thin line of the panel border |
||
public |
Width of the margin between the date and time box |
||
public |
Bottom margin of the time box |
||
public |
Side margins of the time box (when there is no date box) |
||
public |
Top margin of the date an time boxes |
||
public |
Default dialog width |
Attr. | Type | Name / Description |
---|---|---|
private |
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 |
Get the top, left, right and bottom offset of the client area relative to the outer dimensions of the window. |
|
public | int |
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 |
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 |
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 |
Return the form's selected value |
|
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 |
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 |
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 |
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 the calendar dialog centered on the screen |
|
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.Calendar(see, object arg)
-
Show a modal dialog for date and/or time selection.
Parameters:
Name Type Description see base class boolean arg.iso Use the ISO 8601 week day system (true/default) or or the American (false) style Date arg.date Initial date selection String arg.type Type of the dialog "time", "date" (default) or "datetime" View source: dialog/Calendar.js, line 56
Members
- private SUI.Border _border
-
The box's border.
Inherited From: SUI.dialog.OKCancelDialog#_border
- private int _bottom
-
The bottom position of the box.
Inherited From: SUI.dialog.OKCancelDialog#_bottom
- private HTMLElementNode _el
-
The box's element node.
Inherited From: SUI.dialog.OKCancelDialog#_el
- private int _height
-
The height of the box.
Inherited From: SUI.dialog.OKCancelDialog#_height
- private int _left
-
The left position of the box.
Inherited From: SUI.dialog.OKCancelDialog#_left
- private int _listeners
-
The listeners array.
Inherited From: SUI.dialog.OKCancelDialog#_listeners
- private int _maxHeight
-
The maximum height of the box.
Inherited From: SUI.dialog.OKCancelDialog#_maxHeight
- private int _maxWidth
-
The maximum width of the box.
Inherited From: SUI.dialog.OKCancelDialog#_maxWidth
- private int _minHeight
-
The minimum height of the box.
Inherited From: SUI.dialog.OKCancelDialog#_minHeight
- private int _minWidth
-
The minimum width of the box.
Inherited From: SUI.dialog.OKCancelDialog#_minWidth
- private _okClicked
-
Flag to prevent double actions on double clicking of the ok button
Inherited From: SUI.dialog.OKCancelDialog#_okClicked
View source: dialog/OKCancelDialog.js, line 307
- private SUI.Padding _padding
-
The box's padding.
Inherited From: SUI.dialog.OKCancelDialog#_padding
- private SUI.Box _parent
-
The box's parent element.
Inherited From: SUI.dialog.OKCancelDialog#_parent
- private int _right
-
The right position of the box.
Inherited From: SUI.dialog.OKCancelDialog#_right
- private int _top
-
The top position of the box.
Inherited From: SUI.dialog.OKCancelDialog#_top
- private int _width
-
The width of the box.
Inherited From: SUI.dialog.OKCancelDialog#_width
- public BORDER_WIDTH
-
Border width of borders around cells
View source: dialog/Calendar.js, line 96
- public BOX_HEIGHT
-
(Standard) height of the calendar cells (including margin)
View source: dialog/Calendar.js, line 106
- public BOX_MARGIN
-
Margin between cells
View source: dialog/Calendar.js, line 111
- public BOX_WIDTH
-
(Standard) width of the calendar cells (including margin)
View source: dialog/Calendar.js, line 101
- public BUTTON_BAR_HEIGHT
-
The height of the button bar
Inherited From: SUI.dialog.OKCancelDialog#BUTTON_BAR_HEIGHT
View source: dialog/OKCancelDialog.js, line 201
- public BUTTON_EXTRA_SIDE_MARGIN
-
A little extra margin around the month calendar to give more space to the navigation bar
View source: dialog/Calendar.js, line 122
- public BUTTON_SIZE
-
Size of the date navigation buttons
View source: dialog/Calendar.js, line 116
- public CAPTION_HEIGHT
-
Height of the caption bar (excluding borders).
Inherited From: SUI.dialog.OKCancelDialog#CAPTION_HEIGHT
- public CAPTION_PADDING_LEFT
-
Padding left of the caption text in the caption bar.
Inherited From: SUI.dialog.OKCancelDialog#CAPTION_PADDING_LEFT
- public CAPTION_PADDING_TOP
-
Padding top of the caption text in the caption bar.
Inherited From: SUI.dialog.OKCancelDialog#CAPTION_PADDING_TOP
- public SUI.Box[] children
-
The list of children of this container.
Inherited From: SUI.dialog.OKCancelDialog#children
View source: AnchorLayout.js, line 93
- public CLOSE_RIGHT
-
Right offset of the close icon.
Inherited From: SUI.dialog.OKCancelDialog#CLOSE_RIGHT
- public CLOSE_SIZE
-
Close icons size (width and height).
Inherited From: SUI.dialog.OKCancelDialog#CLOSE_SIZE
- public CLOSE_TOP
-
Top offset of the close icon.
Inherited From: SUI.dialog.OKCancelDialog#CLOSE_TOP
- public CORNER_SIZE
-
Size of the corner draggers.
Inherited From: SUI.dialog.OKCancelDialog#CORNER_SIZE
- public DATE_MARGIN
-
Margin of the month calendar
View source: dialog/Calendar.js, line 127
- public EXTRA_WINDOW_BORDER
-
Add some extra space to the border
Inherited From: SUI.dialog.OKCancelDialog#EXTRA_WINDOW_BORDER
View source: dialog/OKCancelDialog.js, line 191
- public HEADER_HEIGHT
-
Height of the date navigation bar or the time header
View source: dialog/Calendar.js, line 132
- public HEADER_SPLIT_AT
-
fraction to calculate width for the month and year scrollers
View source: dialog/Calendar.js, line 142
- public HEADER_TEXT_TOP
-
Top of text in the header
View source: dialog/Calendar.js, line 137
- public HEIGHT
-
Default dialog height
Inherited From: SUI.dialog.OKCancelDialog#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.dialog.OKCancelDialog#INNER_BORDER_OUTLINE
- public OUTER_BORDER_OUTLINE
-
Border width of border around the whole window.
Inherited From: SUI.dialog.OKCancelDialog#OUTER_BORDER_OUTLINE
- public PANEL_BORDER
-
Thin line of the panel border
Inherited From: SUI.dialog.OKCancelDialog#PANEL_BORDER
View source: dialog/OKCancelDialog.js, line 196
- public SPLIT_MARGIN
-
Width of the margin between the date and time box
View source: dialog/Calendar.js, line 147
- public TIME_BOTTOM_MARGIN
-
Bottom margin of the time box
View source: dialog/Calendar.js, line 157
- public TIME_SIDE_MARGIN
-
Side margins of the time box (when there is no date box)
View source: dialog/Calendar.js, line 152
- public TOP_MARGIN
-
Top margin of the date an time boxes
View source: dialog/Calendar.js, line 162
- public WIDTH
-
Default dialog width
Inherited From: SUI.dialog.OKCancelDialog#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.dialog.OKCancelDialog#_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.dialog.OKCancelDialog#absPos
- 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.dialog.OKCancelDialog#add
- 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.dialog.OKCancelDialog#addClass
- 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 Inherited From: SUI.dialog.OKCancelDialog#addExtraButton
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.dialog.OKCancelDialog#addListener
- 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.dialog.OKCancelDialog#border
- 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.dialog.OKCancelDialog#bottom
- 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.dialog.OKCancelDialog#callListener
- 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.dialog.OKCancelDialog#caption
- public center()
-
Set the top and left so that the window will be centered when it will be drawn.
Inherited From: SUI.dialog.OKCancelDialog#center
- 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.dialog.OKCancelDialog#clientAreaPosition
- 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.dialog.OKCancelDialog#clientHeight
- 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.dialog.OKCancelDialog#clientWidth
- public close()
-
Close a modal window that was created buy calling 'show'
Inherited From: SUI.dialog.OKCancelDialog#close
- public dataSaved()
-
Close the dialog and notfiy the interface that data was saved.
Inherited From: SUI.dialog.OKCancelDialog#dataSaved
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.dialog.OKCancelDialog#display
- 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.dialog.OKCancelDialog#draw
- public HTMLElementNode el()
-
Get the HTML element node of the box.
Returns:
HTMLElementNode the HTML element node of the box.
Inherited From: SUI.dialog.OKCancelDialog#el
- public formToData()
-
Return the form's selected value
View source: dialog/Calendar.js, line 167
- 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.dialog.OKCancelDialog#height
- public layOut()
-
Lay out the the window. Calculate the sizes and positions of all the window's elements.
Inherited From: SUI.dialog.OKCancelDialog#layOut
- 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.dialog.OKCancelDialog#left
- 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.dialog.OKCancelDialog#maxHeight
- 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.dialog.OKCancelDialog#maxWidth
- 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.dialog.OKCancelDialog#minHeight
- 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.dialog.OKCancelDialog#minWidth
- public onCancel()
-
onCancel event handler: is executed when the user clicks on the Cancel button
Inherited From: SUI.dialog.OKCancelDialog#onCancel
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 Inherited From: SUI.dialog.OKCancelDialog#onOK
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.dialog.OKCancelDialog#padding
- 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.dialog.OKCancelDialog#parent
- 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.dialog.OKCancelDialog#remove
View source: AnchorLayout.js, line 134
- public removeBox()
-
Remove a box from the DOM tree.
Inherited From: SUI.dialog.OKCancelDialog#removeBox
- 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.dialog.OKCancelDialog#removeClass
- 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.dialog.OKCancelDialog#right
- 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 Inherited From: SUI.dialog.OKCancelDialog#setClientHeight
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 Inherited From: SUI.dialog.OKCancelDialog#setClientWidth
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.dialog.OKCancelDialog#setDim
- 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.dialog.OKCancelDialog#setPos
- 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.dialog.OKCancelDialog#setRect
- public show()
-
Show the calendar dialog centered on the screen
View source: dialog/Calendar.js, line 175
- 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.dialog.OKCancelDialog#top
- 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.dialog.OKCancelDialog#width