documentation

Documentation generator: JsDoc Toolkit 2.4.0
Template: Wink 1.0
Generated on:

Class wink.ui.layout.ModalWindow

Implements a Modal Window. A modal window can make a content as an icon, this content can be displayed as a window. An icon is optionally movable, is associated with an image and the transition time between the view as an icon and the view as content is customizable.

Class Summary
Constructor Attributes Constructor Name and Description
 
Compatibility
Compatibility list Supported platforms / browsers
iOS2, iOS3, iOS4, iOS5, iOS6, Android 1.5, Android 2.1, Android 3.0, Android 3.1, Android 4.0, BlackBerry 6, BlackBerry 7, Bada 1.0, Windows Phone 7.5, Windows Phone 8

Method Summary

Class Detail

wink.ui.layout.ModalWindow(properties)
var modalWindow = new wink.ui.layout.ModalWindow({
  iconView:  { image: "./icon.png", x: 0, y: 0, sizeX:  80, sizeY:  80 },
  modalView: { content: "content1", x: 0, y: 0, sizeX: 300, sizeY: 300 },
  displayDuration: 800,
  canDrag: true
});

container.appendChild(modalWindow.getDomNode());
Parameters:
{object} properties
The properties object
{object} properties.iconView
Identifies the position, the size and the image of the icon viewer : { image, x, y, sizeX, sizeY }
{object} properties.modalView
Identifies the position, the size and the content node Id of the modal view : { content, x, y, sizeX, sizeY }
{integer} properties.displayDuration
The duration of the transition from icon to modal view and conversely (in milliseconds)
{boolean} properties.canDrag
Indicates whether icon dragging is enabled
Requires:
wink.ux.MovementTracker
See:
Test page
Test page (with scroller)

Field Detail

{boolean} canDrag
Indicates whether icon dragging is enabled
{integer} displayDuration
The duration of the transition from icon to modal view and conversely (in milliseconds)
{object} iconView
Identifies the position, the size and the image of the icon viewer : { image, x, y, sizeX, sizeY }
{object} modalView
Identifies the position, the size and the content node Id of the modal view : { content, x, y, sizeX, sizeY }
{integer} uId
Unique identifier

Method Detail

  • {HTMLElement} getDomNode()
    Returns:
    {HTMLElement} The ModalWindow dom node
  • shiftCloseNode(x, y)
    Shifts the close node to the given position
    Parameters:
    {integer} x
    Position on x-axis
    {integer} y
    position on y-axis