var db = {};

// TabSet class.
db.TabSet = (function() {
	
	function T(el, resizer) {
		// Cache tabs and tab bodies.
		var tabs = jQuery('li', el);
		var tabBodies = jQuery('#' + el.attr('id') + '-container > div');
		
		// Preprocess the tabs.
		tabs.each(function (idx) {
			// Grab the tab.
			var t = jQuery(this);
			
			// Disable the anchor tags since it will be handled by JavaScript.
			t.find('a').each(function (index) {
				jQuery(this).attr('href', 'javascript:void(0);');
			});
			
			// Make sure any 'off' tab bodies are hidden.
			var tb = jQuery(tabBodies.get(idx));
			if (!t.hasClass('on')) {
				tb.hide();				
			} else {
				// Resize the interface for the 'on' tab.
				if (resizer) resizer(tb);
			}
		});

		// Bind the click event for each li.
		tabs.bind('click', function(evt) {
			// Make sure we get to the li elements.
			var li = jQuery(evt.target).parents('li')
			
			// If it's already 'on' then ignore.
			if (li.hasClass('on')) return;
			
			// Find the tab that used to be on and remove it's 'on' state.
			var o = tabs.filter('.on');
			o.removeClass('on');
			
			// Add the 'on' state to the new tab.
			li.addClass('on');
			
			// Hide/Show the tab bodies.
			jQuery(tabBodies.get(tabs.index(o))).fadeOut(300);
			
			var t = jQuery(tabBodies.get(tabs.index(li)));
			t.fadeIn(300);
			
			// Resize the interface for the newly 'on' tab.
			if (resizer) resizer(t, 300);
		});
	}
	
	return T;
})();

jQuery(document).ready(function() {
	
	var swoosh = jQuery('#swoosh');

	var tabContainer = jQuery('.tab-container');
	var demo = swoosh.find('#demo-swoosh');

	var col1FixedHeight = swoosh.offset().top - jQuery('#col1').offset().top + swoosh.height() - parseInt(demo.css('marginTop'), 10);
	var col2TabSetHeight = tabContainer.offset().top - jQuery('#col2').offset().top;
	
	// Create a resizer function that will resize other elements of the interface to match the tab.  This function will be called by
	// the db.TabSet after a tab is activated.
	var resizer = function (tab, speed) {
		var h = tab.height() + tab.position().top;
		var m = h - col1FixedHeight + col2TabSetHeight;
		
		// If the speed paramter is present then animate the resize.
		if (speed) {
			// Resize the tab container.
			tabContainer.animate({
				height: h
			}, speed);
			
			// Reposition the demo swoosh.
			demo.animate({
				marginTop: m
			}, speed);
		} else {
			// Otherwise, resize immediately.
			tabContainer.height(h);
			demo.css('marginTop', m);
		}
	}
	
	// Find all the tabs and create TabSet objects for each.
	var tabSets = jQuery('.tabs');
	tabSets.each(function (idx) {
		new db.TabSet(jQuery(this), resizer);
	});
	
	// Grab the logos for replacement.
	var logos = jQuery('#swoosh img');
	var index = 0;
	
	// Hide all but the first logo (need to do this so the space alloted for logos
	// is big enough for the largest logo).
	logos.each(function (idx) {
		if (idx != 0) jQuery(this).hide();
	});
	
	// Start the logo rotation using an interval
	var handle = window.setInterval(function() {
		var oldImg = jQuery(logos.get(index));
		
		index++;
		if (index > logos.size() - 1) index = 0;
		var newImg = jQuery(logos.get(index));
		
		oldImg.fadeOut(700);
		newImg.fadeIn(700);
	}, 999);
	
});