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 

Introduction

Since commands are encapsulated into their own objects with no knowledge of the user interface or their visual representation, a pattern is needed in order to generate widgets from commands in a generic manner. This has been achieved using a builder pattern.

Usage

Command consumers or other objects that are responsible for displaying commands in the user interface should instantiate builders based on what they wish to display, for example, if buttons are the type of widget needed then a button builder should be used.

The builders have two public methods: the first is the create method which takes a command and a container that the built widget should be added to. It builds the widget based on the command and listens to the necessary properties on the command in order to update the UI when the command's state changes. The second is the remove method which also takes a command and a container as arguments but removes the widget that represents the given command from the container.

Here is an example of 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: Feb 23, 2015

Recommended reading