/* THE CABINET FOLKS CORE JAVASCRIPTS
** CREATED MARCH 7, 2009 */

var TCFCore = 
{
	init: function()
	{
		NavDropdown.init();
		PreloadImages.init();
		HoverSwitch.init();
	}
};

Event.observe(window, 'load', TCFCore.init);


/*contols the display of the navigation dropdown menus
* 1) adds/removes 'hover' class to anchor tag
* 2) removes/adds 'hiddenList' class from ul containing dropdown list*/
var NavDropdown =
{
	init: function()
	{
		if ($('topNav'))
		{
			var triggersArray = $('topNav').select('li.trigger');
			
			triggersArray.each(function (item)
			{
				Event.observe(item, 'mouseover', NavDropdown.show);
				Event.observe(item, 'mouseout', NavDropdown.hide);
			});
		}
	},
	show: function() //activeate dropdown menu and clear timer (stop IE from exploding)
	{
		clearTimeout(this._timer);
		this.select('a')[0].addClassName('hover');
		this.select('ul')[0].removeClassName('hiddenList');
	},
	hide: function() //hide dropdown and set timer
	{
		var theItem = this;
		theItem._timer = setTimeout(function()
		{
			theItem.select('a')[0].removeClassName('hover');
			theItem.select('ul')[0].addClassName('hiddenList');
		}, 10);
	}
};


/*preloads images for hoverswitch etc.*/
var PreloadImages =
{
	init: function()
	{
		if (document.images)
		{
			var imageList = new Array();
			var offImageSrc = new Array();
			var onImageSrc = [ //manually entered images src's if needed
				
			];
			var offStateImageElements = $$('img.hoverSwitch'); //get off-state image objects, i want to load ON states
			if (offStateImageElements.length != 0)//if there are hoverSwitch images, get ON src, add the to array
			{
				for (var i = 0; i < offStateImageElements.length; i++)
				{
					offImageSrc[offImageSrc.length] = offStateImageElements[i].src; //make array of off image sources
					onImageSrc[onImageSrc.length] = offImageSrc[i].replace("Off", "ON"); //make array of ON image sources by replacing 'Off' with 'ON'
				}
			}
			var preloadedImages = new Array(); //initialize array for preloaded images
			for (var j = 0; j < onImageSrc.length; j++) //run throught all ON sources, creating image for each
			{
				preloadedImages[j] = document.createElement('img');
				preloadedImages[j].setAttribute('src',onImageSrc[j]);
			}
		}
	}
};



var HoverSwitch = 
{
	init: function()
	{
		if ($$('img.hoverSwitch')[0])
		{
			var imageToSwitch = $$('img.hoverSwitch'); //sets up event listeners on all elements with 'hoverSwitch' class
			for (var i = 0; i < imageToSwitch.length; i++)
			{
				Event.observe(imageToSwitch[i], "mouseover", HoverSwitch.swapImageOn.bindAsEventListener(imageToSwitch[i]));
				Event.observe(imageToSwitch[i], "mouseout", HoverSwitch.swapImageOff.bindAsEventListener(imageToSwitch[i]));
			}
		}
	},
	swapImageOn: function() //replaces ...off... for ...ON...
	{
		var sourceString = this.src;
		var newSource = sourceString.replace("Off", "ON");
		this.src = newSource;
	}, 
	swapImageOff: function() //replaces ...ON... with ...Off...
	{
		var sourceString = this.src;
		var newSource = sourceString.replace("ON", "Off");
		this.src = newSource;
	}
};
