show different context menus based on what user clicks

Suite and Optimus Suite 5
#1

Hi, our application requires context menu to behavior like following :



If user right-click a circle, context menu1 appears

If user right-click a square, context menu2 appears

If user right-click empty space, context menu3 appears



We can have up to 60 circles and squares.



We know what and where user clicked, so we decided to use showContextMenu to show different menu. But what we observed is that context menu disappears the moment right mouse button is released. We also tried to use showContextMenu in a sample html – context.html. We made following changes to the html:



1. add onclick to body tag



2. remove style for contextArea





3. add a function called openContextMenu

function openContextMenu() {

menu.showContextMenu(100,100);

}



No context menu appeared upon user clicking.



Can you help us to find out a way to achieve what we need? Thank you!



Yingle
#2

so we decided to use showContextMenu to show different menu
The moment next to context menu showing - click events reach document.body , which counted as “click” and active context menu - closed
To prevent issue, just change your init code as

window.setTimeout(function(){
menu.showContextMenu(100,100);
},1);

The 1ms delay will be invisible for the user, but enough to prevent event concurrency.

By the way, if context menus used for different elements differs by few elements only - you can have a single menu object and use its onShow event ( or related event of grid|tree) to hide|show necessary items in menu exactly before showing it.