Menus are configured inline in the JSP page:
<l:menu id="menu"> <l:menuItem action="Mortgages" event="listAll"/> <l:menuItem action="Leasing" event="listAll" aliases="create, edit, save"/> <l:menuItem href="/support/listAllActions.jsp" label="ListAll"/> <l:menuItem action="Mail" event="showFolder"> <l:param name="folderName" value="INBOX"/> </l:menuItem> </l:menu>
Any menu item can point to a plain URL or an action/event pair, and may have nested <l:param> tags. Each menu item will add automatically a "selected" css class only if the current url matches its target url and all included parameters are found. In the above example, if the current request is "mail/folders?folderName=INBOX" the last menu item will be marked as selected.
The "aliases" attribute indicates alternate events that may mark the same menu item as selected. In this example 'listAll', 'create', 'edit' and 'save' are all events on action "Leasing" that will mark the second menu item as "selected".
Menu items that the user is not authorized to invoke will not be rendered by default.
These menus are used to select the user locale. The default locale is provided by the browser, but it can be overriden by setting a "locale" cookie either by javascript or from the server side.
<l:localeMenu id="languages" locales="en, es"/>
// hierarchical menu
new loom.ui.Menu($('navigation'));
// locale menu
new loom.ui.LocaleMenu($('locale-menu'));
Menus should still work even when javascript is off.
Performance can be improved by caching menu contents at the server, where its "id" attribute will be used as the cache key. Supported cache scopes are "session", "application" and "none". The default is "application" for locale menus and "none" for normal menus.
Cached menus will skip their body, so any changes will go unnoticed until the server or the browser gets restarted (or alternatively, by setting the caching type to "none" on the JSP page).
There are two menu decorators: nested and inline. They can be used by setting decorator="nested" or "inline" at any menu.
Inline menus are a sequence of links separated by an itemSeparator that defaults to '|'. They only support a single menu level, and are the default for locale menus.
Nested menus are lists of unordered items (ul) rendered hierarchically.
For example, to change the default layout of a menu from a list of items to a single line of links separated by "|", use this:
<l:menu id="menu" decorator="inline" itemSeparator=" | "> ... menu contents ... </l:menu>