// constants
var dX = -107;


// elements
var links1 = jQuery('#digexgallery_thumbs1 a');
// ui elements 
var next1 = jQuery('#digexgallery_next1');
var back1 = jQuery('#digexgallery_back1');
var playlist1 = jQuery('#digexgallery_list1');
var playlistWrap1 = jQuery('#digexgallery_listWrap1');
var container1 = jQuery("#digexgallery_player1");
container1.addClass('jsenabled');

// status vars
var current1 = null;
var pos1 = 0;
var index1 = 0;
var total1 = links1.length;

// shuffle the media before adding event handlers
playlist1.shuffle();

// bind our show_handler function to the click event of each thumbnail
for(var i=0;links1[i];i++){
	jQuery(links1[i]).bind("click", show_handler(jQuery(links1[i]).attr('id')));
}

/**
* this function returns an anonymous handler function to display a specific media item in the player
* @param i the identifier of the slide to show, is hardcoded into the returned function as slides1[i]
* @return an anonymous event handler to show a specific item (show(i))
**/
function show_handler(i){
	return function(e){
		if (current1 != null) current1.removeClass("current");
		current1 = jQuery(this);
		container1.html(slides1[i]);
		current1.addClass("current");
		return false;
	};
}
// setup all the buttons and stuff
function init_ui(){
	back1.hide();
	next1.click(function(e){
		move1(4);
	})
	back1.click(function(e){
		move1(-4);
	})

	// little animations to pull out the nav buttons
	jQuery("#digexgallery1 .digexgallery_nav").hover(function(e){
		console.log("hover");
		jQuery(this).animate({ width:"16px" }, 100);
	}, function(e){
		_this = jQuery(this);
		// if the button dissapears during the hover, dont animate
		if (_this.is(":visible")) _this.animate({ width:"6px" }, 100); 
		else _this.width('6px');
	})
	
	if (total1<=4) next1.fadeOut(500);
}

function move1(x){
	//console.log("pos1: "+pos1+" index1: "+index1+" total1: "+total1);
	if (index1+4+x>total1){
		move1(total1-(index1+4));
	} else if (index1+x<0){
		move1(0-index1);
	} else {
		playlistWrap1.animate({ marginLeft:(pos1+dX*x)+"px"}, 1500);		
		pos1+=dX*x;
		index1+=x;
		if (x>0){
			if ((total1-index1)<=4){ next1.fadeOut(500); }
			if (index1>0){ back1.fadeIn(500); }
		} else if (x<0){
			if (index1==0){ back1.fadeOut(500); }
			if (index1<total1){ next1.fadeIn(500);}
		}
		console.log("moved! new index1: "+index1 +"total1: "+total1+"test: ");	
	}
}

init_ui();
jQuery('#digexgallery_thumbs1 a:first').click();