/**
 * EMITCH TODO: compress this JS once we are solid and have all the kinks worked out.
 * Use querystring var for versioning and cache busting.
 */

/**
 * EMITCH TODO... 
 * I'm going to convert this to jQuery for fun... the prototype.js library is so last year
 * ...this is a quick and dirty run of the functionality we need!
 */
(function(){
	//google tracking example
	//pageTracker._trackPageview("/gnrs/whites2008/bios/" +  bioObj.image);
	
	log = function(x){
		if(typeof console != "undefined"){
			console.log(x);
		}
	}
	var doc = document;
	
	/**
	 * Top navigation controls
	 */
	$('nav_home').observe('click', function(){
		//EMITCH (OR ALAN) TODO: no need to ever go here after page load...just toggle
		doc.location.href = doc.location.href.split('?')[0];		
	});
	
	$('nav_team').observe('click', function(){
		var portraitWrapper = $('portraitWrapper');
		if($('portraitWrapper') && $('bioDetailWrapper')){
			$('portraitWrapper').removeClassName('hide');
			$('portraitWrapper').addClassName('show');
			$('bioDetailWrapper').removeClassName('show');
			$('bioDetailWrapper').addClassName('hide');
		}else{
			doc.location.href = doc.location.href.split('?')[0] + '?action=team';
		}
				
	});
	$('nav_chat').observe('click', function(){
		doc.location.href = 'index.cfm?action=chatLogin';
	});
	$('nav_stats').observe('click', function(){
		pageTracker._trackPageview("/gnrs/fisher2009/stats");
		alert('Coming soon!');	
	});
	
	/**
	 * Lower nav controls
	 */
	var next = $('nextBio'), prev = $('previousBio');
	if(next){
		next.observe('mouseover',function(){
			this.addClassName('hover');
		});
		next.observe('mouseout',function(){
			this.removeClassName('hover');
		});
		prev.observe('mouseover',function(){
			this.addClassName('hover');
		});
		prev.observe('mouseout',function(){
			this.removeClassName('hover');
		});
	}
	
	if ($('portraitWrapper')) {
		var splashAry = $('portraitWrapper').select('div.splashPortrait img')
		var sFlag = $(doc.createElement('img'));
		sFlag.addClassName('smallFlag hide');
		doc.body.appendChild(sFlag);
		var sName = $(doc.createElement('div'));
		sName.addClassName('splashName hide');
		doc.body.appendChild(sName);
		
	/**
	 * Define mouseover actions for team splash page
	 */
		splashAry.each(function(pic){
			pic.observe('mouseover', function(){
				this.parentNode.style.border = '2px solid #C4151B';
				var sId = this.id.split('_')[1];
				var specialTitle = '';
				if(parseInt(sId,10) === 0){
					specialTitle = '<strong>Team Captain</strong><br />';
				}
				sName.innerHTML = specialTitle + sData[sId].NAME + '<br />"' + sData[sId].AKA +'"';
				var iTop = 0, iLeft = 0, parentNode = this.parentNode;
				//EMITCH (OR ALAN) TODO: find a cool way to store this iTop value in a closure so we don't repeat the calculation.
				while (parentNode.tagName != "BODY") {
					iTop += parentNode.offsetTop;
					parentNode = parentNode.offsetParent;
				}
				parentNode = this.parentNode;
				//EMITCH (OR ALAN) TODO: find a cool way to store this iLeft value in a closure so we don't repeat the calculation.
				while (parentNode.tagName != "BODY") {
					iLeft += parentNode.offsetLeft;
					parentNode = parentNode.offsetParent;
				}
				//flag
				var flagSrc = sData[sId].STATE.replace(/\s/g,'');//strip spaces from state name for flag img
				if (flagSrc) {
					sFlag.src = 'img/flags/tinySize/' + sData[sId].STATE.replace(/\s/g, '') + '.jpg';
					sFlag.style.top = (iTop - 10) + 'px';
					sFlag.style.left = (iLeft - 10) + 'px';
				}
				if (sData[sId].STATE != '') {
					sFlag.removeClassName('hide');
					sFlag.addClassName('show');
				}
				//name
				sName.style.top = (iTop + 82) + 'px';
				sName.style.left = ((iLeft + 37) - sName.getWidth() / 2) + 'px';
				sName.removeClassName('hide');
				sName.addClassName('show');
			});
			
			pic.observe('mouseout', function(){
				this.parentNode.style.border = '2px solid #FFF';
				sFlag.removeClassName('show');
				sFlag.addClassName('hide');
				sName.removeClassName('show');
				sName.addClassName('hide');
				
			});
			
			pic.observe('click', function(){
				$('portraitWrapper').removeClassName('show');
				$('portraitWrapper').addClassName('hide');
				//grab the numeric out of this id... 2nd position
				renderBio(this.id.split('_')[1]);
			});
		});
	}
	
	renderBio = function(id){
		id=parseInt(id,10);
		var oData = sData[id];
		//move this to end when working
		var bioW=$('bioDetailWrapper'), bioDiv = $('bioDiv'), bioData=$('detailDiv'), 
		bioThumbs= $('bioDetailThumbs'), bioDetailPhoto=$('bioDetailPhoto'), bioText=$('bioText'),
		previousBio=$('previousBio'), nextBio=$('nextBio');
		bioData.select('span#name')[0].innerHTML = oData.NAME;
		
		//google page tracking
		pageTracker._trackPageview('/gnrs/fisher2009/' + oData.NAME);
		
		bioData.select('span#aka')[0].innerHTML = oData.AKA;
		bioData.select('span#state')[0].innerHTML = oData.STATE;
		bioData.select('span#yrs')[0].innerHTML = oData.YRS + ' years';
		bioData.select('span#det')[0].innerHTML = oData.DET;
		
		bioText.innerHTML = oData.BIO;
		bioDiv.scrollTop = 0;
		
		if(oData.IMAGE){
			var profilePic = oData.IMAGE;
		}else if(oData.PRD){
			var profilePic = 'noPhotoStar.jpg';
		}else{
			var profilePic = 'noPhoto.jpg';
		}
		//new image is used for measurement only.
		bioDetailPhoto.src = 'img/team/lg_' + profilePic;
		//set the padding for the image orientation (couldn't use image dims b/c the image may not be in cache fast enough.
		setPhotoPadding(oData.IMAGE_O);
		
		bioThumbs.innerHTML = '';
		var img = $(doc.createElement('img'));
		img.src = 'img/team/sm_' + profilePic;
		img.observe('mouseout', (function(img){
			return function(){
				img.removeClassName('hover');
			}
		})(img));
		
		img.observe('mouseover', (function(or,pic,img){
				return function(){
					img.addClassName('hover');
					bioDetailPhoto.src = 'img/team/lg_' + pic;
					setPhotoPadding(or);
				}
			})(oData.IMAGE_O, profilePic,img));
			
		bioThumbs.appendChild(img);
		
		//Finds
		var len = oData.FINDS.length
		for(var i=0;i<len;i++){
			var picSplit = oData.FINDS[i].split('_');
			img = $(doc.createElement('img'));
			img.src = 'img/team/finds/sm_' + picSplit[1];
			img.observe('mouseout', (function(img){
				return function(){
					img.removeClassName('hover');
				}
			})(img));
			img.observe('mouseover', (function(or,pic,img){
				return function(){
					img.addClassName('hover');
					//find a way to remove the flicker here!  Vertical to horizontal flicker etc.
					bioDetailPhoto.src = 'img/team/finds/' + pic;
					setPhotoPadding(or);
				}
			})(picSplit[0], oData.FINDS[i],img));
			bioThumbs.appendChild(img);
			
		}
		
		//navigation links
		var previousId = id - 1;
		if(previousId < 0){
			previousBio.addClassName('hide');
			previousBio.removeClassName('show');
		}else{
			previousBio.addClassName('show');
			previousBio.removeClassName('hide');
			previousBio.onclick = function(){
				renderBio(previousId);
			}
		}
		
		var nextId = id + 1;
		if (nextId == sData.length) {
			nextBio.addClassName('hide');
			nextBio.removeClassName('show');
		}else{
			nextBio.addClassName('show');
			nextBio.removeClassName('hide');
			nextBio.onclick = function(){
				
				renderBio(nextId);
			}
			
		}
		
		bioW.removeClassName('hide');
		bioW.addClassName('show');
	}	
	
	/*EMITCH TODO: no longer using setPhotoPadding... remove it when possible*/
	setPhotoPadding = function(image_o){
		var photoDiv = $('photoDiv');
		if(image_o == "v"){
			photoDiv.removeClassName('horizontalPhoto');
			photoDiv.addClassName('verticalPhoto');
		}else{
			photoDiv.removeClassName('verticalPhoto');
			photoDiv.addClassName('horizontalPhoto');
		}
	}
	
	doc.observe('dom:loaded',function(){
		//pull all images we will need into cache.
		var dataLen = sData.length,i,j,len,img,flag,picSplit;

		//preload noPhoto images
		new Image().src = 'img/team/lg_' + 'noPhoto.jpg';
		new Image().src = 'img/team/sm_' + 'noPhoto.jpg';
		new Image().src = 'img/team/lg_' + 'noPhotoStar.jpg';
		new Image().src = 'img/team/sm_' + 'noPhotoStar.jpg';
		for (i = 0; i < dataLen; i++) {
			//flags
			if (sData[i].STATE) {
				new Image().src = 'img/flags/tinySize/' + sData[i].STATE.replace(/\s/g, '') + '.jpg';
			}
			//bio pics & finds
			if (sData[i].IMAGE) {
				//small bio pics
				new Image().src = 'img/team/sm_' + sData[i].IMAGE;
				//large bio pics
				new Image().src = 'img/team/lg_' + sData[i].IMAGE;
			}
			
			len = sData[i].FINDS.length
			if(len){
				//finds
				for (j = 0; j < len; j++) {
					picSplit = sData[i].FINDS[j].split('_');
					//small finds
					new Image().src = 'img/team/finds/sm_' + picSplit[1];
					//big finds
					new Image().src = 'img/team/finds/' + sData[i].FINDS[j];
				}
			}
		}
		
	});
	
})();