e Gl Dojo Widgets Doc

download e Gl Dojo Widgets Doc

of 33

Transcript of e Gl Dojo Widgets Doc

  • 8/12/2019 e Gl Dojo Widgets Doc

    1/33

    Rational Business Developer

    Developing with Dojo widgets

    Version 7 Release 5

  • 8/12/2019 e Gl Dojo Widgets Doc

    2/33

    NoteBefore using this information and the product it supports, read the information in Notices, on page 25.

    This edition applies to version 7.5.1.5 of Rational Business Developer and to all subsequent releases andmodifications until otherwise indicated in new editions.

    Copyright IBM Corporation 2009,2010.US Government Users Restricted Rights Use, duplication or disclosure restricted by GSA ADP Schedule Contractwith IBM Corp.

  • 8/12/2019 e Gl Dojo Widgets Doc

    3/33

    Contents

    Chapter 1. Developing with the EGLDojo widgets . . . . . . . . . . . . 1

    Preparation for using the EGL Dojo widgets . . . . 1Loading the Dojo Toolkit into your localenvironment . . . . . . . . . . . . . 2Defining the connection to use the Dojo Toolkitremotely . . . . . . . . . . . . . . . 3

    Themes to use with your application . . . . . . 3Coding an application by using Dojo widgets . . . 4

    Chapter 2. Dojo widget library . . . . . 7DojoAccordionContainer . . . . . . . . . . 8

    DojoContentPane . . . . . . . . . . . . 8DojoBarGraph . . . . . . . . . . . . . . 9DojoBubbleChart . . . . . . . . . . . . . 9

    BubbleChartData . . . . . . . . . . . 10DojoButton . . . . . . . . . . . . . . 10DojoCalendar. . . . . . . . . . . . . . 10DojoCheckbox . . . . . . . . . . . . . 11DojoColorPalette. . . . . . . . . . . . . 11DojoComboBox . . . . . . . . . . . . . 11DojoContextMenu . . . . . . . . . . . . 12DojoCurrencyTextBox . . . . . . . . . . . 12DojoDateTextBox . . . . . . . . . . . . 12DojoDialog . . . . . . . . . . . . . . 13

    DojoEditor. . . . . . . . . . . . . . . 13DojoGrid . . . . . . . . . . . . . . . 14

    DojoHorizonalSlider . . . . . . . . . . . 14DojoLineGraph . . . . . . . . . . . . . 15DojoMenu . . . . . . . . . . . . . . . 16

    DojoMenuItem . . . . . . . . . . . . 16DojoPieChart . . . . . . . . . . . . . . 17

    PieChartData . . . . . . . . . . . . . 17DojoProgressBar . . . . . . . . . . . . . 17DojoRadioGroup . . . . . . . . . . . . 18DojoStackContainer. . . . . . . . . . . . 18DojoTabContainer . . . . . . . . . . . . 19DojoTimeTextBox . . . . . . . . . . . . 19DojoTitlePane. . . . . . . . . . . . . . 20DojoToggleButton . . . . . . . . . . . . 21DojoTooltip . . . . . . . . . . . . . . 21

    DojoTooltipDialog . . . . . . . . . . . . 21DojoTree . . . . . . . . . . . . . . . 22

    DojoTreeNode . . . . . . . . . . . . 22

    Appendix. Notices . . . . . . . . . . 25Programming interface information . . . . . . 27Trademarks and service marks . . . . . . . . 27

    Index . . . . . . . . . . . . . . . 29

    Copyright IBM Corp. 2009,2010 iii

  • 8/12/2019 e Gl Dojo Widgets Doc

    4/33

    iv Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    5/33

    Chapter 1. Developing with the EGL Dojo widgets

    You can use the EGL Dojo widgets to develop an EGL Rich UI application.

    The Dojo Toolkit is an open source toolkit that contains JavaScript widgets. Formore information about the Dojo Toolkit, see http://dojotoolkit.org.

    The ready-to-use EGL Dojo version 1.4 widgets represent a set of commonly usedwidgets that extend the Rich UI widget library.

    Related concepts

    Preparation for using the EGL Dojo widgets

    Themes to use with your application on page 3

    Coding an application by using Dojo widgets on page 4

    Related tasks

    Loading the Dojo Toolkit into your local environment on page 2

    Defining the connection to use the Dojo Toolkit remotely on page 3

    Coding an application by using Dojo widgets on page 4

    Related reference

    Chapter 2, Dojo widget library, on page 7

    Preparation for using the EGL Dojo widgets

    You can develop with the EGL Dojo widgets by using either a local or remoteversion of the Dojo Toolkit. In either case, you must specify the Dojo Toolkitprovider on your EGL build path.

    Local The Dojo Toolkit must be imported into your workspace to provide the

    necessary code for the EGL Dojo widgets to run locally.Remote

    You can access the Dojo Toolkit by using a provider connection point. Touse the Dojo Toolkit remotely, you must connect to the toolkit though aprovider, such as Google or AOL. The provider hosts the Dojo Toolkit foruse by Dojo developers.

    You might use a local version of the toolkit instead of a remote version for manyreasons. To learn about the advantages and disadvantages of local and remoteaccess, seeTable 1 on page 2.

    One development scenario is to develop by using a remote version of the toolkit

    and to deploy by using a local version. With this scenario, you have the fastestdevelopment experience and can control the version of the Dojo toolkit because itis hosted on your server when you deploy.

    Copyright IBM Corp. 2009,2010 1

    http://dojotoolkit.org/http://dojotoolkit.org/
  • 8/12/2019 e Gl Dojo Widgets Doc

    6/33

    Table 1. Considerations for accessing the Dojo Toolkit locally or remotely

    Local Remote

    Flexibility

    v You do not need the Internet to access tothe toolkit.

    v You control where the toolkit is accessed

    from.v You can develop new Dojo widgets and

    debug the JavaScript.

    Performance

    v Performance is better because the browsercaches more resources.

    v The integrated development environment

    (IDE) is faster because there are fewerthings in your workspace.

    v You deploy your own application only,and you do not have to deploy the DojoToolkit files.

    Slower deployment

    v When you deploy your application, theDojo Toolkit files are copied to your webserver.

    v You must access the Dojo files from yourserver; this action might lead to extrabandwidth.

    v

    The startup time for your applicationmight be slower because of browsercaching and performance characteristics.

    Dependency on third parties

    v You must be connected to the Internet. Ifyou do not have a fast speed connection,the first run can be slow.

    v Hosted servers usually implement usagetracking, which you might want to avoid.

    v You must rely on a third party to

    maintain the integrity of the Dojo Toolkitlibraries.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related tasks

    Loading the Dojo Toolkit into your local environment

    Defining the connection to use the Dojo Toolkit remotely on page 3

    Related reference

    Chapter 2, Dojo widget library, on page 7

    Loading the Dojo Toolkit into your local environmentTo use the Dojo Toolkit locally, you must first load the toolkit into your localworkspace. The name of the local toolkit iscom.ibm.egl.rui.dojo.runtime.local_1.4. The EGL Dojo Toolkit is available onthe EGL Cafe in the form of a Project Interchange File.

    To load and configure your environment to use the local toolkit:

    1. Under Import projects, clickProject Interchange File. Select the name of theEGL Project Interchange file that was downloaded from the EGL Cafe. Selectthe projects that you want to import and click Finish.

    2. Update the EGL build path to specify the local EGL Dojo runtime project

    dependency. Right click your project and click Properties EGL Build Path.On the Projects tab, select com.ibm.egl.rui.dojo.runtime.local_1.4. ClickOK.

    Import projects

    Get the Dojo Toolkit project

    Related concepts

    Preparation for using the EGL Dojo widgets on page 1

    Related tasks

    Defining the connection to use the Dojo Toolkit remotely on page 3

    Related reference

    2 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    7/33

    Chapter 2, Dojo widget library, on page 7

    Defining the connection to use the Dojo Toolkit remotelyTo use a remote version of the Dojo Toolkit, you need a provider connectionproject in your workspace. You can import either of two provider connectionprojects into your workspace:

    v

    To use Google as the provider, import com.ibm.egl.rui.dojo.runtime.googlev To use AOL as the provider, import com.ibm.egl.rui.dojo.runtime.aol

    To load and configure your environment to use a connection project:

    1. Click File Project Interchange File. Select the EGL Dojo Project InterchangeFile that was downloaded from the EGL Cafe. Select the projects you want toimport and click Finish.

    2. Update the EGL build path to specify the connection service that you are usingto access the Dojo Toolkit. Right click your project and click Properties EGLBuild Path. On the Projects tab, select the provider project to use. Click OK.

    Related concepts

    Preparation for using the EGL Dojo widgets on page 1

    Related tasks

    Loading the Dojo Toolkit into your local environment on page 2

    Related reference

    Chapter 2, Dojo widget library, on page 7

    Themes to use with your application

    The appearance of your application is determined by a theme. Themes provide aconsistent appearance for all Dojo widgets in the application.

    You can use three themes: Nihilo, Soria, and Tundra. The following examples show

    each theme.Nihilo

    Chapter 1. Developing with the EGL Dojo widgets 3

  • 8/12/2019 e Gl Dojo Widgets Doc

    8/33

    Soria

    Tundra

    The examples in this document use the Tundra theme. To set a theme, use theDojoLib library from the initialization of your primary Rich UI handler:

    DojoLib.setTheme("tundra");

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Coding an application by using Dojo widgets

    To create an application by using the Rich UI Dojo widgets, you must create a RichUI Handler part. You write your code in the Rich UI Handler part.

    4 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    9/33

    The com.ibm.egl.rui.dojo.widgetsproject depends on the com.ibm.egl.ruiproject, which is created by default when you create a Rich UI project. Before youimport the Dojo project into a clean workspace, create a Rich UI project.

    To create a Rich UI handler, click File New Rich UI Handler. Use the Rich UIHandler wizard to complete the creation of the Rich UI Handler part.

    After the Rich UI Handler part is created, you can start to code your applicationby using the Rich UI editor. The following example shows a simple applicationthat contains a button:

    import dojo.widgets.DojoLib;

    Handler DojoButtonSample Type RUIHandler { initialUI = [ MyFirstButton ], onConstructionFunction = init }MyFirstButton dojo.widgets.DojoButton { text = "Button" };

    function init()DojoLib.setTheme("tundra");

    end

    end

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Chapter 1. Developing with the EGL Dojo widgets 5

  • 8/12/2019 e Gl Dojo Widgets Doc

    10/33

    6 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    11/33

    Chapter 2. Dojo widget library

    The EGL Dojo widgets represent a set of commonly used widgets that extend theRich UI widget library. The EGL Dojo widgets are located in the

    com.ibm.egl.rui.dojo.widgetsproject. To load the EGL Dojo widgets into yourenvironment import the com.ibm.egl.rui.dojo.widgetsproject available in theproject interchange file obtained from the EGL Cafe.

    The EGL Dojo widgets are located in the com.ibm.egl.rui.dojo.widgets project.This project is included during installation and when you open a new workspace.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    DojoAccordionContainer on page 8

    DojoContentPane on page 8

    DojoBarGraph on page 9DojoBubbleChart on page 9

    BubbleChartData on page 10

    DojoButton on page 10

    DojoCalendar on page 10

    DojoCheckbox on page 11

    DojoColorPalette on page 11

    DojoComboBox on page 11

    DojoContentPane on page 8

    DojoContextMenu on page 12

    DojoCurrencyTextBox on page 12DojoDateTextBox on page 12

    DojoDialog on page 13

    DojoEditor on page 13

    DojoGrid on page 14

    DojoHorizonalSlider on page 14

    DojoLineGraph on page 15

    DojoMenu on page 16

    DojoMenuItem on page 16

    DojoPieChart on page 17

    DojoProgressBar on page 17

    DojoRadioGroup on page 18

    DojoStackContainer on page 18

    DojoTabContainer on page 19

    DojoTimeTextBox on page 19

    DojoTitlePane on page 20

    DojoToggleButton on page 21

    DojoTooltip on page 21

    DojoTooltipDialog on page 21

    Copyright IBM Corp. 2009,2010 7

  • 8/12/2019 e Gl Dojo Widgets Doc

    12/33

    DojoTree on page 22

    DojoTreeNode on page 22

    DojoAccordionContainer

    The DojoAccordionContainer widget contains a set of panes in one pane of theuser interface. When an action is taken for an individual interface, another pane inthe interface is displayed. Each pane is defined by using the DojoContentPanewidget.

    Properties

    durationThe amount of time for the content pane to open after it is selected. Thevalue is in milliseconds.

    selectionSpecifies the pane that initially opens

    width The total width of the container

    height The total height of the container

    Functions

    resize Resize the entire accordion container.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoContentPane

    The DojoContentPane defines the content of a tab pane. You must use this widgetwith either the DojoAccordionContainer or DojoTabContainer widgets.

    Properties

    childrenSpecifies the contents on the tab pane, such as an EGL box widget

    closableIndicates whether the tab can be closed. Valid values are true and false.

    selectedIndicates the tab that is initially active when the page is displayed. Validvalues are true and false. If true is specified for multiple tabs, the last tab

    withselected=true is displayed.title The name that is displayed on the tab

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    DojoAccordionContainer

    DojoTabContainer on page 19

    Chapter 2, Dojo widget library, on page 7

    8 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    13/33

    DojoBarGraph

    The DojoBarGraph widget creates bar graphs. Use this widget to create vertical orhorizontal bar graphs.

    Properties

    barGap The gap, in number of pixels, between the bars. The default value is 5.

    data Required. The data that the graph represents. Data must be in arrayformat.

    height The total height of the graph

    themeColorThe color of the graph. You can use blue, red, cyan, green, orange, andpurple. The default value is blue.

    verticalIndicates whether the bars are vertical or horizontal. The default value istrue.

    true The bars are vertical.

    false The bars are horizontal.

    width The total width of the graph

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoBubbleChart

    The DojoBubbleChart widget creates bubble charts. Use this widget to show therelationship of three different sets of data.

    Properties

    data Required. The data that the chart represents. Data must be in array format.

    themeColorThe background color of the chart

    height The total height of the graph, specified in number of pixels. The defaultvalue is 350.

    maxX The maximum value for the x axis

    maxY The maximum value for the y axis

    minX The minimum value for the x axis

    minY The minimum value for the y axis

    width The total width of the graph, in number of pixels. The default value is 350.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    BubbleChartData on page 10

    Chapter 2. Dojo widget library 9

  • 8/12/2019 e Gl Dojo Widgets Doc

    14/33

    BubbleChartDataThe BubbleChartData record defines the data to be contained in a bubble chart.

    Properties

    color The fill color of the bubble

    size The size of the bubbletooltip

    The text that is displayed when the cursor is positioned over the bubble

    x The value of the horizontal axis of the graph

    y The value of the vertical axis of the graph

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoBubbleChart on page 9

    DojoButton

    The DojoButton widget creates a button that invokes a function in response to auser's click.

    Properties

    text The text label for the button.

    width The width of the button.

    Events

    onClickSpecifies an event that occurs when the button is pressed

    Relate concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoCalendar

    The DojoCalendar widget creates a calendar.

    Properties

    value Defines the month and highlights the day for the calendar that isdisplayed.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    10 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    15/33

    DojoCheckbox

    The DojoCheckbox widget creates check boxes.

    Properties

    selected

    Indicates that the check box can be selected. Valid values are true andfalse.

    text The text label for the check box

    Events

    onChangeSpecifies an event that occurs when the button is pressed. This event is aRich UI event.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoColorPalette

    The DojoColorPalette widget creates a color palette.

    Properties

    small The size of the palette

    True The palette is three rows and four columns

    False The palette is seven rows and ten columns

    value The color that is currently selected

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoComboBox

    The DojoComboBox widget creates combination boxes.

    Properties

    pageSize

    The number of items to be displayed at one time in the box

    value The default value

    values The list of values

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    Chapter 2. Dojo widget library 11

  • 8/12/2019 e Gl Dojo Widgets Doc

    16/33

    DojoContextMenu

    The DojoContextMenu widget creates a context menu that is invoked by aright-mouse click.

    Properties

    childrenContains an array of DojoMenuItem records; each record represents achoice on the menu.

    text The text label for the menu box

    targetsAn array of Box widgets

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoMenu on page 16

    DojoMenuItem on page 16

    DojoCurrencyTextBox

    The DojoCurrencyTextBox widget creates text input fields that supply numericcurrency values.

    Properties

    value The value of the input field

    currencyThe currency to be used. See ISO-4217 for list of valid currency codes.

    International Organization for Standardization (ISO) standards athttp://www.iso.org/iso/.

    errorMessageThe message that is displayed when the input is not valid

    width The size of the currency text box

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    http://www.iso.org/iso/support/currency_codes_list-1.htm

    DojoDateTextBox

    The DojoDateTextBox widget creates a date input field.

    Properties

    errorMessageThe message that is displayed when the input is not valid

    formatLengthThe format of the displayed data; for example, Monday, March 16, 2009

    12 Developing with Dojo widgets

    http://www.iso.org/iso/http://www.iso.org/iso/support/currency_codes_list-1.htmhttp://www.iso.org/iso/support/currency_codes_list-1.htmhttp://www.iso.org/iso/
  • 8/12/2019 e Gl Dojo Widgets Doc

    17/33

    versus 2009/03/16 versus 03/09. The length of the date might be restrictedby region and available storage. Specify a value of short, medium, long, orfull.

    value The value of the entered date

    Functions

    setValue

    clear Clear the current value.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoDialog

    The DojoDialog widget creates a pop-up dialog box.

    Propertiestitle The title that is displayed on the top of the dialog box

    childrenContains the code that defines the content that is in the dialog box. The

    box can contain anything that can be included in the Box widget; forexample, HTML or a DateBox widget.

    draggableSpecifies whether the dialog box can be dragged. Valid values are true andfalse.

    closableSpecifies whether the dialog box can be closed. Valid values are true and

    false.

    Functions

    showDialogOpens the dialog box. You can close the box by clicking the x on the righttop corner, or by pressing the Esc key.

    hideDialogHides the dialog box

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoEditor

    The DojoEditor widget creates a text box that has editing functions.

    Properties

    editorHeightThe height of the editor. Specify the value as an integer.

    Chapter 2. Dojo widget library 13

  • 8/12/2019 e Gl Dojo Widgets Doc

    18/33

    editorWidthThe width of the editor. Specify the value as an integer.

    Functions

    getContentsGets the HTML contents of the editor.

    setContentsSets the HTML contents of the editor.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoGrid

    The DojoGrid widget displays data in a table.

    Properties

    behaviorsDefines the function that is invoked for each cell

    columnsDefines the columns in the table

    data An array of records that contains information to put into the table. Specifyas data=(array_nameas any[]), wherearray_nameis the name of the array.

    headerBehaviorsDefines the function that is invoked for each header cell

    EventsonGridRowClick

    The action to occur when the row is selected

    Functions

    addRowAdds a row to the table

    removeRowRemoves a row from the table

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoHorizonalSlider

    The DojoHorizonalSlider widget creates a horizontal ruler.

    Properties

    maximumThe maximum value of the ruler

    14 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    19/33

    minimumThe minimum value of the ruler

    step The increments of the values between the minimum and maximum valuesof the ruler

    showLabelsIndicates whether to show the labels of the minimum, maximum, and steps

    values. Valid values are true and false.

    value The current value for the ruler

    width The size of the ruler in pixels

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoLineGraph

    The DojoLineGraph widget displays line graphs.

    Properties

    data The data that is plotted on the graph

    height The height of the graph in pixels

    maxX The maximum value to be displayed at the left of the x axis of the graph.The default is based on the number of elements in the data property.

    maxY The maximum value to be displayed at the top of the y axis of the graph.The default is based on the value of the data property.

    minX The minimum value to be displayed at the right of the x axis of the graph.This property defaults to 0.

    minY The minimum value to be displayed at the bottom of the y axis of thegraph. This property defaults to 0.

    showMarkersDefines whether a marker, or point, is shown on the line for the data thatis being graphed. Valid values are true and false.

    true A marker is shown on the line for each of the items being graphed.

    false A marker is not shown on the line for each of the items beinggraphed.

    showShadowsDefines if a shadow for the graph line is shown. Valid values are true and

    false.true Graph shadow is shown.

    false Graph shadow is not shown.

    tensionSets the curvature of the graph

    themeColorThe color of the graph. The color can be blue, red, cyan, green, orange, orpurple.

    Chapter 2. Dojo widget library 15

  • 8/12/2019 e Gl Dojo Widgets Doc

    20/33

    width The width of the graph in pixels

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoMenu

    Along with one or more DojoMenuItem widgets, the DojoMenu widget createsmenu items. To create complex menus, you can nest the DojoMenu andDojoMenuItem widgets.

    Properties

    childrenAn array of records that contains information to add to the menu. Specifyas children=(array_nameas any[]), wherearray_name is the name of thearray.

    text The text label for the menu box

    Events

    onMenuItemSelectedThe event that is called when a menu item is selected

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoMenuItem

    DojoMenuItemThe DojoMenuItem widget describes the items that are associated with a menu.Code a DojoMenuItem widget for each menu item.

    Properties

    disabledIndicates whether the menu item is disabled. If a menu item is disabled, itis gray. Valid values are true and false.

    iconClassSpecifies the CSS style class for the icon that is associated with the menuitem

    text The text of the item within the menu list

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoMenu

    16 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    21/33

    DojoPieChart

    Along with one or more PieChartData records, the DojoPieChart widget creates piecharts.

    Properties

    data The name of the PieChartData record that contains the data for the piechart

    fontColorThe color of the pie chart. It can be blue, red, cyan, green, orange, orpurple.

    height The height of the pie chart, in pixels

    labelOffSetThe offset of the labels from the center. For a radius of 100, a value ofvalue of 40 is optimal.

    radius The radius of the pie chart, in pixels. A value of 100 is optimal.

    width The total width of the pie chart, in pixels

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    PieChartData

    PieChartDataThe PieChartData record describes the sections within a pie chart. Code aPieChartData record for each section of the pie chart.

    Properties

    color The color that is associated with the section of the chart that you aredefining

    fontColorThe color of the font for the text label

    text The text that is to be placed inside the section

    y The numeric value that was used to calculate the amount of space this datarecord occupies in the chart related to the other data records.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoPieChart

    DojoProgressBar

    The DojoProgressBar widget displays progress bars.

    Chapter 2. Dojo widget library 17

  • 8/12/2019 e Gl Dojo Widgets Doc

    22/33

    Properties

    maximumThe maximum value of the progress

    progressThe current progress

    width The width of the progress barRelated concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoRadioGroup

    The DojoRadioGroup widget defines radio buttons.

    Properties

    optionsThe text label for the button

    selectedSpecifies whether the radio button can be selected. Valid values are trueand false.

    verticalSpecifies whether the list of buttons is horizontal or vertical. Valid valuesare true and false.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoStackContainer

    The DojoStackContainer widget creates a container that has multiple children. Onlyone child is displayed at a time.

    Properties

    height The total height of the container

    width The total width of the container

    controllerThe controller for the stack.

    selectionThe index of the currently selected stack.

    Events

    onStackSelectedNotifies users when the specified stack is selected.

    18 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    23/33

    Functions

    nextStackMoves to the next stack.

    prevousStackMoves to the previous stack.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoTabContainer

    The DojoTabContainer widget creates tab folders.

    Properties

    childrenAn array of DojoContentPane widgets that represent the tabs

    height The height of the tab folder, in pixels

    selectionReturns the index of the currently selected tab

    tabPositionThe position of the tab locations. Valid values are top, left, bottom, andright.

    width The width of the tab folder, in pixels

    Events

    onTabSelected

    The event that occurs when the tab is selected

    Functions

    showTabDisplays the specified tab

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoContentPane on page 8

    DojoTimeTextBoxThe DojoTimeTextBox creates a time input field.

    Properties

    clickableIncrementThe increment that is shown on the time selection menu. Increments rangefrom 5 minutes to 24 hours. The default value is 15 minutes. For example:

    TIMEBOX_ONE_QUARTERThe increment is 15 minutes.

    Chapter 2. Dojo widget library 19

  • 8/12/2019 e Gl Dojo Widgets Doc

    24/33

    TIMEBOX_HALF_HOURThe increment is 30 minutes.

    TIMEBOX_FULL_DAYThe increment is 24 hours.

    errorMessageThe message that is displayed when the input is not valid

    timePatternThe expected format pattern for the time to be entered

    TIMEBOX_FORMAT_12HRThe time format is between 12:00 - 11:59 AM and 12:00-11:59 PM.

    TIMEBOX_FORMAT_24HRThe time format is 0 - 24.

    value The value of the time that is selected

    visibleIncrementThe increment in which the time is displayed in the time selection menu.The difference between the times that are displayed and what is shown

    when someone clicks the input field.visibleRange

    The range of the times to be displayed in the time selection menu at onetime. To view additional times, use the scroll bar.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoTitlePane

    The DojoTitlePane widget creates a collapsible container with a title bar.

    Properties

    childrenThe box in the pane that contains information about the pane

    durationThe number of milliseconds that an animation runs

    isOpenControls whether the area is expanded or open by default

    title The title of the pane

    width The width of the title pane

    Functions

    setContentSpecifies the pane that is to be displayed

    setTitleSpecifies the title of the pane

    toggle Opens and closes the pane

    Related concepts

    20 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    25/33

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoToggleButton

    The DojoToggleButton widget creates a button and the text of the button changeswhen clicked.

    Properties

    text The text label for the button.

    checkedTextThe text label for when clicked.

    Functions

    isCheckedReturns true if the button is checked.

    Related conceptsChapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoTooltip

    The DojoTooltip widget creates a pop-up window that contains information. Youcan use the DojoTooltip with any element that uses the ID property.

    Properties

    contentsThe text that is displayed in the pop-up window.

    target The ID of the element to which the pop-up window is to attach.

    defaultPositionThe location where the pop-up window is to be displayed.

    delay The amount of time before the pop-up window is displayed.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoTooltipDialog

    The DojoTooltipDialog widget creates a tooltip that contains a dialog.

    Properties

    childrenThe contents of the dialog.

    Chapter 2. Dojo widget library 21

  • 8/12/2019 e Gl Dojo Widgets Doc

    26/33

    text The text label for the button.

    Functions

    hide Hides the dialog box.

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Preparation for using the EGL Dojo widgets on page 1

    Related reference

    Chapter 2, Dojo widget library, on page 7

    DojoTree

    The DojoTree widget works with an array of DojoTreeNode records to create trees.

    Properties

    childrenIdentifies the nodes that compose a tree. Points to an array of

    DojoTreeNode records that define the tree nodes.text The name of a top-level root node

    Events

    onClickSpecifies an event that occurs when the tree node is clicked

    Functions

    addTreeNodeAdds a tree node to the tree

    removeTreeNode

    Removes a tree node from the treeupdateTreeNode

    Changes a tree node in the tree

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoTreeNode

    DojoTreeNodeThe DojoTreeNode record creates the elements that compose a tree.

    Properties

    childrenDefines the sub-elements of the node, encloses the sub-elements in

    brackets, and separates each DojoTreeNode record with a comma.

    children = [ new DojoTreeNode { id = node_id, text = node_text },new DojoTreeNode { id = node_id, text = node_name }

    ]

    id The required identifier for this tree node

    22 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    27/33

    text The name of the node

    Related concepts

    Chapter 1, Developing with the EGL Dojo widgets, on page 1

    Related references

    Chapter 2, Dojo widget library, on page 7

    DojoTree on page 22

    Chapter 2. Dojo widget library 23

  • 8/12/2019 e Gl Dojo Widgets Doc

    28/33

    24 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    29/33

    Appendix. Notices

    This information was developed for products and services offered in the U.S.A.IBM may not offer the products, services, or features discussed in this document in

    other countries. Consult your local IBM representative for information on theproducts and services currently available in your area. Any reference to an IBMproduct, program, or service is not intended to state or imply that only that IBMproduct, program, or service may be used. Any functionally equivalent product,program, or service that does not infringe any IBM intellectual property right may

    be used instead. However, it is the user's responsibility to evaluate and verify theoperation of any non-IBM product, program, or service.

    IBM may have patents or pending patent applications covering subject matterdescribed in this document. The furnishing of this document does not grant youany license to these patents. You can send license inquiries, in writing, to:

    IBM Director of Licensing

    IBM CorporationNorth Castle DriveArmonk, NY 10504-1785U.S.A.

    For license inquiries regarding double-byte (DBCS) information, contact the IBMIntellectual Property Department in your country or send inquiries, in writing, to:

    IBM World Trade Asia CorporationLicensing2-31 Roppongi 3-chome, Minato-kuTokyo 106-0032, Japan

    The following paragraph does not apply to the United Kingdom or any other

    country where such provisions are inconsistent with local law:INTERNATIONAL BUSINESS MACHINES CORPORATION PROVIDES THISPUBLICATION "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHEREXPRESS OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIEDWARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY OR FITNESSFOR A PARTICULAR PURPOSE. Some states do not allow disclaimer of express orimplied warranties in certain transactions, therefore, this statement may not applyto you.

    This information could include technical inaccuracies or typographical errors.Changes are periodically made to the information herein; these changes will beincorporated in new editions of the publication. IBM may make improvementsand/or changes in the product(s) and/or the program(s) described in thispublication at any time without notice.

    Any references in this information to non-IBM Web sites are provided forconvenience only and do not in any manner serve as an endorsement of those Websites. The materials at those Web sites are not part of the materials for this IBMproduct and use of those Web sites is at your own risk.

    Licensees of this program who wish to have information about it for the purposeof enabling: (i) the exchange of information between independently created

    Copyright IBM Corp. 2009,2010 25

  • 8/12/2019 e Gl Dojo Widgets Doc

    30/33

    programs and other programs (including this one) and (ii) the mutual use of theinformation which has been exchanged, should contact:

    Intellectual Property Dept. for Rational SoftwareIBM Corporation3600 Steeles Avenue EastMarkham, ON Canada L3R 9Z7

    Such information may be available, subject to appropriate terms and conditions,including in some cases, payment of a fee.

    The licensed program described in this document and all licensed materialavailable for it are provided by IBM under terms of the IBM Customer Agreement,IBM International Program License Agreement or any equivalent agreement

    between us.

    Any performance data contained herein was determined in a controlledenvironment. Therefore, the results obtained in other operating environments mayvary significantly. Some measurements may have been made on development-levelsystems and there is no guarantee that these measurements will be the same on

    generally available systems. Furthermore, some measurements may have beenestimated through extrapolation. Actual results may vary. Users of this documentshould verify the applicable data for their specific environment.

    Information concerning non-IBM products was obtained from the suppliers ofthose products, their published announcements or other publicly available sources.IBM has not tested those products and cannot confirm the accuracy ofperformance, compatibility or any other claims related to non-IBM products.Questions on the capabilities of non-IBM products should be addressed to thesuppliers of those products.

    All statements regarding IBM's future direction or intent are subject to change orwithdrawal without notice, and represent goals and objectives only.

    This information contains examples of data and reports used in daily businessoperations. To illustrate them as completely as possible, the examples include thenames of individuals, companies, brands, and products. All of these names arefictitious and any similarity to the names and addresses used by an actual businessenterprise is entirely coincidental.

    COPYRIGHT LICENSE:

    This information contains sample application programs in source language, whichillustrate programming techniques on various operating platforms. You may copy,modify, and distribute these sample programs in any form without payment toIBM, for the purposes of developing, using, marketing or distributing application

    programs conforming to the application programming interface for the operatingplatform for which the sample programs are written. These examples have not

    been thoroughly tested under all conditions. IBM, therefore, cannot guarantee orimply reliability, serviceability, or function of these programs.

    Each copy or any portion of these sample programs or any derivative work, mustinclude a copyright notice as follows:

    (your company name) (year). Portions of this code are derived from IBM Corp.Sample Programs. Copyright IBM Corp. _enter the year or years_. All rightsreserved.

    26 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    31/33

    If you are viewing this information softcopy, the photographs and colorillustrations may not appear.

    Programming interface information

    Programming interface information is intended to help you create applicationsoftware using this program.

    General-use programming interfaces allow you to write application software thatobtain the services of this program's tools.

    However, this information may also contain diagnosis, modification, and tuninginformation. Diagnosis, modification and tuning information is provided to helpyou debug your application software.

    Warning: Do not use this diagnosis, modification, and tuning information as aprogramming interface because it is subject to change.

    Trademarks and service marks

    IBM, the IBM logo, and ibm.com are trademarks or registered trademarks ofInternational Business Machines Corporation in the United States, other countries,or both. These and other IBM trademarked terms are marked on their firstoccurrence in this information with the appropriate symbol ( or ), indicating USregistered or common law trademarks owned by IBM at the time this informationwas published. Such trademarks may also be registered or common lawtrademarks in other countries. A current list of IBM trademarks is available on theWeb at www.ibm.com/legal/copytrade.html.

    Java and all Java-based trademarks are trademarks of Sun Microsystems, Inc. in theUnited States, other countries, or both.

    Linux is a trademark of Linus Torvalds in the United States, other countries, orboth.

    Microsoft and Windows are trademarks of Microsoft Corporation in the UnitedStates, other countries, or both.

    UNIX is a registered trademark of The Open Group in the United States and othercountries.

    Other company, product or service names, may be trademarks or service marks ofothers.

    Appendix. Notices 27

  • 8/12/2019 e Gl Dojo Widgets Doc

    32/33

    28 Developing with Dojo widgets

  • 8/12/2019 e Gl Dojo Widgets Doc

    33/33

    Index

    Aapplications

    Dojo widgets 5

    BBubbleChartData

    Dojo 10

    Ddojo

    widgetsDojoLineGraph 15DojoTimeTextBox 19

    Dojo

    widgetsBubbleChartData 10coding 5ContextMenu 12DojoAccordionContainer 8DojoBarGraph 9DojoBubbleChart 9DojoButton 10DojoCalendar 10DojoCheckbox 11DojoColorPalette 11DojoComboBox 11DojoContentPane 8DojoCurrencyTextBox 12DojoDateTextBox 12

    DojoDialog 13DojoEditor 13DojoGrid 14DojoHorizonalSlider 14DojoMenu 16DojoMenuItem 16DojoPieChart 17DojoProgressBar 18DojoRadioGroup 18

    Dojo (continued)widgets (continued)

    DojoStackContainer 18DojoTabContainer 19DojoTitlePane 20DojoToggleButton 21DojoTooltip 21DojoTooltipDialog 21DojoTree 22DojoTreeNode 22library 7local 2overview 1PieChartData 17preparation 1remote 3themes 3

    DojoBarGraph

    Dojo 9DojoBubbleChart

    Dojo 9DojoButton

    Dojo 10DojoCheckbox

    Dojo 11DojoContentPane

    Dojo 8DojoContextMenu

    Dojo 12DojoCurrencyTextBox

    Dojo 12DojoDateTextBox

    Dojo 12

    DojoDialogDojo 13

    DojoGridDojo 14

    DojoLineGraphDojo 15

    DojoMenuDojo 11, 14, 16

    DojoMenuItemDojo 16

    DojoPieChartDojo 17

    DojoProgressBarDojo 18

    DojoRadioGroupDojo 18

    DojoTabContainerDojo 19

    DojoTimeTextBoxDojo 19

    DojoTitlePaneDojo 20

    LlibraryDojo 7

    PPieChartData

    Dojo 17

    Ttrademarks 27

    Wwidgets

    Dojo 8, 10, 13, 18, 21coding 5local 2overview 1preparation 1remote 3themes 3