/**
 * @author pop webdev [cn]
 * @version: 0.6.
 * @classDescription: Content Accordion
 * @dependencies: Prototype v1.6.1, Effects.js (Script.aculo.us)
 */
// start Accordion
var Accordion = Class.create ({
	initialize: function(container,wrap,triggers,targets,options)
	{
        this.container = container;											// $ container for the entire widget
		this.wrap = wrap;													// $$ wrap for a section of the accordion
        this.triggers = triggers;											// $$ all the triggers
        this.targets = targets;												// $$ all the targets
		this.length = this.triggers.size();									// length of triggers
		this.container.writeAttribute('role', 'tablist');					// add aria role 'tablist' to container
		this.container.writeAttribute('aria-multiselectable', 'false');		// add aria-multiselectable attribute to container
		this.triggers.invoke('writeAttribute', 'role', 'tab');				// add aria role 'tab' to triggers
		this.triggers.invoke('writeAttribute', 'aria-selected', 'false');	// add aria-selected attribute to triggers
		this.targets.invoke('writeAttribute', 'role', 'tabpanel');			// add aria role 'tabpanel' to targets
		this.targets.invoke('writeAttribute', 'aria-expanded', 'false');	// add aria-expanded attribute to targets
		this.targets.invoke('writeAttribute', 'aria-hidden', 'true');		// add aria-hidden attribute to targets
		this.options = Object.extend({
			initialIndex: 0,												// index of initial item
			equalHeight: false,												// boolean // todo?: accept user inputed value
			selfClosing: false,												// boolean, trigger can open/close itself
			showLink: 'show benefit',										// toggle link text to show when section is closed
			hideLink: 'hide benefit',										// toggle link text to show when section is open
			activeClassName: 'link-toggle-active',							// css class for current trigger
			activeWrapClass: 'accordion-section-active',					// css class for active section wrap
			eventType: 'click',												// activate accordion on 'click', could also be 'mouseenter'
			speed: 0.5														// animation speed
		}, options || {});
		if (this.options.initialIndex >= this.length) {this.options.initialIndex = 0;}			// reset initial index if too high
		this.urlHash = window.location.hash.replace('#','') || false;							// get url hash
		// check url hash to override this.options.initialIndex
		if (this.urlHash) {
			for (var i=0; i<this.length; i++) {
				if (this.targets[i].id == this.urlHash) {
					this.options.initialIndex = i;
				}
			}
		}
		this.currentIndex = this.options.initialIndex;

		this.isAnimating = false;

		this.maxHeight = this.options.equalHeight;
		if (this.options.equalHeight) {this.checkMaxHeight();}

		this.initialDisplay(this.currentIndex);

		var boundClickHandler = this.__Trigger.bindAsEventListener(this);
		this.triggers.invoke('observe', this.options.eventType, boundClickHandler);

	},
	checkMaxHeight: function()
	{
		for (var i=0; i<this.length; i++) {
			if (this.targets[i].getHeight() > this.maxHeight) {
				this.maxHeight = this.targets[i].getHeight();
			}
		}
	},
	initialDisplay: function(index)
	{
		this.initialHeight = this.options.equalHeight ? this.maxHeight+'px' : 'auto';
		this.targets.invoke('setStyle', {height: '0px'});
		this.targets[index].setStyle({height: this.initialHeight});
		this.targets[index].writeAttribute('aria-expanded', 'true');
		this.targets[index].writeAttribute('aria-hidden', 'false');
		this.triggers[index].addClassName(this.options.activeClassName);
		this.triggers[index].writeAttribute('aria-selected', 'true');
		this.triggers[index].update(this.options.hideLink);
		this.wrap[index].addClassName(this.options.activeWrapClass);
	},
	__Trigger: function(e)
	{
		e.stop();
		var el = e.findElement('a');
		var index = this.triggers.indexOf(el);
		if (!this.isAnimating) {
			if (!this.options.selfClosing) {
				// if !selfClosing then accordion operates as normal
				if (!el.hasClassName(this.options.activeClassName)) {
					this.AnimateAccordion(index);
				}
			} else {
				// if selfClosing then check various states of acordion
				if ((!el.hasClassName(this.options.activeClassName)) && (this.currentIndex != index) && (this.currentIndex != -1)) {
					// default state, same behaviour as !selfClosing
					this.AnimateAccordion(index);
				} else {
					if ((el.hasClassName(this.options.activeClassName)) && (this.currentIndex == index)) {
						// currentIndex is open
						this.AnimateSelfClosed(index);
					} else {
						// currentIndex is -1, all are closed
						this.AnimateSelfOpen(index);
					}
				}
			}
		}
	},
	AnimateSelfOpen: function(index)
	{
		new Effect.Scale(this.targets[index], 100, {
			duration: this.options.speed,
			fps: 100,
			scaleFrom: 0,
			scaleContent: false,
			transition: Effect.Transitions.easeOutExpo,
			scaleMode: {
				originalHeight: this.maxHeight || this.targets[index].scrollHeight,
				originalWidth: this.container.getWidth()
			},
			scaleX: false,
			scaleY: true,
			beforeStart: function() {
				this.isAnimating = true;
				this.triggers[index].addClassName(this.options.activeClassName);
				this.triggers[index].update(this.options.hideLink);
				this.wrap[index].addClassName(this.options.activeWrapClass);
			}.bind(this),
			afterFinish: function() {
				this.isAnimating = false;
				this.triggers[index].writeAttribute('aria-selected', 'true');
				this.targets[index].writeAttribute('aria-expanded', 'true');
				this.targets[index].writeAttribute('aria-hidden', 'false');
				this.currentIndex = index; // reset currentIndex
			}.bind(this)
		});
	},
	AnimateSelfClosed: function(index)
	{
		new Effect.Scale(this.targets[index], 0, {
			duration: this.options.speed,
			fps: 100,
			scaleFrom: 100,
			scaleContent: false,
			transition: Effect.Transitions.easeOutExpo,
			scaleMode: {
				originalHeight: this.maxHeight || this.targets[index].scrollHeight,
				originalWidth: this.container.getWidth()
			},
			scaleX: false,
			scaleY: true,
			beforeStart: function() {
				this.isAnimating = true;
				this.triggers[index].removeClassName(this.options.activeClassName);
				this.triggers[this.currentIndex].update(this.options.showLink);
				this.wrap[index].removeClassName(this.options.activeWrapClass);
			}.bind(this),
			afterFinish: function() {
				this.isAnimating = false;
				this.triggers[index].writeAttribute('aria-selected', 'false');
				this.targets[index].writeAttribute('aria-expanded', 'false');
				this.targets[index].writeAttribute('aria-hidden', 'true');
				this.currentIndex = -1;	// if all items are closed then currentIndex does not exist
			}.bind(this)
		});
	},
	AnimateAccordion: function(index)
	{
		var parallelEffects = new Array();

		var optionsA = {
			sync: true,
			scaleFrom: 0,
			scaleContent: false,
			transition: Effect.Transitions.easeOutExpo,
			scaleMode: {
				originalHeight: this.maxHeight || this.targets[index].scrollHeight,
				originalWidth: this.container.getWidth()
			},
			scaleX: false,
			scaleY: true
		};
		parallelEffects.push(new Effect.Scale(this.targets[index], 100, optionsA));

		var optionsB = {
			sync: true,
			scaleFrom: 100,
			scaleContent: false,
			transition: Effect.Transitions.easeOutExpo,
			scaleMode: {
				originalHeight: this.maxHeight || this.targets[this.currentIndex].scrollHeight,
				originalWidth: this.container.getWidth()
			},
			scaleX: false,
			scaleY: true
		};
		parallelEffects.push(new Effect.Scale(this.targets[this.currentIndex], 0, optionsB));

		new Effect.Parallel(parallelEffects, {
			duration: this.options.speed,
			fps: 100,
			queue: {
				position: 'end',
				scope: 'accordionAnimation'
			},
			beforeStart: function() {
				this.isAnimating = true;
				this.triggers[this.currentIndex].removeClassName(this.options.activeClassName);
				this.triggers[index].addClassName(this.options.activeClassName);
				this.triggers[index].update(this.options.hideLink);
				this.triggers[this.currentIndex].update(this.options.showLink);
				this.wrap[index].addClassName(this.options.activeWrapClass);
				this.wrap[this.currentIndex].removeClassName(this.options.activeWrapClass);
			}.bind(this),
			afterFinish: function() {
				this.isAnimating = false;
				this.triggers[this.currentIndex].writeAttribute('aria-selected', 'false');
				this.triggers[index].writeAttribute('aria-selected', 'true');
				this.targets[this.currentIndex].writeAttribute('aria-expanded', 'false');
				this.targets[this.currentIndex].writeAttribute('aria-hidden', 'true');
				this.targets[index].writeAttribute('aria-expanded', 'true');
				this.targets[index].writeAttribute('aria-hidden', 'false');
				this.currentIndex = index;	// only at the end, reset currentIndex
			}.bind(this)
		});

	}
});
// end Accordion

// start gift champion showhide
var GiftChampionShowhide = Class.create ({
	initialize: function(options)
	{
		this.options = Object.extend({
			speed: 0.4
		}, options || {});
		this.fxOptions = {
			duration: this.options.speed,
			fps: 100,
			queue: {position: 'end', scope: 'revealerscope'}
		};

		// set elements
		this.chkGiftChampion = $$('input[id$=giftChampion]')[0];
		this.elGiftChampion = $('gift-champion-showhide');

		// set initial conditions
		if (this.chkGiftChampion.checked) {
			this.elGiftChampionRevealed = true;
		} else {
			this.elGiftChampionRevealed = false;
			this.elGiftChampion.hide();
		}

		// set event handlers
		this.chkGiftChampion.observe('click', this.__ShowChampionForm.bindAsEventListener(this));
	},
	__ShowChampionForm: function(e)
	{
		if (this.elGiftChampionRevealed) {
			this.CollapseContent(this.elGiftChampion);
			this.elGiftChampionRevealed = false;
		}
		
		else{
		    this.RevealContent(this.elGiftChampion);
		    this.elGiftChampionRevealed = true;
		    }
	},
	RevealContent: function(target)
	{
		new Effect.BlindDown(target, this.fxOptions);
	},
	CollapseContent: function(target)
	{
		new Effect.BlindUp(target, this.fxOptions);
	}
});
// end gift champion showhide