Context Menu Customization
Using Ajax File Browser API you can modify context menus adding, deleting and disabling menu items. You can find the complete example of menu customization here.
The OnShowMenu Event
When a context menu is displayed the OnShowMenu event is fired. In OnShowMenu event handler you can manipulate the menu and customize it. To attach the event handler use the following code:
ITHit.Events.AddListener(ajaxFileBrowser.GetMenuManager(), 'OnShowMenu', onShowMenu);
...
function onShowMenu(menu, aContextMenuHierarchyItems) {
if (menu.Id == 'FoldersPanelMenu'){
...
}
}
The event handler takes the following parameters:
menu - the Menu object that represents one of the Ajax File Browser context menus. Each menu has a unique ID that you can use to identify the required context menu.
aContextMenuHierarchyItems - array of HierarchyItems selected under the context menu. You can use this parameter to get file(s) and/or folder(s) on which the context menu is displayed.
The Menu object passed to the event handler has a Children property that is an array of MenuItems, each representing menu item or menu separator. To add, delete or change the menu item you will add, delete and update items in this array.
Inserting the New Menu Item
To add a new item construct the MenuItem object and add it to the Menu.Children array. The following example adds new menu item and a separator:
function onShowMenu(menu, aContextMenuHierarchyItems) {
if (menu.Id != 'FoldersPanelMenu')
return;
// Insert new menu item before 'Copy' menu item.
var index = getMenuIndexByMenuId(menu, 'Copy');
if (index != -1) {
// insert new menu item and separator
menu.Children.splice(index, 0,
{ Type: 'MenuItem', Text: 'My Custom Dialog...', OnClick: function(){showMyDialog(aContextMenuHierarchyItems);} },
{ Type: 'MenuSeparator' }
);
}
}
function getMenuIndexByMenuId(menu, menuId) {
for (var i = 0, l = menu.Children.length; i < l; i++) {
if (menu.Children[i].Id == menuId) {
return i;
}
}
return -1;
}
Disabling Menu Item
To disable menu item set the MenuItem.Disabled property to true:
// Disable 'Delete' menu item.
var index = getMenuIndexByMenuId(menu, 'Delete');
if (index != -1) {
menu.Children[index].Disabled = true;
}
Deleting Menu Item
To delete the menu item remove it from Menu.Children array:
// Delete 'Custom Properties...' menu item.
var index = getMenuIndexByMenuId(menu, 'CustomProperties');
if (index != -1) {
menu.Children.splice(index, 1);
}
Changing Menu Item Text
To set a new text for the menu item specify the MenuItem.Text property:
// Rename 'Copy' menu item.
var index = getMenuIndexByMenuId(menu, 'Copy');
if (index != -1) {
menu.Children[index].Text = 'Copy to Buffer';
}
comments powered by
|