$(document).ready(function() {
	var $thumbNo = 0;
	var myWidth = 0, myHeight = 0;
	var animating = 0;
	
	getPx();
	alterMenu();
	
	var	
		speed = 1500,  // animation speed
		$wall = $('#modules')
	;

	$wall.masonry({
	  columnWidth: 223, 
	  itemSelector: '.box:not(.invis)',
	  animate: true,
	  animationOptions: {
		duration: 1000,
		easing: 'linear',
		complete: aniFinish,
		queue: false
	  }
	});
	
	$('.gallery').cycle({
		fx: 'fade', 
		randomizeEffects: false, 
		speed:    1000, 
   		timeout:  4000,
		before:   nextThumb
	});
	

	
	
	$('.metaContainer').hover(function () {$(this).removeClass("invis"); });

	$(window).wresize( function() {	  
		getPx();
		alterMenu();
		$wall.masonry();
	});
	
	function getPx() {
		if( typeof( window.innerWidth ) == 'number' ) {
			//Non-IE
			myWidth = window.innerWidth;
			myHeight = window.innerHeight;
		  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
			//IE 6+ in 'standards compliant mode'
			myWidth = document.documentElement.clientWidth;
			myHeight = document.documentElement.clientHeight;
		  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
			//IE 4 compatible
			myWidth = document.body.clientWidth;
			myHeight = document.body.clientHeight;
		  }	
	}
	
	
	function alterMenu() {
		  
		  var white = document.getElementById('white');
		  var header = document.getElementById('header');
		  var blank = document.getElementById('blank');
		  var footer = document.getElementById('footer');
		  var module = document.getElementById('modules');
		  
		  //var error = document.getElementById('credit');
		  //error.innerHTML = "<p>" + myWidth + "</p>"
		  
		  var newWidth = 874;
		  
		  if(myWidth < 1217){  
			newWidth = '874px';
			//four tiles
		  }
		  else if(myWidth < 1438){  
			newWidth = '1099px';
			//five tiles
		    }
		  else if(myWidth < 1657){  
			newWidth = '1320px';
			//six tiles
			}
		  else if(myWidth < 1874){  
			newWidth = '1543px';
			//seven tiles
			}
		  else if(myWidth < 2140){  
			newWidth = '1765px';
			//eight tiles
			}
		  else if(myWidth < 2370){  
			newWidth = '2005px';
			//eight tiles
			}
		  else if(myWidth < 2597){  
			newWidth = '2230px';
			//eight tiles
			}
			
			//error.innerHTML = "<p>style.width before = " + header.style.width + "</p>"
			white.style.width = newWidth;
			header.style.width = newWidth;
			blank.style.width = newWidth;
			footer.style.width = newWidth;
			//modules.style.width = newWidth+40;
			//error.innerHTML = error.innerHTML + "<p>style.width after = " + header.style.width + "</p>"	
	}
	
	var $i = 0;	
	var $noThumbs = 0;
	
	
	function nextThumb(){
		$noThumbs = parseFloat(document.getElementById('store').innerHTML) - 1
		

		if( $thumbNo == 0){
			var prevObj = document.getElementById('thumbbar ' + ($noThumbs));
		}
		else
		{
			var prevObj = document.getElementById('thumbbar ' + ($thumbNo - 1));
		}
		
		var obj = document.getElementById('thumbbar ' + $thumbNo);		
		document.getElementById('captionTxt').innerHTML = obj.title;
	
		prevObj.style.height = "2px";
		obj.style.height = "10px";
		if ( $thumbNo < $noThumbs ){
			$thumbNo++;			
		}
		else
		{
			$thumbNo = 0;
		}
	}
	
	
	$('.thumbs').click(function(){
	  	var $id = parseFloat($(this).children().attr('class'));
		if($thumbNo == 0){
			var prev = document.getElementById('thumbbar ' + ($noThumbs));
		}
			else {
			var prev = document.getElementById('thumbbar ' + ($thumbNo - 1));
		}
		$thumbNo = $id;
		
		var obj = document.getElementById('thumbbar ' + $thumbNo);
		prev.style.height = "2px";
		obj.style.height = "10px";
		
		
		$('.gallery').cycle($id);
		pause();

	})

	$('#video').hover(function(){
	  	pause();
	})
	
	$('#nav').click(function(){
	  	togglePause();
	})
	
	function pause(){
			$('#nav').addClass("pause");
			$('.gallery').cycle('pause');
			document.getElementById('nav').innerHTML= "PLAY";
	}
	
	function togglePause(){
		if( $('#nav').hasClass("pause") ) {
			$('#nav').removeClass("pause");
			$('.gallery').cycle('resume');
			document.getElementById('nav').innerHTML= "PAUSE";
		}
		else{
			$('#nav').addClass("pause");
			$('.gallery').cycle('pause');
			document.getElementById('nav').innerHTML= "PLAY";
		}
	}
	
	var tagged = "";

	$('#links a').click(function(){		
	   						 
	  if(animating == 0)
	  {
		  var tagClass = '.' + $(this).attr('class');
		  
		  var filt = $(this).attr('class');
		  
		  if($wall.children(tagClass).length > 0)
		  {
			  $(this).parent().parent().parent().children().each(function(){$(this).children().children().css("height","2px");})
			  
			  if(tagClass == tagged) {
				// show all hidden boxes
				$wall.children('.invis')
				  .toggleClass('invis').fadeIn(speed);
				tagged = ""
				$(this).parent().parent().parent().children().each(function(){$(this).children().children().css("height","10px");})
			  } else {  
				// hide visible boxes 
				$wall.children().not(tagClass).not('.invis')
				  .toggleClass('invis').fadeOut(speed);
				// show hidden boxes
				$wall.children(tagClass+'.invis')
				  .toggleClass('invis').fadeIn(speed);
				$(this).parent().parent().children().children().css("height","10px");
				tagged = tagClass;
			  }
			  animating = 1;
			  $wall.masonry();
		  }
	  }
	  return false;
	});	
	
	function aniFinish() {
		animating = 0;
	}
	
});