Menus

There are two different ways to add menus to Cloud9. The application menu has a different api from the context menu, for practical reasons.

Application Menu

You are free to place extra menu items anywhere in the menu structure of Cloud9. You can use an integer to specify the position of your menu items relative to others. The next example shows how to add a menu item to the File menu.

menus.addItemByPath("File/My Menu Item", new ui.item({
    command: "mycommand"
}), 300, plugin);

Based on the result of isAvailable() of the command, this menu will either show as enabled or disabled.

🚧

Positioning using an index

Throughout Cloud9 you'll see APIs that allow you to sort your items using integers. By using an int to set the position it is possible to determine the approximate position of, for instance an item in a menu without having any knowledge about other plugins that are loaded. Usually all plugins are a-like and there are no special ranges. Simply choose a position that makes sense to you and use it.

To see what the position ints are simply load Cloud9 with ?menus=1 in the url.

Adding a divider works in a similar way:

menus.addItemByPath("File/~", new ui.divider(), 310, plugin);

Context Menu

Commands that are linked to specific parts of the interface should be triggered by a menu item in a context menu. The context menu api is slightly different and requires the Menu, MenuItem and Divider plugins in your list of consumed plugins.

This example shows a straightforward way to create a menu:

var menu = new Menu({ items: [
    new MenuItem({ command: "open", caption: "Open..." }),
    new MenuItem({ command: "save", caption: "Save" }),
    new MenuItem({ command: "saveas", caption: "Save As..." }),
]}, plugin);

menu.show(10, 10);

It's easy to manipulate menus when needed:

var item = new MenuItem({ 
    caption : "Alert" 
    icon    : "alert.png" 
    onclick : function(){
        alert("Alert!");
    }
});
menu.append(item);

item.disabled = true;
item.caption = "No alert";

Submenus are normal context menus that are referenced by a menu item:

var listMenu = new Menu({}, plugin);
var item = new MenuItem({ caption: "List...", submenu: listMenu });