Embedded Objects - Menu

Menu is a tree of menu nodes. A menu node can link to a page, a URL address, or open a submenu. A menu can be embedded in a page using <object type="menu"></object>, and it can be shown in different styles, including menu_bar, tiered_menu, and tree.

Embed a website menu with its menu id. The menu is defined in Website module.


<div>
<object xmlns="http://www.cmobilecom.com/af/objects" 
  id="menu1" type="website.menu">
  <menuId>1</menuId>
  <viewConfig>
     <menuStyle>menu_bar</menuStyle>
  </viewConfig>
</object>
</div>
Embed the menu that is created from a hierarchy entity list.

For example, book categories are hierarchy entities. Clicking a book category will list all the books under the category.


<object xmlns="http://www.cmobilecom.com/af/objects"
        id="menu2" type="menu">
  <entityType>module.BOOK</entityType>
  
  <viewConfig>
     <viewType>MENU</viewType>
     <menuStyle>TREE</menuStyle>
     <menuNode key="hierarchy.entity">
        <name>#{entity.name}</name>
     	<renderStyle>
     	  <styleNumber>16</styleNumber>
     	</renderStyle>
        <outputLink>/listBooks.page?category=#{entity.hierarchyId}</outputLink>
     </menuNode>
     <menuNode key="hierarchy.root">
        <name>#{bundle.AllBooks}</name>
     	<renderStyle>
     	  <styleNumber>16</styleNumber>
     	</renderStyle>
        <outputLink>/listBooks.page</outputLink>
     </menuNode>     
  </viewConfig>
</object>
Style number 16: OUTPUT_LINK.

Embed a menu that is defined in XML.


<div>
<object xmlns="http://www.cmobilecom.com/af/objects" 
  id="menu1" type="menu">
  <urlBase>/userGuide</urlBase>
  <menuXml>URL</menuXml>
</object>
</div>
The menu URL can refer to an XML file on internet. For example,
	http://domain/path/menu.xml
or it can be a locale file. For example,
	file:///#{website.home}/path/menu.xml.
The #{website.home} will be resolved to the website home directory.

The menu XML obtained from a URL is a menu item tree. The urlBase is the base url for menu items with relative URLs. For example,


<item name="Index" pathInfo="index.html">
	<item name="Example1" pathInfo="examples/example1.html" />
	<item name="Example2" >
		<item name="Example2-1" pathInfo="examples/example2-1.html" />
		<item name="Example2-2" pathInfo="examples/example2-2.html" />
	</item>
	<item name="Example3" pathInfo="http://www.cmobilecom.com" target="_blank" />
	<item name="Example4" pathInfo="/foo/bar.html" />
</item>
The menu xml can be inline under the object element.

<div>
<object xmlns="http://www.cmobilecom.com/af/objects" 
  id="menu2" type="menu">
  <urlBase>/userGuide</urlBase>
  <item name="Index" pathInfo="index.html">
    <item name="Example1" pathInfo="examples/example1.html" />
    <item name="Example2" >
      <item name="Example2-1" pathInfo="examples/example2-1.html" />
      <item name="Example2-2" pathInfo="examples/example2-2.html" />
    </item>
    <item name="Example3" pathInfo="http://www.cmobilecom.com" target="_blank" />
    <item name="Example4" pathInfo="/foo/bar.html" />
  </item>
</object>
</div>
A menu item can have child menu items. The urlBase is used to translate the relative pathInfo into URL. For the example above, the urlBase will be added as following when a menu is created from the xml file.

<item name="Index" url="/userGuide/index.html">
	<item name="Example1" url="/userGuide/examples/example1.html" />
	<item name="Example2" >
		<item name="Example2-1" url="/userGuide/examples/example2-1.html" />
		<item name="Example2-2" url="/userGuide/examples/example2-2.html" />
	</item>
	<item name="Example3" url="http://www.cmobilecom.com" target="_blank" />
	<item name="Example3" url="/foo/bar.html" />
</item>