// JavaScript Document
/*
* This script requires the prototype library swaps content based on classes.  
* This script adds the 'active' class to selectors and content sections.  
* Be sure to have the appropriate CSS for the 'active' class. Call this script 
* with a selector class and a content class:
* var mySwapContent = new AC.SwapContent('selectors', 'targets', 'click');
*
* Note: The selectors and content sections must be in the same order.  The first
*       selector will swap the content to the first content section.
*/                      

if (typeof(AC) == "undefined") { AC = {}; }

AC.SwapContent = Class.create();
AC.SwapContent.prototype = {

	selectorList: null,
	contentList: null,
	contentSelectorHash: null,
	eventStr: null,

	initialize: function(selectorClass, contentClass, eventStr, options) {
	
		this.eventStr = eventStr;
		this.options = options || {};
		
		// get lists of selectors and content in order
		this.selectorList = document.getElementsByClassName(selectorClass);
		this.contentList = document.getElementsByClassName(contentClass);
		
		this.setMouseover();
	},
	
	setMouseover: function() {
		for(var i=this.selectorList.length-1, selector;
			selector = this.selectorList[i]; i--) {
			
			Event.observe(selector, this.eventStr, this.swapContent.bind(this, i), false);
			
		}
	},
	
	swapContent: function(selectorIndex) {
		var selector = this.selectorList[selectorIndex];
		var content = this.contentList[selectorIndex];
		
		// add 'on' class
		if(!Element.hasClassName(selector, 'active')) Element.addClassName(selector, 'active');
		if(!Element.hasClassName(content, 'active')) Element.addClassName(content, 'active');

		// remove 'on' class from all other selectors and content areas
		for(var i=this.selectorList.length-1; i >= 0; i--) {
			if(i != selectorIndex) {
				if(Element.hasClassName(this.selectorList[i], 'active')) Element.removeClassName(this.selectorList[i], 'active');
				if(Element.hasClassName(this.contentList[i], 'active')) Element.removeClassName(this.contentList[i], 'active');
			}
		}
		
		if (typeof(this.options.onSwap) == 'function') {
			this.options.onSwap(selector, content);
		}
		
		return false;
	}
}
		// This style allows users without JS to still see all the content
		document.write('<style type="text/css">')
		document.write('.tabcontent{display:none;}')
		document.write('</style>')
		
		Event.observe(window, 'load', function() {
			var hash = document.location.hash.toString();
			hash = hash.substring(1, hash.length);
			if(hash) {
				$$('li.tab').each(function(tab) {
					if(tab.hasClassName(hash)) tab.addClassName('active');
				});
				$$('div.tabcontent').each(function(content) {
					if(content.hasClassName(hash)) content.addClassName('active');
				});
				new AC.SwapContent('tab', 'tabcontent', 'click')				
			} else {
				$$('li.tab')[0].addClassName('active');
				$$('div.tabcontent')[0].addClassName('active');
				new AC.SwapContent('tab', 'tabcontent', 'click');
			} 

		}, false);
