// Fade swapper
var FadeSwap = Class.create();
Object.extend(Object.extend(FadeSwap.prototype, AC.ContentSwap.prototype), {
	cs1IsAnimating: false,
	cs2IsAnimating: false,
	lastSelectorIndex: false,

	initialize: function(selectors, contents, eventStr) {
		this.title = document.title;

		this.eventStr = eventStr;
		
		// get lists of selectors and content in order
		this.selectorList = selectors;
		this.contentList = contents;

		for (var i=0; i<this.contentList.length; i++) {
			this.contentList[i].style.display = 'none';

			var name = this.selectorList[i];
			name = Element.down(name, 'a');
			this.selectorList[i].url = name.href;
			while (name.firstDescendant()) name = name.firstDescendant();
			this.selectorList[i].name = name.innerHTML.unescapeHTML();
		}
		
		this.setMouseover();
	},

	setMouseover: function() {
		for(var i=this.selectorList.length-1, selector; selector = this.selectorList[i]; i--) {
			Event.observe(selector, this.eventStr, this.swapContent.bindAsEventListener(this, i), false);
		}
	},

	swapContent: function(evt, selectorIndex) {
		if (evt) this.trackClick(selectorIndex);

		// if we aren't already animating
		if (this.cs1IsAnimating == false && this.cs2IsAnimating == false) {

			// set the first anim flag
			this.cs1IsAnimating = true;
			this.cs2IsAnimating = true;
			
			// set some temporary vars
			var selector = this.selectorList[selectorIndex];
			var content = this.contentList[selectorIndex];
			
			// set the 'on' class
			if (!Element.hasClassName(selector, 'active')) Element.addClassName(selector, 'active');

			// if this is the first one
			if (!this.lastSelectorIndex && typeof(this.lastSelectorIndex) == 'boolean') {
				if(!AC.Detector.isiPhone()) {
					this.afterFade(content);
				} else {
					content.style.display = 'block';
					
					this.resetFlag('cs1IsAnimating');
					this.resetFlag('cs2IsAnimating');
				}

			} else if (selectorIndex != this.lastSelectorIndex) {
				// set some more temporary vars
				var lastSelector = this.selectorList[this.lastSelectorIndex];
				var lastContent = this.contentList[this.lastSelectorIndex];

				// remove the 'on' class
				if (Element.hasClassName(lastSelector, 'active')) Element.removeClassName(lastSelector, 'active');
		
				// swap
				if(!AC.Detector.isiPhone()) {
					new Effect.Fade(lastContent, { duration:.25, queue:{position:'end', scope:'cs1'},
						afterFinish:this.afterFade.bind(this, content)
					});
				} else {
					lastContent.style.display = 'none';
					content.style.display = 'block';
					
					this.resetFlag('cs1IsAnimating');
					this.resetFlag('cs2IsAnimating');
				}
			} else {
				this.resetFlag('cs1IsAnimating');
				this.resetFlag('cs2IsAnimating');
			}

			// set the document.title to make click tracking a breeze
			document.title = this.title+' - '+selector.name;

			// set the last content index now that we're done doing everything
			this.lastSelectorIndex = selectorIndex;
		}

		return false;
	},

	afterFade: function(content) {
		this.resetFlag('cs1IsAnimating');

		if (content.id.match(/-AnchorFix/i)) document.body.id = content.id.replace(/-AnchorFix/i, '');

		new Effect.Appear(content, { duration:.25, queue:{position:'end', scope:'cs2'},
			afterFinish:this.afterAppear.bind(this, content)
		});
	},

	afterAppear: function(content) {
		this.resetFlag('cs2IsAnimating');
	},

	resetFlag: function(flagName) {
		if(flagName == 'cs1IsAnimating') this.cs1IsAnimating = false;
		if(flagName == 'cs2IsAnimating') this.cs2IsAnimating = false;
	},

	trackClick: function(selectorIndex) {
	//	clickTracking(this.selectorList[selectorIndex].url, this.title+' - '+this.selectorList[selectorIndex].name);
	}
});