/**
 * @author Grace
 */

 
//namespace
if ((typeof TDA) == 'undefined') {
	var TDA = {};
}


/**
 * Represents one picture
 * @param {Object} config
 */
TDA.Pimg = function(config){
	this.id = config.id;
}

TDA.Pimg.prototype = {
	
	
	
}


/**
 * For showing bios
 * 
 * .trigger -- class name of elements that will trigger the action (.cvclick)
 * .target -- class name of elements that contains bio text  (.cvtext)
 * 
 * @param {Object} config
 */
TDA.ToggleGroup = function(config){
	this.config = config;
	this.trigger = [];
	this.target = [];
	this.curitem = -1;		// currently opened item's index
}
TDA.ToggleGroup.prototype = {
	init:function(){
		this.trigger = $$(this.config.trigger);
		this.target = $$(this.config.target);
		var maxcount = this.trigger.length;
		for (var ii = 0; ii < maxcount; ii++) {
			this.trigger[ii].observe('click', this.biotoggle.bind(this, ii));
	
		}

	},

	biotoggle:function(ii) {
		
		if (this.curitem == -1){ //nothing else open
			//Effect.BlindDown(this.target[ii]);
			Effect.Appear(this.target[ii]);
			this.curitem = ii;
			return;
		}
		else if (this.curitem == ii) { //clicked twice, close it
			//Effect.BlindUp(this.target[ii]);
			this.target[ii].hide();
			this.curitem = -1;
			return;			
		}
		else { //clicked while something else is open.  
			//Effect.BlindUp(this.target[this.curitem]);
			this.target[this.curitem].hide();
			Effect.Appear(this.target[ii]);
			//Effect.BlindDown(this.target[ii]);
			this.curitem = ii;
			return;					
			
		}
		
		
	}
}




/**
 * 
 * @param {Object} config
 */
TDA.HoverGroup = function(config){
	this.trigger = config.trigger;
	this.target = config.target;
}
TDA.HoverGroup.prototype = {
	init:function(){
		
		var elem = $(this.trigger);
		var targ = $(this.target);
		if (elem && targ) {
			elem.observe('mouseover', function(event){targ.show();});
			elem.observe('mouseout', function(event){targ.hide();});
		}
	}
}



/**
 * A group of Pictures
 * 
 * @param {Object} config 
 * 	Required members are: 
 * 		parray - array of HTML element IDs ex: ["img1", "img2", "img3"]
 * 	Optional members are:
 * 		bigpix - big img ID 
 * 		auxarray - arry of HTML elements that are auxillary members of parray
 * 			ex: ["caption1", "caption2", "caption3"]
 * 			Must match the # of parray
 * 
 * 
 */
TDA.Pgroup = function(config){
	this.config = config;
	this.maxcount = config.parray.length;
	this.curitem = -1;		// currently selected item's index
	this.parray = [];
	this.auxarray = [];
	
	//enable auxiliary only if non-empty array was given
	if (config.auxarray){
		this.auxexists = config.auxarray.length ? true : false;
	}
	else {
		this.auxexists = false;
	}
		
	this.bigpix = null;
	this.opacityLevel = 0.7;
}

TDA.Pgroup.prototype = {

	/**
	 * Hookup event handler
	 * @param int startidx Starting index that should be set as clicked.
	 * 
	 */
	init:function(startidx){
		
		//setup pointer to HTML elements
		for (var ii = 0; ii < this.maxcount; ii++) {
			this.parray[ii] = $(this.config.parray[ii]);
			if (this.auxexists) {
				this.auxarray[ii] = $(this.config.auxarray[ii]);
			}
		}
		
		//If big pix is defined, setup click events
		if (this.config.bigpix && $(this.config.bigpix)){
			this.bigpix =  $(this.config.bigpix);
		
		
			for (var ii=0; ii < this.maxcount; ii++){
				this.parray[ii].observe("click", this.handleClick.bind(this, ii, false));
				if (this.auxexists) {
					this.auxarray[ii].observe("click", this.handleClick.bind(this, ii, true));
				}
			}
		}

		//hook up event handler for each image
		for (var ii=0; ii < this.maxcount; ii++) {
			if (this.parray[ii]) {
				this.parray[ii].observe("mouseover", this.imgHover.bind(this, ii, false));
				this.parray[ii].observe("mouseout", this.imgRestore.bind(this, ii, false));
			}
			if (this.auxexists){
				this.auxarray[ii].observe("mouseover", this.auxHover.bind(this, ii, false));	
				this.auxarray[ii].observe("mouseout", this.auxRestore.bind(this, ii, false));

			}
		}
		this.imgHover(-1, false);
	},
	
	/**
	 * Handle click event
	 * @param {int} idx Index of the element clicked.
	 * @param {bool} fromAuxClick true if auxiliary element clicked
	 */
	handleClick : function (idx, fromAuxClick) {
		var lastitem = this.curitem;
		var clickedimg = null;

		//make this one active
		this.imgHover(idx, fromAuxClick);
		if (this.auxesists){
			this.auxHover(idx,!fromAuxClick);
		}
		this.curitem = idx;
		//get image and set it to the main pix.
		//var clickedimg = this.parray[idx].childElements();
		if(clickedimg = this.parray[idx].down('img')){
			this.bigpix.src = clickedimg.src;
		}
		
		//restore previous one.
		if (lastitem >= 0){
			this.imgRestore(lastitem, fromAuxClick);	
			if (this.auxesists){
				this.auxRestore(lastitem, !fromAuxClick);
			}
		}
		

	},

	/**
	 * 
	 * @param {int} idx
	 * @param {bool} fromAuxHover[optional] - true if manually calling from auxHover
	 */
	imgHover:function(idx, fromAuxHover){

		if (idx == -1) {
			/* means nothing is selected -- fade out all */
			for (var ii=0; ii<this.maxcount; ii++){
				if (this.parray[ii]){
					this.parray[ii].setOpacity(this.opacityLevel);
				}
			}
			return;
		}
		if (idx == this.curitem){
			return;
		}
		if (this.parray[idx]){
			this.parray[idx].setOpacity(1);
			
		}
		if (fromAuxHover) {
			return;
		}

		if (this.auxexists){
			this.auxHover(idx, true);
		}
	},

	/**
	 * 
	 * @param {Object} idx
	 * @param {Object} fromAux[optional] true if manually calling from aux handler
	 */	
	imgRestore:function(idx, fromAux){
		if (idx == this.curitem){
			return;
		}

		if (idx >= 0 && idx < this.maxcount) 
			if (this.parray[idx]) {
				this.parray[idx].setOpacity(this.opacityLevel);
			}
			
			
		if (fromAux) {
			return;
		}
		
		if (this.auxexists){
			this.auxRestore(idx,true);
		}
	},
	
	/**
	 * 
	 * @param {int} idx
	 * @param {bool} fromImgHover[optional] - true if manually calling from Img event handler
	 */
	auxHover: function(idx, fromImgHover) {
		if (idx == this.curitem){
			return;
		}

		this.auxarray[idx].addClassName("hover");
		
		if (fromImgHover){
			return;
		}
		this.imgHover(idx, true);
	},
	
	auxRestore: function(idx, fromImg){
		if (idx == this.curitem){
			return;
		}
		
		this.auxarray[idx].removeClassName("hover");
		if (fromImg){
			return;
		}
		this.imgRestore(idx, true);
	}
	
}