var images = [];
var imgLoadedCount = 0;

var IMG_TYPE = {};
IMG_TYPE.WIDE   = "wide";
IMG_TYPE.TALL   = "tall";
IMG_TYPE.SQUARE = "square";

var imgBG = [];
imgBG[IMG_TYPE.WIDE] = DIR_WORKSPACE + "/images/frame_wide.png";
imgBG[IMG_TYPE.TALL] = DIR_WORKSPACE +"/images/frame_tall.png";
imgBG[IMG_TYPE.SQUARE] = DIR_WORKSPACE + "/images/frame_square.png";


$(function(){
	
	$(document).ready( ready );
	
	/* Slideshow */
	
	var ss = {};
	ss.prevBtn = "";
	ss.nextBtn = "";
	ss.wrapper = "";
	ss.img_w = 300;
	ss.img_h = 300;
	ss.step_time = 500;
	ss.currNum = 1;
	ss.toNum = 2;
	ss.maxNum = 0;
	ss.minNum = 0;
	ss.viewW = 0;
	ss.slides = [];
	ss.slideData = [];
	ss.fullWidth = 0;
	
	function initSlideshow(wrapper, prevBtn, nextBtn, viewportWidth) {
		ss.viewW = (viewportWidth == null) ? $(wrapper).parent() : viewportWidth;
		
		ss.wrapper = wrapper;
		ss.prevBtn = prevBtn;
		ss.nextBtn = nextBtn;
		$(ss.prevBtn).click( prevClick );
		$(ss.nextBtn).click( nextClick )
		
		ss.slides = $(ss.wrapper).find('.slide');
		
		setSlideData();
		
		ss.maxNum = ss.slides.length-1;
		ss.minNum = 0;
		ss.currNum = 1;
		
	}
	
	function ready() {
		
		images = $('#slides-wrapper li .image');
		for ( var i = 0; i < images.length; i++ ) 
		{
			
			if( images[i].complete ) {
				prepareImage(images[i]);
			} else {
				$(images[i]).load( imgComplete );
			}
		}
		if(images.length <= 3) {
			$('#left, #right').addClass('invisible');
		}
		
		
	}
	
	function imgComplete(event) {
		prepareImage(event.target);
	}
	
	function prepareImage(img) {
		imgLoadedCount++;
		var imgW = $(img).width();
		var imgH = $(img).height();
		var frame = $(img).parent().find('.frame');
		var figure = $(img).parent();
		
		
		
		var imgType = IMG_TYPE.SQUARE;
		
		if( imgW > imgH ) {
			imgType = IMG_TYPE.WIDE;
		} 
		else if ( imgW < imgH ) {
			imgType = IMG_TYPE.TALL;
		}
		
		$(frame).attr('src', imgBG[imgType]);
		
		var frameW = imgW+38;
		var frameH = imgH+38;
		if(frameW == 0) { frameW = imgW+38; frameH = imgH+38; };
		
		$(frame).attr('width', frameW );
		$(frame).attr('height', frameH );
		
		$(img).parent().width( frameW );
		$(img).parent().height( frameH );
		
		
		$(img).attr('width', imgW*0.78);
		$(img).attr('height', imgH*0.78);
		
		img.width = imgW;
		img.height = imgH;
		
		$(figure).css('top', centeredTop($(figure).height(), $(figure).parent().height()) +'px');
		
		if( imgLoadedCount == images.length ) {
			initSlideshow( 
				$('#slides-wrapper'),
				$('.slideshow-prev'), 
				$('.slideshow-next') );
		}
		
		$(frame).fadeIn(1000);
		$(img).fadeIn(1000);
		
	}
	
	function centeredTop(imgH, parentH) {
		var top = (parentH - imgH) / 2;
		return top;
	}
	
	function setSlideData() {
		var poscount = 0;
		var xcount = 0;
		
		poscount = $(ss.slides[0]).width() + $(ss.slides[1]).width();
		poscount = ss.slides[0].clientWidth + ss.slides[1].clientWidth;
		
		for ( var i = 0; i < ss.slides.length; i++)
		{	
			ss.slideData[i] = {};
			ss.slideData[i].width = ss.slides[i].clientWidth;
			ss.slideData[i].imgWidth = $(ss.slides[i]).find('img').width();
			
			poscount -= ss.slideData[i].width;
			xcount += ss.slideData[i].width;
			ss.slideData[i].xPos = poscount;
			
			
		}
		ss.fullWidth = xcount;
		
		$(ss.wrapper).width(ss.fullWidth);
	}
	
	function prevClick(event) {
		ss.toNum = (ss.currNum-1 >= ss.minNum) ? ss.currNum-1 : ss.maxNum;
		slideTo( ss.toNum );
	}
	
	function nextClick(event) {
		ss.toNum = (ss.currNum+1 <= ss.maxNum) ? ss.currNum+1 : ss.minNum;
		slideTo( ss.toNum );
	}
	
	function slideTo(toNum) {
		//$(ss.slides[ss.currNum]).find('figure').effect("scale", { percent: 80, direction: 'both' }, ss.step_time);	
		
		// OUT $(ss.slides[ss.currNum]).find('figure').animate( {width:"200px"}, ss.step_time);
		
		$(ss.wrapper).animate( {marginLeft: ss.slideData[toNum].xPos + 'px' }, ss.step_time );
		//$(ss.slides[0]).animate( {width: "200px"} );
		//$(ss.slides[toNum]).find('figure').effect("scale", { percent: 125, direction: 'both' }, 200);
		
		
		// IN $(ss.slides[toNum]).find('figure').animate( {width:"276px"}, ss.step_time);
	
		ss.currNum = toNum;
	}
});