/* 
 * [a] Stijn Van Minnebruggen
 * [c] Oskar D
 * [s] www.oskard.be
 * 
*/

// SCROLLBAR EFFECTS

var currPos		= 50;	// the current position (remind the left arrow)
var itemW		= 170;	// the width of one item

var screenW;
var screenC;
var numItems;
var itemsW;

function getScreenW() {
	if(typeof( window.innerWidth ) == 'number') { // non-IE
		screenW = window.innerWidth;
	} else if(document.documentElement && document.documentElement.clientWidth) { // IE6 + in 'standards compliant mode'
		screenW = document.documentElement.clientWidth;
	} else if(document.body && document.body.clientWidth) { // IE4 compatible
		screenW = document.body.clientWidth;
	}
	screenC = screenW/2;
}

function resetValues() {
	getScreenW();
	itemsW = (numItems*itemW);
	var newPos = screenC - (itemsW / 2) - 50; // 50 for the left arrow
	$('scrollItems').effect('margin-left').start(newPos);
	currPos = newPos;
}

function moveBar(direction) {
	var newPos = currPos+(direction*itemW);
	$('scrollItems').effect('margin-left').start(newPos);
	currPos = newPos;
}

function openBig(id, i) {
	// set vars
		var item	= "item_"+id;
		var img		= "img_"+id;
		var img_div	= "img_div_"+id;
		var info	= "info_"+id;
	// get image size
		var myImg	= new Image();
		myImg.src	= $(img).src;
		var imgW	= myImg.width;
		var imgH	= myImg.height;
	// close all other
		var list = $$('#scrollItems span');
		list.each(function(element) { if(element.id != item) {
			element.effect('width').start((itemW-40));
			element.effect('height').start(150);
			var currImg = "img_"+element.id.replace('item_', '');
			$(currImg).effect('width').start(123);
			var currImgDiv = "img_div_"+element.id.replace('item_', '');
			$(currImgDiv).effect('width').start(123);
			var currItem = "info_"+element.id.replace('item_', '');
			$(currItem).style.display = 'none';
		}});
	// open the current one
		var newItemW = imgW+150;
		$('scrollLeft').effect('height').start(imgH-40);
		$(item).effect('width').start(newItemW);
		$(item).effect('height').start(imgH+40);
		$('scrollBar').effect('height').start(imgH+40);
		$(img).effect('width').	start(imgW);
		$(img_div).effect('width').start(imgW);
		setTimeout(function() { $(info).style.display='block'; }, 500);
	// reposition the scrollbar
		itemPos = ((i-1)*itemW); // position of this item in the list
		var newPos = screenC - itemPos - 50 - (imgW/2); // 50 for the left arrow
		$('scrollItems').effect('margin-left').start(newPos);
		currPos = newPos;
}


// TEXTBALLOON FUNCTIONS

var IE = document.all?true:false
document.onmousemove = getMouseXY;
var mouse_x = 0
var mouse_y = 0

function getMouseXY(e) {
	if (IE) { // grab the x-y pos.s if browser is IE
		varX = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft
		varY = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop
		mouse_x = event.clientX + varX;
		mouse_y = event.clientY + varY;
	} else {  // grab the x-y pos.s if browser is NS
		mouse_x = e.pageX;
		mouse_y = e.pageY;
	}  
	if (mouse_x < 0){mouse_x = 0}
	if (mouse_y < 0){mouse_y = 0}
	$('balloon').style.top = mouse_y-65+"px";
	$('balloon').style.left = mouse_x-80+"px";
	$('balloonTxt').style.top = mouse_y-65+"px";
	$('balloonTxt').style.left = mouse_x-80+"px";
	return true;
}

function setBalloon(visible, artist, work) {
	$('balloon').style.display = visible;
	$('balloonTxt').style.display = visible;
	$('balloonArtist').innerHTML = artist;
	$('balloonWork').innerHTML = work;
}