//vars
var brpath = "/media/img/pics/";
var brint;
var mouseX = 0;
var mouseY = 0;
var brarr = new Array();
var curBrPic;
var brload = 0;

//functions
function loadBrThumbs(){
	var thc = $('#brthcont');
	//get thumb images
	var imgs = '';
	for(i=0; i<brarr.length; i++){
		imgs = imgs+'<img src="'+brpath+'_thumb/'+brarr[i]+'" alt="'+i+'" title="" />';
	}
	thc.html(imgs);
	//set btn
	$('#brthcont img').bind('mouseenter',function(){$(this).css('opacity','0.8');});
	$('#brthcont img').bind('mouseleave',function(){$(this).css('opacity','1');});
	$('#brthcont img').bind('click',function(){loadBrMax($(this).attr('alt'));});
	//start slider interval
	startBrThumbs();
}

function setBrThumbs(){
	var hc = $('#brpic').height();
	var ht = 150;
	var th = $('#brthumbs');
	var y = (hc/2-ht);
	th.css('padding',y+'px 0 0 0');
	//set nav of brmax
	$('#brmaxnav').css('top',y+'px');
}

function startBrThumbs(){
	$('#brpic').bind('mousemove', function(e) {
      mouseX = e.pageX
      mouseY = e.pageY-$(document).scrollTop();
     });
	brint = setInterval(brUpdate,25);
}

function stopBrThumbs(){
	$('#brpic').unbind('mousemove');
	clearInterval(brint);
}

function brUpdate(){
	var thc = $('#brthcont');
	var margin = 400;
	var minX = margin;
	var maxX = $('#brpic').width()-margin;
	var thY = parseInt($('#brthumbs').css('paddingTop').replace('px',''));
	var sp = 3;
	//alert(thY+' < '+mouseY);
	//check mouseposition
	if(mouseY>thY && mouseY<thY+300){
		var thcX = parseInt(thc.css('left').replace('px',''));
		var thcXmin = $('#brpic').width()-thc.width();
		//alert(thcX+' > '+thcXmin);
		var thcXmax = 0;
		if(mouseX<minX && thcX<thcXmax){
			var spN = Math.round((minX-mouseX)/10)+sp;
			thc.css('left',(thcX+spN)+'px');
		} else if(mouseX>maxX && thcX>thcXmin){
			var spN = Math.round((mouseX-maxX)/10)+sp;
			thc.css('left',(thcX-spN)+'px');
		}
	}
}
function isIE6(){
	if(jQuery.browser.msie && jQuery.browser.version<7){
		return true;
	} else {
		return false;
	}
}
function loadBrMax(pic){
	//set loader
	if(!isIE6()){
		$('#brmaxpic img').attr('src','/media/img/loader.gif').css('height','auto');
	}
	//
	curBrPic = parseInt(pic);
	var img = brpath+'_large/'+brarr[pic];
	var max = $('#brmax');
	setBrMax();
	stopBrThumbs();
	$('#brthumbs').hide();
	max.show();
	if(!isIE6()){
		$('#brmaxpic img').attr('src',img); 
	}else{
		$('#brmaxpic img').remove();
		$('#brmaxpic').html('<img src="'+img+'" title="terug naar overzicht" />');
		//set tooltip
		$('#brmaxpic img').tooltip({
			showURL	: false, 
			track	: true,
			fade	: 250
		});
	}
	$('#brmaxpic img').load(function() {
		setBrMax();
    });
	if(!isIE6()){
		clearInterval(brload);
		brload = setInterval(function(){	
											setBrMax();
											if($('#brmaxpic img').width()>100){
												setBrMax();
												clearInterval(brload);
											}
										},100);
	}
	//set brnav
	var imgLeft = brpath+'_thumb/'+brarr[getPrevBrMax()];
	var imgRight = brpath+'_thumb/'+brarr[getNextBrMax()];
	$('#brmaxleft .brth').attr('src',imgLeft);
	$('#brmaxright .brth').attr('src',imgRight);
}

function closeBrMax(){
	$('#brmax').hide();
	$('#brthumbs').show();
	startBrThumbs();
}

function getNextBrMax(){
	if(curBrPic+1<brarr.length){
		return curBrPic+1;
	} else {
		return 0;
	}
}

function getPrevBrMax(){
	if(curBrPic-1>0){
		return curBrPic-1;
	} else {
		return brarr.length-1;
	}
}

function setBrMax(){
	var maxPic = $('#brmaxpic img');
	maxPic.css({'height':'auto','width':'auto'});
	var mpH = maxPic.height();
	var mpW = maxPic.width();
	var hc = $('#brpic').height();
	var wc = $('#brpic').width();
	var wlb = $('#brmaxleft').width();
	var wrb = $('#brmaxright').width();
	if(wlb>wrb){
		var maxW = wc-(2*wlb)-40;
	} else {
		var maxW = wc-(2*wrb)-40;
	}
	var mpY = (hc-160-mpH)/2;
	if(mpH<hc-80){
		if(mpW>maxW){
			maxPic.width(maxW);
			mpY = (hc-160-maxPic.height())/2;
		}
		maxPic.css('margin',(mpY)+'px auto 0 auto');
	} else {
		maxPic.height(hc-80);
		maxPic.css('margin','0 auto 0 auto');
	}
	
}

function openBrPic(arr){
	//hide content
	$('#centered').hide();
	//images array
	brarr = arr;
	//set html of overlay
	var html = '<div id="brpic"><a href="javascript:closeBrPic();" title="terug naar site" class="right"><img src="/media/img/br_close.gif" /></a><div id="brthumbs"><div id="brthcont"></div></div><div id="brmax"><div id="brmaxpic"><img src="/media/img/loader.gif" title="terug naar overzicht" /></div><div id="brmaxnav"><div id="brmaxleft" class="left" title="vorige foto"><img src="" alt="" class="brth"><img src="/media/img/br_arrleft.gif" alt="" title="vorige foto"/></div><div id="brmaxright" class="right" title="volgende foto"><img src="/media/img/br_arrright.gif" alt=""  title="volgende foto" /><img src="" alt="" class="brth"></div></div></div></div>';
	$('#overlay').html(html);
	$('#overlay').show();
	//set tooltip
	$('#brmaxpic img, #brmaxleft, #brmaxright').tooltip({
		showURL	: false, 
		track	: true,
		fade	: 250
	});
	//set position of thumbs
	setBrThumbs();
	//load thumbs
	loadBrThumbs(brarr);
	//
	$('#brmaxleft, #brmaxright').bind('mouseenter',function(){$(this).css('opacity','0.8');});
	$('#brmaxleft, #brmaxright').bind('mouseleave',function(){$(this).css('opacity','1');});
	$('#brmaxleft').bind('click',function(){loadBrMax(getPrevBrMax())});
	$('#brmaxright').bind('click',function(){loadBrMax(getNextBrMax())});
	$('#brmaxpic').bind('click',function(){closeBrMax();});
}

function closeBrPic(){
	//show content
	$('#centered').show();
	//
	stopBrThumbs();
	$('#brpic').remove();
	$('#overlay').hide();
}