Details
-
Type:
Improvement
-
Status: Closed
-
Priority:
Minor
-
Resolution: Fixed
-
Affects Version/s: 3.2
-
Fix Version/s: EE-3.2.0.BETA, EE-3.2.0.GA, 3.3
-
Component/s: ACE-Components
-
Labels:None
-
Environment:ICEfaces ACE menu components
-
Assignee Priority:P2
Description
This is fine so long as there is enough space above the root menuItem to display the entire contents of the subMenu, etc.. However, in many cases the root menuItem is placed near the top of the page, so the subMenu will be clipped by the top of the browser and you will have no way to view the entire contents.
A better approach is to only display the subMenu, etc. above the root menuItem if there is enough room to display the entire thing, otherwise, revert to displaying it below the root menuItem.
In addition, if the user specifies a menuPosition via the attribute, that position should ALWAYS be used, regardless of whether there is room for it there or not.
Activity
- All
- Comments
- History
- Activity
- Remote Attachments
- Subversion
The fix thus far looks good. However, there is another situation where submenu positioning should be improved:
- View the menuBar showcase demo.
- Shorten the browser window size so the File menu open right at the right edge of the menu.
- Open the File menu, then hover over the "New" menu.
- Notice that the New submenu opens off the screen to the right. It should open to the left side in this case, as there is sufficient room on the left to show it, but not on the right.
Basically, each subMenu should use the same logic as the top-level one when determining where to position itself.
Committed modification for requirement in previous comment at revision 32906.
This modification follows a similar logic to the vertical case, previously added. In particular, when displaying submenus and horizontal direction is 'auto': if there's enough spece to the right to display the submenu, then display it to the right, otherwise see if there's enough space to the left to display it entirely, if there is, then display it to the left, otherwise just display it to the right.
Confirmed fixed using the showcase application. Tested in FF17, IE9, and GoogleChrome23 on trunk revision# 32906.
Committed fix to trunk at revision 32747.
The previous displaying logic was in jquery, so I had to add height and position calculations in our code to follow the following logic: if there's enough spece below to display the submenu, display it below, otherwise see if there's enough space above to display it entirely, if there is, then display it above, otherwise just display it below. So, in the last case, the user might have to scroll down a little, but the menu won't be cut off as when it is displayed above and near the top of the page.
This fix was applied to ace:menuBar and ace:contextMenu (for either ace:submenu or ace:multiColumnSubmenu).
Also fixed a bug in the 'direction' attribute of ace:menuBar. If it was set simply to 'up', then the submenu was displayed over the parent item. There was no problem when using a value like 'up right' or 'up auto', etc.
Testing notes: Just make sure that the component follows the new logic in ace:menuBar and ace:contextMenu. Test both root menus and submenus. Also, make sure that other possible values for 'direction' aren't affected.