// Title:GRandall Web Design SideBar Menu
// Description: JavaScript DOM expanding menu
// URL: http://www.grandallwebdesign.com/
// Version: 1.02 (commented source)
// Date: 06-14-2005
// Contact: grandall@grandallwebdesign.net
// Tech. Support: http://www.grandallwebdesign.com/

// -----------------DO NOT EDIT THIS SECTION
// global collection containing all menus on current page

var A_MENUS = [];

// --------------------------------------------------------------------------------
// menu class

function menu (a_items, a_tpl) 
{	

// browser check	
if (!document.body || !document.body.style)		
	return;	

// store items structure	
this.a_config = a_items;	

// store template structure
this.a_tpl = a_tpl;

// get menu id	
this.n_id = A_MENUS.length;	

// declare collections	
this.a_index = [];
this.a_children = [];	

// asign methods and event handlers
this.expand      = menu_expand;	
this.collapse    = menu_collapse;
this.onclick     = menu_onclick;
this.onmouseout  = menu_onmouseout;
this.onmouseover = menu_onmouseover;
this.onmousedown = menu_onmousedown;

// default level scope description structure
this.a_tpl_def = 
{
	'block_top' : 16,
	'block_left' : 16,
	'top' : 20,
	'left' : 4,
	'width' : 120,
	'height' : 22,
	'hide_delay' : 0,
	'expd_delay' : 0,
	'css' : 
	{
		'inner' : '',
		'outer' : ''
	}
};

// assign methods and properties required to imulate parent item
this.getprop = function (s_key) 
{
	return this.a_tpl_def[s_key];
};
this.o_root = this;
this.n_depth = -1;
this.n_x = 0;
this.n_y = 0;

// init items recursively
for (n_order = 0; n_order < a_items.length; n_order++)
new menu_item(this, n_order);

// register self in global collection
A_MENUS[this.n_id] = this;

// make root level visible
for (var n_order = 0; n_order < this.a_children.length; n_order++)
this.a_children[n_order].e_oelement.style.visibility = 'visible';
}

// --------------------------------------------------------------------------------
function menu_collapse (n_id)
 {

// cancel item open delay
clearTimeout(this.o_showtimer);

// by default collapse to root level
var n_tolevel = (n_id ? this.a_index[n_id].n_depth : 0);

// hide all items over the level specified
	for (n_id = 0; n_id < this.a_index.length; n_id++) 
	{
		var o_curritem = this.a_index[n_id];
		if (o_curritem.n_depth > n_tolevel && o_curritem.b_visible) 
		{
			o_curritem.e_oelement.style.visibility = 'hidden';
			o_curritem.b_visible = false;
		}
	}

// reset current item if mouse has gone out of items
	if (!n_id)
	this.o_current = null;
}

// --------------------------------------------------------------------------------
function menu_expand (n_id) 
{

// expand only when mouse is over some menu item
if (this.o_hidetimer)
return;

// lookup current item
var o_item = this.a_index[n_id];

// close previously opened items
if (this.o_current && this.o_current.n_depth >= o_item.n_depth)
this.collapse(o_item.n_id);
this.o_current = o_item;

// exit if there are no children to open
if (!o_item.a_children)
return;

// show direct child items
	for (var n_order = 0; n_order < o_item.a_children.length; n_order++) 
	{
	var o_curritem = o_item.a_children[n_order];
	o_curritem.e_oelement.style.visibility = 'visible';
	o_curritem.b_visible = true;
	}
}


// --------------------------------------------------------------------------------

// --------------------------------------------------------------------------------
function menu_onclick (n_id) 
{
// don't go anywhere if item has no link defined
return Boolean(this.a_index[n_id].a_config[1]);
}

// --------------------------------------------------------------------------------
function menu_onmouseout (n_id) 
{
// lookup new item's object
var o_item = this.a_index[n_id];

// apply rollout
o_item.e_oelement.className = o_item.getstyle(0, 0);
o_item.e_ielement.className = o_item.getstyle(1, 0);

// update status line
o_item.upstatus(7);

// run mouseover timer
this.o_hidetimer = setTimeout('A_MENUS['+ this.n_id +'].collapse();',
o_item.getprop('hide_delay'));
}

// --------------------------------------------------------------------------------
function menu_onmouseover (n_id) 
{
// cancel mouseoute menu close and item open delay
clearTimeout(this.o_hidetimer);
this.o_hidetimer = null;
clearTimeout(this.o_showtimer);

// lookup new item's object
var o_item = this.a_index[n_id];

// update status line
o_item.upstatus();

// apply rollover
o_item.e_oelement.className = o_item.getstyle(0, 1);
o_item.e_ielement.className = o_item.getstyle(1, 1);

// if onclick open is set then no more actions required
if (o_item.getprop('expd_delay') < 0)	
return;
// run expand timer
this.o_showtimer = setTimeout('A_MENUS['+ this.n_id +'].expand(' + n_id + ');',
o_item.getprop('expd_delay'));
}

// --------------------------------------------------------------------------------
// called when mouse button is pressed on menu item
// --------------------------------------------------------------------------------
function menu_onmousedown (n_id) 
{
// lookup new item's object
var o_item = this.a_index[n_id];

// apply mouse down style
o_item.e_oelement.className = o_item.getstyle(0, 2);
o_item.e_ielement.className = o_item.getstyle(1, 2);
this.expand(n_id);
//this.items[id].switch_style('onmousedown');
}

// --------------------------------------------------------------------------------
// menu item Class
function menu_item (o_parent, n_order) 
{

// store parameters passed to the constructor
this.n_depth  = o_parent.n_depth + 1;
this.a_config = o_parent.a_config[n_order + (this.n_depth ? 3 : 0)];

// return if required parameters are missing
if (!this.a_config) return;

// store info from parent item
this.o_root    = o_parent.o_root;
this.o_parent  = o_parent;
this.n_order   = n_order;

// register in global and parent's collections
this.n_id = this.o_root.a_index.length;
this.o_root.a_index[this.n_id] = this;
o_parent.a_children[n_order] = this;

// calculate item's coordinates
var o_root = this.o_root,
a_tpl  = this.o_root.a_tpl;

// assign methods
this.getprop  = mitem_getprop;
this.getstyle = mitem_getstyle;
this.upstatus = mitem_upstatus;
this.n_x = n_order
? o_parent.a_children[n_order - 1].n_x + this.getprop('left'): o_parent.n_x + this.getprop('block_left');
this.n_y = n_order
? o_parent.a_children[n_order - 1].n_y + this.getprop('top'): o_parent.n_y + this.getprop('block_top');

// generate item's HMTL	
document.write ('<a id="e' + o_root.n_id + '_'+ this.n_id +'o" class="' + this.getstyle(0, 0) + '" href="' + this.a_config[1] + '"'+ (this.a_config[2] && this.a_config[2]['tw'] ? ' target="'+ this.a_config[2]['tw'] + '"' : '') + ' style="position: absolute; top: '+ this.n_y + 'px; left: ' + this.n_x + 'px; width: '+ this.getprop('width') + 'px; height: '+ this.getprop('height') + 'px; visibility: hidden;'+' z-index: ' + this.n_depth + ';" '+ 'onclick="return A_MENUS[' + o_root.n_id + '].onclick('+ this.n_id + ');" onmouseout="A_MENUS[' + o_root.n_id + '].onmouseout('+ this.n_id + ');" onmouseover="A_MENUS[' + o_root.n_id + '].onmouseover('+ this.n_id + ');" onmousedown="A_MENUS[' + o_root.n_id + '].onmousedown('+ this.n_id + ');"><div  id="e' + o_root.n_id + '_'+ this.n_id +'i" class="' + this.getstyle(1, 0) + '">'+ this.a_config[0] + "</div></a>\n");	
this.e_ielement = document.getElementById('e' + o_root.n_id + '_' + this.n_id + 'i');
this.e_oelement = document.getElementById('e' + o_root.n_id + '_' + this.n_id + 'o');
this.b_visible = !this.n_depth;

// no more initialization if leaf
if (this.a_config.length < 4)
	return;

// node specific methods and properties
this.a_children = [];

// init downline recursively
for (var n_order = 0; n_order < this.a_config.length - 3; n_order++)
new menu_item(this, n_order);
}

// --------------------------------------------------------------------------------
// reads property from template file, inherits from parent level if not found
// ------------------------------------------------------------------------------------------
function mitem_getprop (s_key) 
{

// check if value is defined for current level
var s_value = null,
a_level = this.o_root.a_tpl[this.n_depth];

// return value if explicitly defined
if (a_level)
s_value = a_level[s_key];
// request recursively from parent levels if not defined
return (s_value == null ? this.o_parent.getprop(s_key) : s_value);
}

// --------------------------------------------------------------------------------
// reads property from template file, inherits from parent level if not found
// ------------------------------------------------------------------------------------------
function mitem_getstyle (n_pos, n_state) 
{
var a_css = this.getprop('css');
var a_oclass = a_css[n_pos ? 'inner' : 'outer'];

// same class for all states
if (typeof(a_oclass) == 'string')
return a_oclass;

// inherit class from previous state if not explicitly defined
for (var n_currst = n_state; n_currst >= 0; n_currst--)
if (a_oclass[n_currst])
return a_oclass[n_currst];
}

// ------------------------------------------------------------------------------------------
// updates status bar message of the browser

// ------------------------------------------------------------------------------------------
function mitem_upstatus (b_clear) 
{
window.setTimeout("window.status=unescape('" + (b_clear? '': (this.a_config[2] && this.a_config[2]['sb']? escape(this.a_config[2]['sb']): escape(this.a_config[0]) + (this.a_config[1]? ' ('+ escape(this.a_config[1]) + ')': ''))) + "')", 10);
}
// --------------------------------------------------------------------------------

//**********************************************************************************************
//**********************************************************************************************
//************** FOLLOWING SCRIPT CAN AND SHOULD BE EDITED **************
// ************* START MENU POSITION SCRIPT ****************************************
// ************* EDIT THIS PART TO CHANGE POSITION *******************************
if (screen.width <= 800)
var MENU_POS = [
		
{
	// Top Level Vertical Offset between adjacent levels in pixels 33
	// This controls initial position from top left corner of page
		'block_top'  : 140,
		// Horizontal Offset between adjacent levels in pixels
		'block_left' : 4,
	
		'top': 23,
		'left': 0,
		// Item's width in pixels
		'width'      : 130,
		// Item's height in pixels
		'height'     : 18,
		// Time Delay in milliseconds before subling block expands  
		// after mouse pointer overs an item
		'expd_delay' : 100,
		'hide_delay' : 100,
		'css' : {
			'inner' : ['m0l0mouti_800', 'm0l0moveri_800', 'm0l0mdowni_800'],
			'outer' : ['m0l0mouto', 'm0l0movero', 'm0l0mdowno']
		}
},

{
	// Second Level Vertical Offset between adjacent levels in pixels
	// This controls buttons relative to Parent Element above
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 125,
	
	'top': 20,
	'left': 0,
	// Item's width in pixels
	'width'      : 130,
	'css' : {
		'inner' : ['m0l1mouti_800', 'm0l1moveri_800', 'm0l1mdowni_800'],
		'outer' : ['m0l1mouto', 'm0l1movero', 'm0l1mdowno']
	}
},
{
	// Third Level Buttons Vertical Offset between adjacent levels in pixels
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 130,
	
	// Item's width in pixels
	'width'      : 156,
	'css' : {
		'inner' : ['m0l2mouti_800', 'm0l2moveri_800', 'm0l2mdowni_800'],
		'outer' : ['m0l2mouto', 'm0l2movero', 'm0l2mdowno']
	}

}
];

else if (screen.width == 1024)
var MENU_POS = [
		
{
	// Top Level Vertical Offset between adjacent levels in pixels 33
	// This controls initial position from top left corner of page
		'block_top'  : 150,
		// Horizontal Offset between adjacent levels in pixels
		'block_left' : 25,
	
		'top': 26,
		'left': 0,
		// Item's width in pixels
		'width'      : 149,
		// Item's height in pixels
		'height'     : 21,
		// Time Delay in milliseconds before subling block expands  
		// after mouse pointer overs an item
		'expd_delay' : 100,
		'hide_delay' : 100,
		'css' : {
			'inner' : ['m0l0mouti', 'm0l0moveri', 'm0l0mdowni'],
			'outer' : ['m0l0mouto', 'm0l0movero', 'm0l0mdowno']
		}
},

{
	// Second Level Vertical Offset between adjacent levels in pixels
	// This controls buttons relative to Parent Element above
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 140,
	
	'top': 20,
	'left': 0,
	// Item's width in pixels
	'width'      : 141,
	'css' : {
		'inner' : ['m0l1mouti', 'm0l1moveri', 'm0l1mdowni'],
		'outer' : ['m0l1mouto', 'm0l1movero', 'm0l1mdowno']
	}
},
{
	// Third Level Buttons Vertical Offset between adjacent levels in pixels
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 130,
	
	// Item's width in pixels
	'width'      : 156,
	'css' : {
		'inner' : ['m0l2mouti', 'm0l2moveri', 'm0l2mdowni'],
		'outer' : ['m0l2mouto', 'm0l2movero', 'm0l2mdowno']
	}
}	
];

else if (screen.width >= 1280)
var MENU_POS = [
		
{
	// Top Level Vertical Offset between adjacent levels in pixels 33
	// This controls initial position from top left corner of page
		'block_top'  : 150,
		// Horizontal Offset between adjacent levels in pixels
		'block_left' : 126,
	
		'top': 33,
		'left': 0,
		// Item's width in pixels
		'width'      : 175,
		// Item's height in pixels
		'height'     : 26,
		// Time Delay in milliseconds before subling block expands  
		// after mouse pointer overs an item
		'expd_delay' : 100,
		'hide_delay' : 100,
		'css' : {
			'inner' : ['m0l0mouti_1200', 'm0l0moveri_1200', 'm0l0mdowni_1200'],
			'outer' : ['m0l0mouto', 'm0l0movero', 'm0l0mdowno']
		}
},

{
	// Second Level Vertical Offset between adjacent levels in pixels
	// This controls buttons relative to Parent Element above
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 170,
	
	'top': 26,
	'left': 0,
	// Item's width in pixels
	'width'      : 200,
	'css' : {
		'inner' : ['m0l1mouti_1200', 'm0l1moveri_1200', 'm0l1mdowni_1200'],
		'outer' : ['m0l1mouto', 'm0l1movero', 'm0l1mdowno']
	}
},
{
	// Third Level Buttons Vertical Offset between adjacent levels in pixels
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 130,
	
	// Item's width in pixels
	'width'      : 156,
	'css' : {
		'inner' : ['m0l2mouti_1200', 'm0l2moveri_1200', 'm0l2mdowni_1200'],
		'outer' : ['m0l2mouto', 'm0l2movero', 'm0l2mdowno']
	}
}
];

else
var MENU_POS = [
		
{
	// Top Level Vertical Offset between adjacent levels in pixels 33
	// This controls initial position from top left corner of page
		'block_top'  : 150,
		// Horizontal Offset between adjacent levels in pixels
		'block_left' : 28,
	
		'top': 26,
		'left': 0,
		// Item's width in pixels
		'width'      : 149,
		// Item's height in pixels
		'height'     : 21,
		// Time Delay in milliseconds before subling block expands  
		// after mouse pointer overs an item
		'expd_delay' : 100,
		'hide_delay' : 100,
		'css' : {
			'inner' : ['m0l0mouti', 'm0l0moveri', 'm0l0mdowni'],
			'outer' : ['m0l0mouto', 'm0l0movero', 'm0l0mdowno']
		}
},

{
	// Second Level Vertical Offset between adjacent levels in pixels
	// This controls buttons relative to Parent Element above
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 140,
	
	'top': 20,
	'left': 0,
	// Item's width in pixels
	'width'      : 141,
	'css' : {
		'inner' : ['m0l1mouti', 'm0l1moveri', 'm0l1mdowni'],
		'outer' : ['m0l1mouto', 'm0l1movero', 'm0l1mdowno']
	}
},
{
	// Third Level Buttons Vertical Offset between adjacent levels in pixels
	'block_top'  : 4,
	// Horizontal Offset between adjacent levels in pixels
	'block_left' : 130,
	
	// Item's width in pixels
	'width'      : 156,
	'css' : {
		'inner' : ['m0l2mouti', 'm0l2moveri', 'm0l2mdowni'],
		'outer' : ['m0l2mouto', 'm0l2movero', 'm0l2mdowno']
	}
}	
];

// **********************************END POSITION SCRIPT *****************************
// ********************************************************************************************

// **********************************START MENU ITEMS ********************************
// **********************************EDIT THIS PART FOR LINK NAMES ***************


/* --- menu items --- */
var MENU_ITEMS = [
		
	['Portfolio Home','../portfolio.html'],

	['Graphic Design Home','index.html'],

	['Print Media & Ads',null,null,
	['Otero Junior College','ojc.html'],
	['Autumn Road','autumn.html'],
	['Awards Banquet','ca66flyer.html'],
	['American Road Ad','amerroad.html']],

	['Commercial Banners',null,null,
	['Desert Sno Ball','desert.html']],

	['Custom Logos',null,null,
	['Glen Canyon Rentals','gcrentals.html'],
	['Route 66 Caravan','rt66caravan.html'],
	['Historic Roads','phroads.html']],

	['Animated Web Logos',null,null,
	['Lake Powell Boating','lpboating.html'],
	['G Force Amusements','gforce.html'],
	['CART66PF','cart66pf.html']],

	['Custom Web Headers',null,null,
	['La Junta Economic Dev','ljeco.html'],
	['DK Sports Products','dksports.html'],
	['Cool Springs','coolspgs.html'],
	['Arkansas Valley','arkvalley.html'],
	['Munger Moss Motel','munger.html'],
	['St Davids Church','stdavids.html']],


	['Navigation Buttons','buttons.html'],

	['Custom Web Layouts',null,null,
	['G Force Amusements','gforce02.html'],
	['RT 66 Preservation','rt66pres.html'],
	['Road Runner','roadrun.html']],

	['Flash Animations',null,null,
	['Otero Junior College','ojcflash.html'],
	['Springtime','spring.html'],
	['Sports Summer Camp','summer.html'],
	['Flight of the Bumble Bee','bee.html'],
	['Colorful Colorado','colorful.html'],
	['Postcards','post.html']],

	['Photography',null,null,
	['Kit Carson Hotel','carson.html'],
	['Onion Creek','onion.html'],
	['Route 66 People','66people.html'],
	['Fast Fanny','fanny.html']],

	['Just For Fun',null,null,
	['Oatie','oatie.html'],
	['Alien Abduction','alien.html']],
];