The Domino Designer Application and Design Environment

There are several ways to open the Domino Designer, but the easiest is to select a database you want to design from the Workspace and right-click it, which displays a pop-up menu. Then select Open in Designer, which opens the Domino Designer (also called the Designer for short) as shown earlier in Figure 6.1.

There are two basic “panes” within the Domino Designer window: the Design Pane and the Work Pane. The Design Pane maintains a list of databases that have recently been opened in the Designer, as well as the design elements they contain. The design elements are grouped by type. For example, you could select Forms to see all the forms in the database. This function is new to 6 and enables Designers to scroll and choose a specific element without listing them in the work pane. After the developer selects the type of design element to work on, the list of those elements in the database is displayed in the Work Pane.

The Work Pane displays a list of particular design elements of a given type, such as forms, views, or agents, within the selected database. A developer can then double-click the design element to open it, which then modifies the display of the Designer, as shown in Figure 6.2.

After a design element has been opened, the Designer is split into three windows. The Design Pane remains on the left side of the screen for ease of navigation between elements and databases, whereas the Work Pane is displayed at the top of the screen and is joined by the Programmer's Pane displayed at the bottom of the screen, as already illustrated by Figure 6.2. The design element opened is displayed in the Work Pane. It is within the Work Pane that developers can modify the selected element, such as by adding fields to a form or modifying the columns within a view.

The Programmer's Pane is where all the real action takes place when it comes to Domino development, as this is where programming logic is coded for Domino elements.

Setting Programmer's Pane Properties

In a much-appreciated effort to make coding as efficient and effective as possible, Lotus/IBM has made the Programmer's Pane highly configurable, and it can be customized to suit your particular tastes.

Various aspects of the Programmer's Pane can be customized, including font face, font size, font color, indention, wrapping, and other more advanced features such as Auto-Complete, which is covered shortly.

Additionally, you can make specific changes that will affect the formatting of any of the following types of code, and the exact options vary depending on the code type:

• Script/Java

• Formulas

• Simple Actions

To customize the Programmer's Pane, follow these steps.

1.	Right-click in the Programmer's Pane, which opens a pop-up menu. Alternatively, right-click in the Programmer's Pane and click the Properties icon on the tool bar. Either of these actions opens the Programmer's Pane properties box shown in Figure 6.3. Figure 6.3. A form ready to be designed. [View full size image]
2.	The Programmer's Pane properties box opens to the Text tab (first tab). Select the type of code to format in the Text Formatting For radio button.
3.	Select the desired font face and font size. Optionally, select colors for various code elements. Colors can be selected only for LotusScript/Java and Formula code. The following list defines the code elements that can be modified: Normal Identifiers Keywords Comments Errors Constants
4.	Click the Format tab (second tab) to configure the following language-specific settings: Auto-Indent LotusScript— This feature is enabled by default and is used to make LotusScript code more readable. However, you can disable it here. Auto-Wrap Formulas— This feature is enabled by default and causes long lines of Formula code to wrap. It can be disabled here. Automatically add “Option Declare”— This feature is enabled by default and is new to Domino 6. As a best practice, you should always use Option Declare in your LotusScript code to ensure that all variables must be explicitly declared.
5.	Optionally, click the Auto-Complete tab (3rd tab) to configure the new Auto-Complete settings, which are covered in more detail shortly: Auto List Members— Enabled by default, this feature controls the automatic display of a context-sensitive pop-up list of available options. Auto Pop-up— Enabled by default, this feature displays a parameter list for a triggering function or method to ease coding. Delay— This option controls the amount of time (in milliseconds) between a trigger keystroke (one that matches an element name) and a second keystroke before the pop-up list displays. Another keystroke before the specified time has elapsed stops the list from popping up.
6.	Close the Programmer's Pane properties box after you have made the desired changes.

Using the Programmer's Pane Auto-complete

As stated earlier, Auto-complete is a very handy new feature of Domino 6 that uses type-ahead functionality to select and paste certain syntax elements directly into the Programmer's Pane as you are coding. If the syntax element that you have selected takes parameters, the valid parameters are displayed in the pop-up to help guide you as you code.

Auto-completion is available when coding

• @Commands

• @Functions

• LotusScript classes

Using Auto-complete with @Functions

To use Auto-complete when coding @Functions in the Programmer's Pane, follow these steps:

1.	Enter the “at” symbol (@) and pause momentarily to launch the Auto-complete pop-up, which displays a list of all available choices, which is shown in Figure 6.4. Figure 6.4. The very handy @Function auto-complete list. [View full size image]
2.	Begin typing the name of a function (type-ahead) or scroll through the list and select the appropriate function. For example: @Left(
3.	After you have located the functions, press Enter to paste the function into the Programmer's Pane and close the pop-up list.
4.	Optionally, for functions that take parameters, type a left parenthesis “(“ to launch a pop-up containing the syntax of the first signature. The first valid parameter appears bolded. If up and down arrows display, they indicate that you can press the up and down arrow keys to display the various options.
5.	Optionally, if the function takes multiple parameters, enter a semicolon ( ; ) between each parameter, and the next parameter appears bolded.
6.	Enter a right parenthesis “)” to complete the function, or simply press Esc to close the pop-up.

Using Auto-complete with @Commands

To use Auto-complete when coding @Commands in the Programmer's Pane, follow these steps:

1.	Enter the “at” symbol (@) and a left square bracket ([) and pause momentarily to launch the Auto-complete pop-up, which displays a list of all available choices.
2.	Begin typing Command (type-ahead) and a left parenthesis and pause momentarily, or scroll through the list and select the Command, which then displays a list of valid commands (shown below in Figure 6.5). For example: @Command( Figure 6.5. The @Command Auto-complete list. [View full size image]
3.	Begin typing the name of the desired command (type-ahead) or scroll through the list and select the appropriate command. After a command is selected, square brackets ([ ]) are added automatically. For example: @Command([AddBookmark])
4.	Optionally, if the command takes multiple parameters, enter a semicolon ( ; ) between each parameter, and the next parameter appears bolded.
5.	Enter a right parenthesis “)” to complete the command, or simply press Esc to close the pop-up.

Using the Auto-complete with LotusScript

To use Auto-complete when coding LotusScript in the Programmer's Pane, follow these steps.

1.	Declare an object and enter a space following the As keyword to open a pop-up list of available classes, which is shown in Figure 6.6. Figure 6.6. The pop-up list of available classes; where has this feature been all my life? [View full size image]
2.	Begin typing the name of a valid object, or scroll through the list and select the appropriate object.
3.	Optionally, enter a period (.) after an object name, which opens a pop-up of methods and properties.
4.	Optionally, from the pop-up list of methods and properties, either type ahead to select the desired element or scroll through the list and select it. Press Enter to paste the element into the Programmer's Pane.
5.	Optionally, for methods that take parameters, simply type a left parenthesis “(“ to display a pop-up box displaying the parameter list. The first parameter appears bolded.
6.	Optionally, enter a comma (,) between each parameter, which makes the next parameter bold.
7.	Enter a right parenthesis “)” or press Esc to close the pop-up.

Using the Designer Reference Panel

The Designer Reference Panel of the Programmer's Pane is a valuable tool that provides reference information about the current programming context, meaning that the options it displays vary depending on the programming language selected.

The Designer Reference Panel provides information for the following coding choices:

• Formulas

• LotusScript

• JavaScript

• Java

The Designer Reference Panel is displayed in Figure 6.7.

When coding in the Formula language you have the following reference options:

• Database fields— This option displays a list of all the fields in the current database.

• Formula @Commands— This option displays a list of all the @Commands available.

• Formula @Functions— This option displays a list of all the @Functions available.

After you have selected an item in the list, you double-click it to paste it into the Programmer's Pane to start coding, or you can click Help to get online help for the selected entry.

When coding in the LotusScript you have the following reference options:

• LotusScript Language— This option displays a list of all native LotusScript language functions.

• Domino: Classes— This option displays a list of Domino classes available in LotusScript.

• Domino: Constants— This option displays a list of all pre-defined LotusScript constants.

• Domino: Subs and functions— This option displays a list of all the fields in the current database.

• Domino: Variables— This option displays a list of all the LotusScript variables.

• OLE Classes— This option displays a list of all the OLE Classes installed on the machine.

When coding in Java you have the following reference options:

• Core Java— This option displays a list of all Java classes.

• Notes Java— This option displays a list of Domino classes available in Java.

• Third-party Java— This option displays a list of all third-party Java classes. At the present time this is primarily XML related and includes DOM and SAX classes.

When coding in JavaScript you have the following reference options:

• Web D.O.M.— This option displays a list of all Document Object Model (D.O.M.) methods, properties, and commands for Web clients.

• Notes D.O.M.— This option displays a list of all Document Object Model (D.O.M.) methods, properties, and commands for Notes clients.

Using the Designer Objects Pane

The Designer Objects pane, shown in Figure 6.8, is a fundamental part of IDE and is used to select an object within the current design element to program. Similar in function to the Designer Reference Panel, it displays a context-sensitive list of objects and events and can be found in the lower left section of the Programmer's Pane.

Using the Designer Objects pane is easy. You select an object in the current design element to program, select a programming language, and begin coding—it's just that simple.

The Designer Object pane enables you to code objects and events by using any of the following choices:

• Formulas

• LotusScript

• JavaScript

• Java

• Imported Java

• Simple Actions

Making Preferred Tools Available via the IDE

New to Domino 6 is the really cool capability to customize and extend the Tools menu in the Designer client. You can now include menu items that launch other commonly used applications, such as a graphics editing tool or CSS editor, or you can write your own formulas to run. You can also create submenus under which you can group related tools. A customized Tools menu is shown in Figure 6.10 later in this section.

Additionally, when you add a new tool to the menu, you can define when the tool will be available so that the tool appears in the menu only when you need it. For example, you might want to keep your graphics editor available all the time, whereas the CSS editor menu option appears only when you are editing a form, page, or subform.

Adding a new tool to the Tools menu is easy; just follow these steps:

1.	Select Tools, Add Tool from the menu in the Designer client, which opens the Add Tool dialog box, shown in Figure 6.9. Figure 6.9. The Add Tool dialog box makes it easy to add Tools menu options.
2.	Enter a descriptive name for the menu option in the Tool Name field. Make sure to use a name you'll recognize later as this is what will be displayed in the Tools menu.
3.	Choose Run Program or Run Formula for the Tool Action, as follows: To launch an external application from the menu, choose Run Program, and then either enter the path for the executable file to launch or click the file folder icon to browse the file system to select the executable. To run a custom-coded formula, select Run Formula and enter a formula.
4.	In the Tool Context box, choose one or more contexts in which the new menu option should be displayed. To ensure that the tool is always displayed, choose Always, otherwise, select one or more contexts in which the menu item should be displayed.
5.	Click OK to save the tool and add the new option to the Tools menu.

After you have added a custom tool, it appears in the Tools menu for the contexts you defined.

To edit an existing custom tool, follow these steps:

1.	Select Tools, Customize Tools from the menu, which opens the Customize Tools dialog box shown in Figure 6.10.
2.	Select the context that contains the tool to be modified and click the arrow beside it to expand the list of tools in that design context.
3.	Select the tool and click the Edit button to edit the name of the tool and/or the formula that it executes. Tools that launch an executable program actually use the @command([Execute]) command to run the executable.
4.	Click OK to save changes.

To delete a tool from the Tools menu, follow these steps:

1.	Select Tools, Customize Tools from the menu, which opens the Customize Tools dialog box shown in Figure 6.10.
2.	Select the context that contains the tool to be deleted and click the arrow beside it to expand the list of tools in that design context.
3.	Select the tool and click Cut to remove it.

To further enhance its usability, you can use submenus to divide the Tools menu into logically grouped categories. Figure 6.11 shows my customized Tools menu.

To add a submenu to the Tools menu, follow these steps:

1.	Select Tools, Customize Tools from the menu, which opens the Customize Tools dialog box shown in Figure 6.10.
2.	Select the context in which the submenu should display and then click the Add Submenu button, which opens a prompt.
3.	Enter a name for the submenu in the Submenu name field and click OK.
4.	Position the submenu and its children within the selected context by using either drag-and-drop or the Copy and Paste buttons. Click OK.