// written by Dean Edwards, 2005
// with input from Tino Zijdel, Matthias Miller, Diego Perini
// http://dean.edwards.name/weblog/2005/10/add-event/
// modified by Marty Mapes, 2008
// new usage: addEvent (button, "click", hitch(context, doMe), data)...
//            doMe (event, element, data) { ... }

function addEvent(element, type, handler, data) 
{
		// assign each event handler a unique ID
		if (!handler.$$guid) handler.$$guid = addEvent.guid++;
		handler.$$data = data;

		// create a hash table of event types for the element
		if (!element.events) element.events = {};

		// create a hash table of event handlers for each element/event pair
		var handlers = element.events[type];
		if (!handlers) {
			handlers = element.events[type] = {};
			// store the existing event handler (if there is one)
			if (element["on" + type]) {
				handlers[0] = element["on" + type];
			}
		}
		// store the event handler in the hash table
		handlers[handler.$$guid] = handler;
		// assign a global event handler to do all the work
		element["on" + type] = handleEvent;
};
// a counter used to create unique IDs
addEvent.guid = 1;

function removeEvent(element, type, handler) {
	// delete the event handler from the hash table
	if (element.events && element.events[type]) {
		delete element.events[type][handler.$$data];
		delete element.events[type][handler.$$guid];
	}
};

function handleEvent(event) {
	var returnValue = true;

	// grab the event object (IE uses a global event object)
	event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);

	// pass the element
	var el = this;

	// get a reference to the hash table of event handlers
	var handlers = this.events[event.type];

	// execute each event handler
	for (var i in handlers) {
		this.$$handleEvent = handlers[i];
		var data = handlers[i].$$data;
		if (this.$$handleEvent(event, el, data) === false) {
			returnValue = false;
		}
	}
	return returnValue;
};

function fixEvent(event) {
	// add W3C standard event methods
	event.preventDefault = fixEvent.preventDefault;
	event.stopPropagation = fixEvent.stopPropagation;
	return event;
};
fixEvent.preventDefault = function() {
	this.returnValue = false;
};
fixEvent.stopPropagation = function() {
	this.cancelBubble = true;
};

function hitch(object, method)
{
	return function ()
	{
		if ("function" == typeof method)
		{
			return method.apply(object, arguments);
		} else {
			return obj[method].apply(object, arguments);
		}
	}
}

function hasClass(el, className)
{
	var curClassString = el.className;
	var classes = curClassString.split(" ");
	for (var i = 0; i < classes.length; i++)
   {
   	if (className == classes[i])
   	{
   		return true;
   	}
   }
	return false;
}

function addClass(el, className)
{
	if (hasClass(el, className))
	{
		return true;
	} else {
		el.className += " " + className;
		return true;
	}
	return false;
}

function removeClass(el, className)
{
	var curClassString = el.className;
	var classes = curClassString.split(" ");
	for (var i = 0; i < classes.length; i++)
	{
   	if (className == classes[i])
   	{
   		classes.splice(i, 1);
			el.className = classes.join(" ");
			return true;
   	}
	}
	return false;
}

function showLargeStyle()
{
	// get the classname, thus the styleID
	var a = arguments[0];
	var styleId = a.className;
	
	// get the handle to the large pic
	var styleDiv = document.getElementById(styleId);
	
	// hide all large pics
	var stylistFrame = document.getElementById("stylistFrame");
	var pictureFrames = stylistFrame.getElementsByTagName("div");
	for (var i = 0; i < pictureFrames.length; i++)
   {
   	if (/pictureFrame/.test(pictureFrames[i].className) && pictureFrames[i].id)
   	{
   		pictureFrames[i].style.display = "none";
   	}
   }
	
	// show the selected one
	styleDiv.style.display = "block";
}