Try our conversational search powered by Generative AI!

Loading...
Area: Optimizely CMS
ARCHIVED This content is retired and no longer maintained. See the latest version here.

Recommended reading 

Because commands are encapsulated into their own objects with no reference for the user interface or their visual representation, you need a builder pattern to generate widgets from commands in a generic manner.

A command consumer (or other objects that are responsible for displaying commands in the user interface) should instantiate a builder based on what you want to display. For example, if a button is the type of widget you want then use a button builder.

The builders have two public methods:

  • create. Takes a command and a container to which you add the built widget. The create method builds the widget from the command and uses the properties on the command to update the UI when the command's state changes.
  • remove. Takes a command and a container as arguments but removes the widget that represents the given command from the container.

The following example shows the button builder in use:

JavaScript
require([
    "dijit/Toolbar",
    "epi/shell/command/builder/ButtonBuilder",
    "epi/shell/command/ToggleCommand"
], function (Toolbar, ButtonBuilder, ToggleCommand) {

    var toolbar = new Toolbar(),
        builder = new ButtonBuilder(),
        model = { enabled: true },
        command = new ToggleCommand({
            model: model,
            property: "enabled"
        });

    builder.create(command, toolbar);

});
Do you find this information helpful? Please log in to provide feedback.

Last updated: Sep 21, 2015

Recommended reading