//FIXME: is there a way to check if it has already been done?
var nav_images = $A(['menu-about.png', 'menu-about-sel.png', 'menu-contact.png', 'menu-contact-sel.png',
					'menu-portfolio.png', 'menu-portfolio-sel.png', 'menu-products.png', 'menu-products-sel.png',
					'submenu-about-company.png', 'submenu-about-company-sel.png', 'submenu-about-fossils.png',
					'submenu-about-fossils-sel.png', 'submenu-about-laboratory.png', 'submenu-about-laboratory-sel.png',
					'submenu-about-quarry.png', 'submenu-about-quarry-sel.png', 'submenu-products-murals.png',
					'submenu-products-murals-sel.png', 'submenu-products-tables.png', 'submenu-products-tables-sel.png',
					'submenu-products-kitchen-bath.png', 'submenu-products-kitchen-bath-sel.png',
					'submenu-products-tile-selection.png', 'submenu-products-tile-selection-sel.png',
					'submenu-portfolio-residential.png', 'submenu-portfolio-residential-sel.png',
					'submenu-portfolio-commercial.png', 'submenu-portfolio-commercial-sel.png',
					'submenu-portfolio-custom.png', 'submenu-portfolio-custom-sel.png']);
var local_nav_images = $A([	'products/kitchen-bath/menu-countertops.png', 'products/kitchen-bath/menu-countertops-sel.png',
					'products/kitchen-bath/menu-vanity-tops.png', 'products/kitchen-bath/menu-vanity-tops-sel.png',
					'products/kitchen-bath/menu-backsplashes.png', 'products/kitchen-bath/menu-backsplashes-sel.png',
					'products/murals/menu-accent.png', 'products/murals/menu-accent-sel.png',
					'products/murals/menu-collector.png', 'products/murals/menu-collector-sel.png',
					'products/murals/menu-gallery.png', 'products/murals/menu-gallery-sel.png']);
//nav_images.each(cache_image_prepend);
nav_images.each(cache_image_prepend_str.bind(window, G_BASE_DIR + '/res/images/menu/'));
local_nav_images.each(cache_image_prepend);

//var G_LOCAL_NAV_SEL = '';
//var G_LOCAL_NAV_OUT_OBS = false;
//var G_NAV_OUT_OBS = false;

function jacNavBase()
{
	this._exit_timeout_id = null;
	this._change_timeout_id = null;
}
jacNavBase.prototype = new Object();
jacNavBase.prototype.constructor = jacNavBase;
jacNavBase.prototype._exit_timeout_id;
jacNavBase.prototype._change_timeout_id;

jacNavBase.prototype.start_exit_timer =
	function(bound_func)
	{
		this._exit_timeout_id = window.setTimeout(bound_func, 750);
	};

jacNavBase.prototype.clear_exit_timer =
	function()
	{
		if(this._exit_timeout_id != null)
		{
			window.clearTimeout(this._exit_timeout_id);
			this._exit_timeout_id = null;
		}
	};

jacNavBase.prototype.start_change_timer =
	function(bound_func)
	{
		this._change_timeout_id = window.setTimeout(bound_func, 150);
	};

jacNavBase.prototype.clear_change_timer =
	function()
	{
		if(this._change_timeout_id != null)
		{
			window.clearTimeout(this._change_timeout_id);
			this._change_timeout_id = null;
		}
	};

jacNavBase.prototype.mouseover =
	function(e)
	{
	
	};

function jacNav(image_base_dir, nav_id, local_nav_id)
{
	jacNavBase.call(this);
	this._image_base_dir = image_base_dir;
	this._bound_funcs_over = new Hash({nav: new Array(), subnav: new Array()});
	this._bound_funcs_out = new Hash({nav: new Array(), subnav: new Array()});
	this._bound_funcs_click = new Hash({nav: new Array(), subnav: new Array()});
	this._observed_elems = new Hash({nav: new Array(), subnav: new Array()});
	this._observing = false;

	this._cur_nav = '';
	this._cur_subnav = '';
	this._orig_nav = '';
	this._orig_subnav = '';

	this._nav_out_observed = false;
	this._local_out_observed = false;
	this._nav_id = nav_id;
	this._local_nav_id = local_nav_id;
	
	this._cached_menus = new Hash();
	this._cached_local_menus = new Hash();
}
jacNav.prototype = new jacNavBase;
jacNav.prototype._image_base_dir;
jacNav.prototype._bound_funcs_over;
jacNav.prototype._bound_funcs_out;
jacNav.prototype._bound_funcs_click;
jacNav.prototype._observed_elems;
jacNav.prototype._observing;

jacNav.prototype._cur_nav;
jacNav.prototype._cur_subnav;
jacNav.prototype._orig_nav;
jacNav.prototype._orig_subnav;

jacNav.prototype._nav_out_observed;
jacNav.prototype._local_out_observed;
jacNav.prototype._nav_id;
jacNav.prototype._local_nav_id;

jacNav.prototype._cached_menus;
jacNav.prototype._cached_local_menus;

jacNav.prototype.set_original_menus =
	function(which_nav, which_subnav)
	{
		this._cur_nav = which_nav;
		this._orig_nav = which_nav;
		this._cur_subnav = which_subnav;
		this._orig_subnav = which_subnav;
	};

jacNav.prototype.observe =
	function(nav_elem_ids, subnav_elem_ids)
	{
		if(!this._nav_out_observed && $(this._nav_id) != null)
		{
			$(this._nav_id).observe('mouseout', this.nav_mouseout.bind(this));
			this._nav_out_observed = true;
		}
		if(!this._local_out_observed && $(this._local_nav_id) != null)
		{
			$(this._local_nav_id).observe('mouseout', this.nav_mouseout.bind(this));
			this._local_out_observed = true;
		}

		if(this._observing)
			return;

		var nav_ids = $A(nav_elem_ids);
		var subnav_ids = $A(subnav_elem_ids);
		var func = null;

		var bound_funcs_over = new Array();
		var bound_funcs_click = new Array();
		var observed_elems = new Array();

		nav_ids.each(
			function(nav_elem_id)
			{
				var nav_elem = $(nav_elem_id);

				func = this.nav_mouseover.bind(this);
				nav_elem.observe('mouseover', func);
				bound_funcs_over.push(func);

				func = this.nav_click.bind(this);
				nav_elem.observe('click', func);
				bound_funcs_click.push(func);
				observed_elems.push(nav_elem);
			}, this);
		this._bound_funcs_over.set('nav', bound_funcs_over);
		this._bound_funcs_click.set('nav', bound_funcs_click);
		this._observed_elems.set('nav', observed_elems);

		bound_funcs_over = new Array();
		var bound_funcs_out = new Array();
		bound_funcs_click = new Array();
		observed_elems = new Array();

		subnav_ids.each(
			function(subnav_elem_id)
			{
				var subnav_elem = $(subnav_elem_id);

				func = this.nav_mouseover.bind(this);
				subnav_elem.observe('mouseover', func);
				bound_funcs_over.push(func);

				func = this.nav_mouseout.bind(this);
				subnav_elem.observe('mouseout', func);
				bound_funcs_out.push(func);

				func = this.nav_click.bind(this);
				subnav_elem.observe('click', func);
				bound_funcs_out.push(func);

				observed_elems.push(subnav_elem);
			}, this);
		this._bound_funcs_over.set('subnav', bound_funcs_over);
		this._bound_funcs_out.set('subnav', bound_funcs_out);
		this._bound_funcs_click.set('subnav', bound_funcs_click);
		this._observed_elems.set('subnav', observed_elems);

		this._observing = true;
	};

jacNav.prototype.stopObserving =
	function()
	{
		if(!this._observing)
			return;

		var bound_funcs_over = this._bound_funcs_over.get('nav');
//		var bound_funcs_out = this._bound_funcs_out.get('nav');
		var bound_funcs_click = this._bound_funcs_click.get('nav');

		this._observed_elems.get('nav').each(
			function(elem, i)
			{
				elem.stopObserving('mouseover', bound_funcs_over[i]);
				elem.stopObserving('click', bound_funcs_click[i]);
			});
		this._bound_funcs_over.set('nav', new Array());
//		this._bound_funcs_out.set('nav', new Array());
		this._bound_funcs_click.set('nav', new Array());

		bound_funcs_over = this._bound_funcs_over.get('subnav');
		var bound_funcs_out = this._bound_funcs_out.get('subnav');
		bound_funcs_click = this._bound_funcs_click.get('subnav');

		this._observed_elems.get('subnav').each(
			function(elem, i)
			{
				elem.stopObserving('mouseover', bound_funcs_over[i]);
				elem.stopObserving('mouseout', bound_funcs_out[i]);
				elem.stopObserving('click', bound_funcs_click[i]);
			});
		this._bound_funcs_over.set('subnav', new Array());
		this._bound_funcs_out.set('subnav', new Array());
		this._bound_funcs_click.set('subnav', new Array());

		this._observing = false;
	};

jacNav.prototype.change_menus =
	function(new_nav, new_subnav, reset_local)
	{
		this.clear_change_timer();
		
		//nothing changed, do nothing
		if(this._cur_nav == new_nav && this._cur_subnav == new_subnav)
			return;

		var that = this;

		//subnav changed
		if(this._cur_nav == new_nav)
		{
			var new_subnav_img = G_BASE_DIR + this._image_base_dir + '/menu/submenu-' + this._cur_nav + '-' + this._cur_subnav + '.png';
			var elem = $('sub-nav-img-' + this._cur_subnav);
			if(elem)
				elem.writeAttribute({src: new_subnav_img});

			this._cur_subnav = new_subnav;
			new_subnav_img = G_BASE_DIR + this._image_base_dir + '/menu/submenu-' + this._cur_nav + '-' + this._cur_subnav + '-sel.png';
			elem = $('sub-nav-img-' + this._cur_subnav);
			if(elem)
				elem.writeAttribute({src: new_subnav_img});
		}
		//nav changed
		else
		{
//			alert(this._cur_subnav);
			this._cur_nav = new_nav;
			this._cur_subnav = new_subnav;
	
			//stop observing current nav menu to avoid any memory leaks when they are removed from the document
			this.stopObserving();
	
			var cached_menu = this._cached_menus.get(this.get_cache_menu_name(this._cur_nav, this._cur_subnav));
	
			if(cached_menu == undefined)
				new Ajax.Updater('navigation', G_BASE_DIR + '/menu-ajax.php', {method: 'get',
					parameters: {nav: this._cur_nav, subnav: this._cur_subnav}, evalScripts: true,
					onSuccess: function(transport) { that.cache_ajax_response(transport, that._cur_nav, that._cur_subnav); }
					});
			else
				$('navigation').update(cached_menu);
		}

		//now update the local nav to what it should be
		if(this._cur_subnav == 'kitchen-bath' || this._cur_subnav == 'murals')
		{
			//stop observing the current local nav
			G_LOCAL_NAV.stopObserving();
			G_LOCAL_NAV.reloading();
//			alert(G_LOCAL_NAV._orig_local_nav);

			//get the cache, use it if exists otherwise ajax it
			var cached_local = this._cached_local_menus.get(this._cur_subnav);
			if(cached_local == undefined)
				//var localnav_update =
				new Ajax.Updater('local-navigation', G_BASE_DIR + '/menu-ajax.php',
					{method: 'get',	evalScripts: true,
					onSuccess: function(transport) { that.cache_local_menu(transport, that._cur_subnav); },
					parameters: {local_nav: this._cur_subnav,
						local_nav_selected: reset_local == true ? G_LOCAL_NAV._orig_local_nav : ''}});
			else
				$('local-navigation').update(cached_local);
		}
		else
		{
			G_LOCAL_NAV.stopObserving();
			$('local-navigation').update();
		}
	};


jacNav.prototype.get_cache_menu_name =
	function(nav, subnav)
	{
		return nav + '-' + subnav;
	};
	
jacNav.prototype.cache_ajax_response =
	function cache_ajax_response(transport, which_nav, which_subnav)
	{
//		alert(which_nav + '-' + which_subnav);
		this.cache_menu(this.get_cache_menu_name(which_nav, which_subnav), transport.responseText);
	};

jacNav.prototype.cache_menu =
	function(menu_name, contents)
	{
		if(!this._cached_menus.get(menu_name))
		{
	//		alert('caching ' + menu_name + ' menu.');
			this._cached_menus.set(menu_name, contents == '' ? $('navigation').innerHTML : contents);
		}	
	};

jacNav.prototype.cache_local_menu =
	function(transport, local_menu_name)
	{
		if(this._cached_local_menus.get(local_menu_name) == undefined)
			this._cached_local_menus.set(local_menu_name, transport.responseText);
	};

jacNav.prototype.nav_mouseover =
	function(e)
	{
		G_LOCAL_NAV.clear_exit_timer();
		G_LOCAL_NAV.clear_change_timer();
		this.clear_exit_timer();
		this.clear_change_timer();

		var elem_id = e.element().id;
		var is_nav = elem_id.substring(0, 3) == 'nav';

		var new_nav = this._cur_nav;
		var new_subnav = this._cur_subnav;
		if(is_nav)
		{
			// 8 is the length of "nav-img-"
			elem_id = elem_id.substring(8);
//			if(elem_id == this._cur_nav)
//				return;
			new_nav = elem_id;
			new_subnav = '';
		}
		else
		{
			// 11 is the length of "sub-nav-img-"
			elem_id = elem_id.substring(12);
			// if it is the same, don't bother updating...only time it would matter is if there were a local menu
			if(elem_id == this._cur_subnav)
				return;
			new_subnav = elem_id;
		}

		this.start_change_timer(this.change_menus.bind(this, new_nav, new_subnav));

		//G_TIMEOUT_ID = window.setTimeout('reset_nav()', 2000);
	};
jacNav.prototype.subnav_mouseover =
	function(e)
	{
	
	};

jacNav.prototype.nav_mouseout =
	function(e)
	{
		G_LOCAL_NAV.clear_exit_timer();
		G_LOCAL_NAV.clear_change_timer();
		this.clear_exit_timer();
		this.clear_change_timer();
	
		var out_target = e.relatedTarget || e.toElement;
		var out_target_id = $(out_target) != null ? $(out_target).id : false;
		if(!out_target_id || out_target_id == 'header' || out_target_id == 'content-wrapper'
			|| out_target_id == 'sub-header' || out_target_id == 'content')
		{
			this.start_exit_timer(this.reset_nav.bind(this));
			e.stop();
		}
//		else
//			this._cur_subnav = '';
	};

jacNav.prototype.nav_click =
	function(e)
	{
		G_LOCAL_NAV.clear_exit_timer();
		G_LOCAL_NAV.clear_change_timer();
		this.clear_exit_timer();
		this.clear_change_timer();
	};

jacNav.prototype.reset_nav =
	function()
	{
		this.change_menus(this._orig_nav, this._orig_subnav, true);
	};

	
function jacLocalNav(image_base_dir)
{
	jacNavBase.call(this);
	this._image_base_dir = image_base_dir;
	this._bound_funcs_over = new Array();
	this._bound_funcs_out = new Array();
	this._observed_elems = new Array();
	this._observing = false;

	this._orig_local_nav = '';
	this._cur_sel = '';
}
jacLocalNav.prototype = new jacNavBase;
jacLocalNav.prototype._image_base_dir;
jacLocalNav.prototype._bound_funcs_over;
jacLocalNav.prototype._bound_funcs_out;
jacLocalNav.prototype._observed_elems;
jacLocalNav.prototype._observing;

jacLocalNav.prototype._orig_local_nav;
jacLocalNav.prototype._cur_sel;

jacLocalNav.prototype.get_image_base_dir =
	function()
	{
		return this._image_base_dir;
	};
jacLocalNav.prototype.set_image_base_dir =
	function(new_image_base_dir)
	{
		this._image_base_dir = new_image_base_dir;
	};

jacLocalNav.prototype.push_bound_func =
	function(which, new_func)
	{
		(which == 'over' ? this._bound_funcs_over : this._bound_funcs_out).push(new_func);
	};
jacLocalNav.prototype.get_bound_funcs =
	function(which)
	{
		return which == 'over' ? this._bound_funcs_over : this._bound_funcs_out;
	};
jacLocalNav.prototype.push_bound_func =
	function(which)
	{
		if(which == 'over')
			this._bound_funcs_over = new Array();
		else
			this._bound_funcs_out = new Array();
	};

jacLocalNav.prototype.set_original_menu =
	function(which_local_nav)
	{
		this._cur_sel = this._orig_local_nav = which_local_nav;
	};

jacLocalNav.prototype.get_selected = function() { return this._cur_sel; };

jacLocalNav.prototype.select_item =
	function(item_name)
	{
		var elem = $('local-nav-img-' + this._cur_sel);
		if(elem != null)
		{
			elem.writeAttribute({src: this._image_base_dir + '/menu-' + this._cur_sel + '.png'});
		}
		this._cur_sel = item_name;
		if(this._cur_sel == '')
			return;
		elem = $('local-nav-img-' + this._cur_sel);
		if(elem != null)
		{
			elem.writeAttribute({src: this._image_base_dir + '/menu-' + this._cur_sel + '-sel.png'});
		}
		else
			this._cur_sel = '';
	};

jacLocalNav.prototype.reset_nav =
	function()
	{
		this.clear_exit_timer();
		this.select_item(this._orig_local_nav);
		G_NAV.reset_nav();
	};

jacLocalNav.prototype.reloading =
	function()
	{
		this._cur_sel = this._orig_local_nav;
	};

jacLocalNav.prototype.observe =
	function(elem_ids)
	{
		if(this._observing)
			return;

		var ids = $A(elem_ids);
		var func = null;
		var that = this;
		ids.each(
			function(elem_id)
			{
				var elem = $(elem_id);
				if(elem != null)
				{
					that._observed_elems.push(elem);
					
					func = that.mouseover.bind(that);
					elem.observe('mouseover', func);
					that.push_bound_func('over', func);
			
					func = that.mouseout.bind(that);
					elem.observe('mouseout', func);
					that.push_bound_func('out', func);
				}
			});
		
		this._observing = true;
	};
jacLocalNav.prototype.stopObserving =
	function()
	{
		if(!this._observing)
			return;

		var that = this;
		this._observed_elems.each(
			function(elem, i)
			{
				if(elem != null)
				{
					elem.stopObserving('mouseover', that._bound_funcs_over[i]);
					elem.stopObserving('mouseout', that._bound_funcs_out[i]);
				}
			});
		this._bound_funcs_over = new Array();
		this._bound_funcs_out = new Array();
		this._observed_elems = new Array();
		this._observing = false;
	};


jacLocalNav.prototype.mouseover =
	function(e)
	{
		var elem = e.element();
		var name = elem.id.substr(14);

		G_NAV.clear_exit_timer();
		G_NAV.clear_change_timer();
		this.clear_exit_timer();
		this.clear_change_timer();

//		elem.writeAttribute({src: this._image_base_dir + '/menu-' + name + '-sel.png'});
		this.start_change_timer(this.select_item.bind(this, name));
	};

jacLocalNav.prototype.mouseout = 
	function(e)
	{
		var elem = e.element();
		var name = elem.id.substr(14);

//		elem.writeAttribute({src: this._image_base_dir + '/menu-' + name + '.png'});

		this.clear_exit_timer();
		this.start_exit_timer(this.reset_nav.bind(this));
	};

var G_NAV = new jacNav('/res/images', 'navigation', 'local-navigation');
var G_LOCAL_NAV = new jacLocalNav('/res/images');