API/libsapojs/SAPO/Component/Dialog

Version 1 (modified by tiago.c.rodrigues, 3 years ago)

here be robots

[Elements] are optional

Class SAPO.Component.Dialog

class SAPO.Component.Dialog
requires SAPO.Utility.Dimensions
Provides alert, confirm and info dialogs. All three dialogs receive an object with options
Defined in Component/Dialog/0.1/lib.js

Inclusion link: http://js.sapo.pt/SAPO/Component/Dialog/0.1/

Sample: http://js.sapo.pt/SAPO/Component/Dialog/sample/

Variable Summary
private String _currentDialogId
Stores the id of the dialog which is currently being used
Object _dialogs
Hold all created dialogs
Object _elementsToHide
Defines which elements should be hidden when the overlay is active
private Number _intervalHideFlash
Amount of time the flash timer needs
Object _overlayLock
Lock used to prevent two dialogs over the same element
private intervalID _stoHideFlash
Interval timer which hides flash elements

Function Summary
_addComponent()
adds the internal component for a dialog to the DOM
private DOMElement _createOverlay()
creates the overlay DOM element
Number _getLeftPosition (Array pageDims, Array scrollDims, Number width, string id)
Number _getTopPosition (Array pageDims, Array scrollDims, Number height, String id)
_hideAllFlash (string className)
Hides all embed, object, iframe and select tags in a page, except what's inside the element with the given class name
private _makeCancelButton()
Create a cancel button and attach an event to it to execute the appropriate callback
private Object _makeNewDialog()
Creates a new dialog
private _makeOkButton()
Create an ok button and attach an event to it to execute the appropriate callback
private _setOptions (Object options)
Sets the options for this component, either through the object passed on initialization, or through default options.
_setTargetElement (Object options)
Chooses the appropriate target element
_setupComponent (Object dialogInfo)
save initial dimensions, set top position and execute callback
private addLayer (String className, Array pageDims)
Adds the overlay to an element
alert (string message)
alert (Object options)
Renders a html alert box
confirm (string message)
confirm (Object options)
Renders a html confirm box
private DOMElement createMessageComponent (string message, Number width, Number height, Number top, Number left, string className)
Array getPageScroll()
Array getPageSize()
info (string message)
info (Object options)
Renders a html info box
boolean isInsideComponent (DOMElement elm, string className)
removeLayer()
removes a dialog
showAllFlash()
Shows all embed, object, iframe and select tags in a page, which might have been previously hidden
updatePosition()
update the position according to content
updateSize()
update the position according to content

Variable Details

variable private String _currentDialogId

Stores the id of the dialog which is currently being used

variable Object _dialogs

Hold all created dialogs

variable Object _elementsToHide

Defines which elements should be hidden when the overlay is active

variable private Number _intervalHideFlash

Amount of time the flash timer needs

variable Object _overlayLock

Lock used to prevent two dialogs over the same element

variable private intervalID _stoHideFlash

Interval timer which hides flash elements

Function Details

function _addComponent

_addComponent()
adds the internal component for a dialog to the DOM

function _createOverlay

private DOMElement _createOverlay()
creates the overlay DOM element
Returns:
DOM element for the overlay

function _getLeftPosition

Number _getLeftPosition(Array pageDims, Array scrollDims, Number width, string id)
Parameters:
pageDims - page dimensions
scrollDims - scrollable page dimensions
width - width of the internal dialog element
id - dialog id for the dialogs object
Returns:
The left position for the dialog's internal element

function _getTopPosition

Number _getTopPosition(Array pageDims, Array scrollDims, Number height, String id)
Parameters:
pageDims - page dimensions
scrollDims - scrollable page dimensions
height - height of the internal dialog element
id - dialog id for the dialogs object
Returns:
The top position for the dialog's internal element

function _hideAllFlash

_hideAllFlash(string className)
Hides all embed, object, iframe and select tags in a page, except what's inside the element with the given class name
Parameters:
className - A class name

function _makeCancelButton

private _makeCancelButton()
Create a cancel button and attach an event to it to execute the appropriate callback

function _makeNewDialog

private Object _makeNewDialog()
Creates a new dialog
Returns:
Object with pageDims and scrollDims for the created dialog. pageDims is relative to the parent element the created dialog is contained within an element.

function _makeOkButton

private _makeOkButton()
Create an ok button and attach an event to it to execute the appropriate callback

function _setOptions

private _setOptions(Object options)
Sets the options for this component, either through the object passed on initialization, or through default options.
Parameters:
options Same object which is passed to any of the alert, confirm or info calls.

function _setTargetElement

_setTargetElement(Object options)
Chooses the appropriate target element
Parameters:
options - passed to the alert, dialog or info calls
Returns:
false if an overlay is already active

function _setupComponent

_setupComponent(Object dialogInfo)
save initial dimensions, set top position and execute callback
Parameters:
dialogInfo - object with info about the dialog we're setting up

function addLayer

private addLayer(String className, Array pageDims)
Adds the overlay to an element
Parameters:
className Class name which is applied to the dialog
pageDims page dimensions

function alert

alert(string message)
alert(Object options)
Renders a html alert box
Parameters:
Message only
message Message to be shown
Options object
options Options for alert dialog:
  • string message - Message to be shown
  • [ string image ] - Image to be used on button
  • [ string okLabel ] - Text for the button label
  • [ Number width ] - dialog width
  • [ Number height ] - dialog height
  • [ Function onComplete ] - callback called after dialog is rendered. Receives dialog object as a parameter
  • [ function(DOMElement dialog) callBack ] - callback called when dialog is closed with an ok button. Receives dialog object as a parameter
  • [ function(DOMElement dialog) callBackCancel ] - callback called when dialog is closed with a cancel button. Receives dialog object as a parameter
  • [ string className ] - class name which should be applied to the dialog
  • [ elementID|DOMElement targetElementId|targetElement ] - render the dialog and overlay only on this element

function confirm

confirm(string message)
confirm(Object options)
Renders a html confirm box
Parameters:
Message only
message Message to be shown
Options object
options Options for confirm dialog:
  • string message - Message to be shown
  • [ string image ] - Image to be used on OK button
  • [ string imageCancel ] - Image to be used on Cancel button
  • [ string okLabel ] - Text for the OK button label
  • [ string cancelLabel ] - Text for the Cancel label
  • [ Number width ] - dialog width
  • [ Number height ] - dialog height
  • [ Function onComplete ] - callback called after dialog is rendered. Receives dialog object as a parameter
  • [ function(DOMElement dialog) callBack ] - callback called when dialog is closed with an ok button. Receives dialog object as a parameter
  • [ string className ] - class name which should be applied to the dialog
  • [ elementID|DOMElement targetElementId|targetElement ] - render the dialog and overlay only on this element

function createMessageComponent

private DOMElement createMessageComponent(string message, Number width, Number height, Number top, Number left, string className)
Parameters:
message - content of the internal component
width - internal component's width
height - internal component's height
top - internal component's top position
left - internal component's left position
className - class to be applied to the element
Returns:
The dialog's internal element

function getPageScroll

Array getPageScroll()
Returns:
A page's scrollable dimensions

function getPageSize

Array getPageSize()
Returns:
A page's dimensions

function info

info(string message)
info(Object options)
Renders a html info box
Parameters:
Message only
message Message to be shown
Options object
options Options for info dialog:
  • string message - Message to be shown
  • [ Number width ] - dialog width
  • [ Number height ] - dialog height
  • [ Function onComplete ] - callback called after dialog is rendered. Receives dialog object as a parameter
  • [ string className ] - class name which should be applied to the dialog
  • [ elementID|DOMElement targetElementId|targetElement ] - render the dialog and overlay only on this element

function isInsideComponent

boolean isInsideComponent(DOMElement elm, string className)
Parameters:
elm - A target element
className - A class name
Returns:
True if the given element is inside another with the given class name.

function removeLayer

removeLayer()
removes a dialog

function showAllFlash

showAllFlash()
Shows all embed, object, iframe and select tags in a page, which might have been previously hidden

function updatePosition

updatePosition()
update the position according to content

function updateSize

updateSize()
update the position according to content