<html>
<head>
<title>Dojo Menu/MenuBar Programatic Test</title>
<script type="text/javascript">
var djConfig = { //parseWidgets: false,// appears to make no difference, alas
isDebug: true
};
</script>
<script language="JavaScript" src="../../dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.widget.Menu2");
dojo.hostenv.writeIncludes();
</script>
<script>
// Create a menu bar w/sub menus by simple static calls
function bar(){
var menubar = dojo.widget.createWidget("MenuBar2", {id: "mbar"});
document.body.appendChild(menubar.domNode);
var menu1 = dojo.widget.createWidget("PopupMenu2", {id: "menu1"});
menu1.addChild(dojo.widget.createWidget("MenuItem2", {caption: "MENU 1"}));
var menu2 = dojo.widget.createWidget("PopupMenu2", {id: "menu2"});
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Page Info"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Set Permissions"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "List All Pages"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "List My Pages"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "List Recent Changes"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "List Recent Comments"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Save Page"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Save {{NoWiki}}Space{{/NoWiki}}"}));
menu2.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Load {{NoWiki}}Space{{/NoWiki}}"}));
var menu3 = dojo.widget.createWidget("PopupMenu2", {id: "menu3"});
menu3.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Edit Page"}));
menu3.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Copy Page"}));
menu3.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Rename Page"}));
menu3.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Delete Page"}));
var menu4 = dojo.widget.createWidget("PopupMenu2", {id: "menu4"});
menu4.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Show All Notes"}));
menu4.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Hide All Notes"}));
menu4.addChild(dojo.widget.createWidget("MenuSeparator2"));
menu4.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Lists"}));
menu4.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Commands"}));
menu4.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Bookmarks"}));
var menu5 = dojo.widget.createWidget("PopupMenu2", {id: "menu5"});
menu5.addChild(dojo.widget.createWidget("MenuItem2", {caption: "DojoTest"}));
menu5.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Home Page"}));
menu5.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Yadda Yadda"}));
var menu6 = dojo.widget.createWidget("PopupMenu2", {id: "menu6"});
menu6.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Change Settings"}));
menu6.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Logout"}));
menu6.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Manage Users"}));
menu6.addChild(dojo.widget.createWidget("MenuItem2", {caption: "Refresh QED Palette"}));
var menu7 = dojo.widget.createWidget("PopupMenu2", {id: "menu7"});
menu7.addChild(dojo.widget.createWidget("MenuItem2", {caption: "About"}));
menu7.addChild(dojo.widget.createWidget("MenuItem2", {caption: "User Manual"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "Help", submenuId: "menu7"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "User", submenuId: "menu6"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "History", submenuId: "menu5"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "View", submenuId: "menu4"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "Edit", submenuId: "menu3"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "Page", submenuId: "menu2"}));
menubar.addChild(dojo.widget.createWidget("MenuBarItem2", {caption: "Home", submenuId: "menu1"}));
}
// This is a JSON structure representing a menu
var myMenu =
[
{
caption: "File",
submenu:
[
{
caption: "Save",
iconSrc: "images/tools.gif"
},
{
caption: "Recent",
iconSrc: "images/plus.gif",
submenu:
[
{ caption: "foo.txt", iconSrc: "images/graph.gif", onClick: function(){ alert("opening foo"); } },
{ caption: "bar.txt", iconSrc: "images/check.gif", onClick: function(){ alert("opening bar"); } },
{ caption: "doh.txt", iconSrc: "images/graph.gif", onClick: function(){ alert("opening doh"); } }
]
}
]
},
{
caption: "Edit",
submenu:
[
{ caption: "Cut", accelKey: "Ctrl+X", iconSrc: "../../src/widget/templates/buttons/cut.gif" },
{ caption: "Copy", accelKey: "Ctrl+P", iconSrc: "../../src/widget/templates/buttons/copy.gif" },
{ caption: "Paste", accelKey: "Ctrl+V", iconSrc: "../../src/widget/templates/buttons/paste.gif" }
]
},
{
caption: "Help",
onClick: function(){ alert("Help me!"); }
}
];
function makeMenu(items, isTop){
var menu2 = dojo.widget.createWidget("PopupMenu2", {contextMenuForWindow: isTop});
dojo.lang.forEach(items, function(itemJson){
// if submenu is specified, create the submenu and then make submenuId point to it
if(itemJson.submenu){
var submenu = makeMenu(itemJson.submenu, false);
itemJson.submenuId = submenu.widgetId;
}
var item = dojo.widget.createWidget("MenuItem2", itemJson);
menu2.addChild(item);
});
return menu2;
}
// Make a popup menu
function menu(){
makeMenu(myMenu, true);
dojo.debug("Menu created, right-click to see it (ctrl-click on opera)");
}
</script>
</head>
<body>
<h1>Test of programatic creation of menu and menubar</h1>
<button onClick="bar();">Create menu bar</button>
<button onClick="menu();">Create context menu</button>
</body>
</html>