SUI.ActionList

SUI.ActionList is a component that helps you manage the different actions that can be performed in an user interface. It gives you a centralized repository to store your actions and different interface elements can register to and trigger those actions.

For example: in your interface the save action is triggered by a toolbar button, a context menu item and a key combination. Instead of calling your save action directly by the element handlers of these controls, you can call this action through the action list. The benefits of the action list is that the toolbar and context menu can use common data as the action's descriptive text and icon, but it also provides a centralized way to enable/disable the action and show the enabled state in the user interface.

The following code exerpt shows an action list together with a toolbar and context menu component that use the actions of the list. Both the toolbar and context menu will also use the action list for the text and icon of their items. Changes to the enabled state of the action list's items will be reflected by the toolbar and context menu.

// Create an actionlist: add descriptive information (icon, title)
// to the action and store these in the list.
var actionList = new SUI.ActionList([{
    actionId: "error",
    title: "Show an error message",
    icon: "delete.png",
    handler: function(){alert("Error");}
},{
    actionId: "ok",
    title: "Show an ok message",
    icon: "tick.png",
    handler: function(){alert("Ok");}
},{
    actionId: "alert",
    title: "Show an alert message",
    icon: "info.png",
    handler: function(){alert("Alert");}
}]);

// Create a toolbar that uses actions from the action list
var toolbar = new SUI.Toolbar({
    top: 20, left: 20, width: 120,
    actionlist: actionList,
    tools: [
        new SUI.ToolbarButton({actionId: "error"}),
        new SUI.ToolbarButton({actionId: "ok"}),
        new SUI.ToolbarButton({actionId: "alert"})
    ]
});

// Create a menu that uses actions from the action list
var menu = new SUI.PopupMenu({
    actionlist: actionList,
    items: [
        { actionId: "error" },
        { actionId: "ok" },
        { actionId: "alert" }
    ]
});

Defined in: ActionList.js