// Syntaxes and Information: *** START EDITING HERE, READ THIS SECTION CAREFULLY! ***
//
// To customise use this script, there are 3 functions you need to use. Firstly, you create
// ItemStyles, which are a collection of dimensions, colours, and stylesheet class names used
// to control the appearance of menu items. The syntax is:
//
// styleName = new ItemStyle(length of items, spacing to next item, 'popout indicator HTML',
// popout indicator position, padding of text within item, 'out colour', 'over colour',
// 'out text stylesheet class', 'over text class', 'border stylesheet class');
//
// The only thing that needs explaining is the popout indicator position -- you pass a positive
// integer to position it from the left of the item, and a negative integer to position it from
// the right edge of the item -- see the example code below if that doesn't make much sense.
// ItemStyles are simply JavaScript objects (like 'window' and 'document'), and you can access
// or change any property with JS e.g. hBar.outClass = 'anotherTextClass'. See the
// construction function halfway through the menu code above for property names if you want to
// get tricky with these -- or just use them normally like so:

var styleSide = new ItemStyle(26, 0, '<img src=\'/images/main_banner_arrow.gif\' width=4 height=7>',
 120, 5, '#ffdead', '#ffdead', 'menuSideText', 'menuSideTextOver', '');

var styleSideItem = new ItemStyle(22, 0, '<img src=\'/images/main_banner_arrow.gif\' width=4 height=7>',
 -20, 3, '#ffffff', '#ffffff', 'menuSideText', 'menuSideTextOver', 'menuSideBorder');


// The main menu section begins with the creation of a 'new PopupMenu(...)' object, which
// includes the main creation and update functions -- this example just has one object created.
// Next, we use its startMenu() function to create the individual menus used by the script.
// They are added with the orientation, position, dimension, and default ItemStyle to use passed
// to them. The Left and Top positions are measured from the upper-left corner of its trigger
// item used to pop it out on the fly, or from the top-left corner of the page for the first
// 'root' menu. The first menu must always be named 'root', by the way, so it's always visible.
//
// startMenu('menu name', Vertical menu? (true/false), left, top, width, default ItemStyle);
//
// Finally, items themselves are passed 3 compulsory parameters -- the text, and action/URL,
// and the type of the action/target frame. All other parameters are optional -- you can override
// the menu's default ItemStyle with the item's own, and optionally override that was well with
// its own dimensions/popout indicator etc. See the example below, this is illustrated there.
//
// addItem('Text', 'URL', 'action type', optional ItemStyle, length, spacing to next item,
//  'popout indicator HTML', popout indicator position);
//
// Something that needs explaining - the Vertical Menu setup, a 'true' or 'false' without
// quotes passed as the second parameter to startMenu(). You can see most of the menus below
// are 'true', that is they are vertical, except for the first root menu. The 'length' and
// 'width' of an item depends on its orientation -- length is how long the item runs for in
// the direction of the menu, and width is the lateral dimension of the menu. Just look at
// the examples and tweak the numbers, they'll make sense eventually :).
//
// Something else - the 'action type'. This tells the script what to do with the URL. You
// leave this a blank string '' to open the URL in the current window -- the default action.
// Secondly, set this to 'js:' to specify that the URL is a JavaScript function that gets
// executed when the item is clicked. Thirdly, you can pass a string containing a valid
// reference to a window/frame, e.g. 'top.leftFrame' or 'parent.popupWin', to make the URL
// load in that frame or window when clicked -- 'parent.main' is similar to <a target="main">.
//    Most importantly, you pass 'sm:' to specify that the URL is the name of a submenu to pop
// out when moused over. See the example below if this seems complicated, it's quite easy once
// you get the hang of it. Thanks to Martin J. Cole for originally suggesting the syntax!


// A PopupMenu() object must be passed its own name so it can reference itself when the menu
// is active. We also use a 'with' block to work with its properties and functions below.
var pSideMenu = new PopupMenu('pSideMenu');
with (pSideMenu)
{

// The 'root' menu from which everything else arises and is positioned.
// The 'root' menu is horizontal, positioned at (x = 0, y = 150) and is 140px width, and items
// by default use the colours and dimensions in the 'styleSide' ItemStyle defined above.
// *** MOVE OR CENTRE THE MENU HERE ***
// To centre it, replace the X value with a formula using a global variable defined by this script
// like winWidth, e.g: startMenu('root', false, 'winWidth/2 - 120', 0, 17, hBar);

startMenu('root', true, 0, 150, 140, styleSide);
// The text is 'Home', and this item pops out the 'mAbout' submenu when moused over as
// we've set 'sm:' as the action type.
addItem('Home', 		'mAbout', 'sm:');
addItem('Tolerance', '/model/democracy/tole.html', '');
addItem('Critical Thinking and Decision Making', '/model/democracy/crit.html', '', styleSide, 3*16 + 10);
addItem('Thinking Together and Making Meaning', '/model/democracy/thin.html', '', styleSide, 3*16 + 10);
addItem('Power Sharing and Empowerment', '/model/democracy/empo.html', '', styleSide, 2*16 + 10);
addItem('Individual Responsibility and Civil Involvement with Others ', '/model/democracy/indi.html', '', styleSide, 4*16 + 10);

startMenu('mAbout', true, 135, 0, 170, styleSideItem);
addItem('Overview',			'/about/overview.html', '');
addItem('History',				'/about/history.html', '');
addItem('Project goals',		'/about/goals.html', '');
addItem('Timeline / Schedule',	'/about/timeline.html', '');
addItem('Progress reports',		'/about/currprog.html', '');
addItem('Course revision reports',	'/about/currrev.html', '');
addItem('Online video case studies', '/ovcs/', '');
addItem('Individual Responsibility and Civil Involvement with Others ', '/model/democracy/indi.html', '', styleSideItem, 3*16 + 6);


// End of 'with (menu Object)' block. That's it!
}


// Here, we overwrite the onLoad and onResize events, calling the proper functions for each menu (or other
// script, e.g. DHTML Scroller) that needs to be notified of these events, e.g.:
// window.onevent = new Function('pMenu.update(); anotherMenu.update(); otherFunction(); .....');
// pMenu is the main menu defined in main_banner.js. Please don't erase it from here...
// Note we also call a small 'bug check' function to stop Netscape 4 dying when you resize the window.

window.onload = new Function('pMenu.update(); pSideMenu.update(); preloadImages();');
window.onresize = new Function('ns4BugCheck(); pMenu.position(); pSideMenu.position();');
