×
Namespaces

Variants
Actions
Revision as of 06:46, 5 July 2012 by hamishwillee (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

DrY LightBox

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata
Code ExampleArticle
Created: symbianyucca (16 May 2010)
Last edited: hamishwillee (05 Jul 2012)
DrY LightBox component is based on Guarana Button implementation, and ist functionality thus is rather similar to the Guarana implementation.

Following code snipped shows how it can be used:

dojo.require("dry.LightBox");
 
var buttonData = [
{
button: {
label: "Continue",
clicked: clickedHandler,
focused: focusedHandler,
unfocused: unfocusedHandler,
pressed: pressedHandler,
unpressed: unpressedHandler
},
id: "ContinueCancelButtonId"
},{
button: {
label: "Cancel",
clicked: clickedHandler,
focused: focusedHandler,
unfocused: unfocusedHandler,
pressed: pressedHandler,
unpressed: unpressedHandler
},
id: "CancelButtonId"
},{
button: {
label: "Remove",
clicked: clickedHandler,
focused: focusedHandler,
unfocused: unfocusedHandler,
pressed: pressedHandler,
unpressed: unpressedHandler
},
id: "RemovelButtonId"
}];
 
var dialogData = "<h1>Lightbox Example</h1><p>Hello there <p>"
 
 
var dialog = new dry.LightBox({
autoOpen: false,
height: 300,
width: 400,
hidden: dialogHidden,
shown: dialogShown,
destroyed: dialogDestroyed,
buttons:buttonData,
content: dialogData,
styleTweaker: styleTweaker},
'DialogDiv');

The constructor takes 2 items, where the second one is the name for the div where the LightBox is placed in. The first argument is a struct defining the LightBox properties and callback functions:

  • autoOpen: true/false, defines whether the dialog is shown when constructed,
  • height: height for the component,
  • width: width for the component,
  • hidden: callback called when the dialog is Hidden,
  • shown: callback called when the dialog is Shown,
  • destroyed: callback called when the dialog is Destroyed,
  • buttons: button definition array,
  • content: html data shown in the dialog,
  • styleTweaker: styleTweaker for handling the themes.


Examples

Go to DrY Index

This page was last modified on 5 July 2012, at 06:46.
38 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×