var J = jQuery.noConflict();

//init the pagination vars
var ipp = 8; //images per page
var thumbs; //thumbnail object
var tPG; //total pages

var stPG = 1; //start page
var cPG = 1; //current page

var prev; //previous button
var next; //next button


J(document).ready(function(){
	
	J('#gallery').addClass('gallery-list'); // adds new class name to maintain degradability
	
	//install a click option on the title of the page to show the content again
	J('#rightFlash h1').css('cursor','pointer').click(function(){
		galShowCopy();
	});
	
	J('ul.gallery-list').galleria({
		history   : true, // activates the history object for bookmarking, back-button etc.
		clickNext : false, // helper for making the image clickable
		insert    : '#main_image', // the containing selector for our main image
		onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
			
			//first things first, let's hide the body copy
			J('#page_content').hide();
			J('#main_image').show();
			
			// fade in the image & caption
			image.css('display','none').fadeIn(1000);
			caption.css('display','none').fadeIn(1000);
			
			// fetch the thumbnail container
			var _li = thumb.parents('li');
			
			// fade out inactive thumbnail
			_li.siblings().children('img.selected').fadeTo(500,0.3);
			
			// fade in active thumbnail
			thumb.fadeTo('fast',1).addClass('selected');
			
			// add a title for the clickable image
			image.attr('title','View Full-Screen');
			
			//check if we're in IE (mainly version 6 because it won't recognize the max-height max-width css on the full-size images)
			if( J.browser.msie ) {
				//get the parent height/width
				var pW = parseInt(image.parent().css('width')) - 6;
				var pH = parseInt(image.parent().css('height')) - 6;
				
				//get the image height/width
				var iW = parseInt(image.css('width'));
				var iH = parseInt(image.css('height'));
				
				//find the overextended dimensions
				var overX = iW / pW;
				var overY =  iH /  pH;
				
				//check image orientation
				if( overX > overY && iW > pW ) { //image is wider on X axis and larger than the parent
					
					var mult = pW / iW;
					
					//calculate the new height
					var nH = Math.round( parseInt(image.css('height')) * mult );
					
					image.css('width', pW); //restrict width to parent height
					image.css('height', nH); //set the new height
					
				} else if( overY > overX && iH > pH ) { //image is wider on Y axis and larger than parent
					var mult = pH / iH;
					
					//calculate the new width
					var nW = Math.round( parseInt(image.css('width')) * mult );
					
					image.css('height', pH); //restrict height to parent height
					image.css('width', nW); //set the new width
				}
			}
			
			image.click(function(e){
				//
				Mediabox.open([[image.attr('src'),caption.html(),image.css('width')+' '+image.css('height')]],0);
				e.preventDefault();
			});
		},
		onThumb : function(thumb) { // thumbnail effects goes here
			
			// fetch the thumbnail container
			var _li = thumb.parents('li');
			
			// if thumbnail is active, fade all the way.
			var _fadeTo = _li.is('.active') ? '1' : '0.3';
			
			// fade in the thumbnail when finnished loading
			thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
			
			// hover effects
			thumb.hover(
				function() { thumb.fadeTo('fast',1); },
				function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
			)
		}
	});
	
	//set up pagination
	ipp = 8; //images per page
	thumbs = J('ul.gallery-list li');
	
	tPG = Math.ceil( thumbs.length / ipp ); //total pages
	
	if(tPG > 1){ //we have more than 1 page
		stPG = 1; //start page
		
		var c = 1; //cur item
		cPG = 1; //cur page
		
		thumbs.each(function(){
			J(this).addClass('page'+cPG);
			if( J(this).hasClass('active')){
				stPG = cPG; //set the start page
			}
			if(c == ipp){
				c = 1; //reset item count
				cPG++; //inc page
			} else {
				c++;
			}
		});
		
		//reinitialize the current page to the starting page
		cPG = stPG;
		
		thumbs.not('[class~=page'+stPG+']').fadeTo(0,0.01).css({
			position: 'absolute',
			left: '-5000px',
			top: '-5000px'
		});
		
		//init the pagination holders
		
		J('ul.gallery-list').parent().append('<div id="pagination"><a href="javascript:void(0);" class="prev">&lsaquo;&lsaquo;Previous</a><a href="javascript:void(0);" class="next">Next&rsaquo;&rsaquo;</a></div>');
		
		prev = J('#pagination a.prev');
		next = J('#pagination a.next');
		
		//set up the click events
		next.click(function(e){
			//
			galNext();
			e.stopPropagation();
		});
		
		prev.click(function(e){
			//
			galPrev();
			e.stopPropagation();
		});
		
		galUpdPag();
		
	}
});

function galShowCopy(){
	window.setTimeout("J('#page_content').fadeIn(500);",510);
	J('#main_image').fadeOut(500);
	//fade all the thumbnails
	J('ul.gallery-list li').removeClass('active').find('img[class~=selected]').removeClass('selected').fadeTo(500,0.3);
}

function galNext(){
	if(cPG < tPG){
		cPG = cPG + 1;
	}
	galUpdPag();
	galUpdThumbs()
}

function galPrev(){
	if(cPG > 1){
		cPG = cPG - 1;
	}
	galUpdPag();
	galUpdThumbs()
}

function galUpdPag(){
	//check the prev next and disable if needed
	if(cPG > 1){
		prev.fadeIn(500);
	} else {
		prev.fadeOut(500);
	}
	
	if(cPG < tPG){
		next.fadeIn(500);
	} else {
		next.fadeOut(500);
	}
}

function galUpdThumbs(){
	//fade out all thumbs
	thumbs.fadeTo(500,0.01);
	window.setTimeout('galMoveOut();',600);
	window.setTimeout('galFadeIn();',600);
}

function galMoveOut(){
	thumbs.css({
		position: 'absolute',
		left: '-5000px',
		top: '-5000px'
	});
}

function galFadeIn(){
	thumbs.filter('[class~=page'+cPG+']').fadeTo(500,1).css({
		position: 'static',
		left: '',
		top: ''
	});
}