// v1.01 08-09-2007 ka z-index op 199 zodat pic altijd op voorgrond is

// make the DIV that we will need for the display of the picture
document.write('<div id="bigpic" style="visibility: hidden; height:0; width=0; position:absolute; left:0; top:0; z-index:199;" onClick="this.style.visibility= \'hidden\';"></div>');

BP_width	= 0;	//	anim remember values
BP_height	= 0;
BP_x		= 0;
BP_y		= 0;
BP_opacity  = 0;
BPT_width	= 0;	// this is the target we are trying to get to
BPT_height	= 0;
BP_effect   = 0;	// welk effect is aan de beurt? (bij anim = -1)

//************* showBigPic *********************************************
// picnaam = naam van grote plaatje
// w = breedte van grote plaatje
// h = hoogte
// e = event gegevens (stop altijd event in)
// anim = -1 = steeds wat anders
//         0 = niks
//         1 = opacity
//         2 = grow size from lefttop
//         3 = roll down
//         4 = curtain
// PAS OP! pas ook BP_effect tester aan als je een effect toevoegt! (zie hieronder)
function showBigPic(picnaam, w, h, e, anim)
{
	if (anim == -1)
	{
		anim = BP_effect;
		BP_effect++;
		if (BP_effect > 4) BP_effect = 0;	// max anims
	}
	cWidth  = document.body.clientWidth;
	cHeight = document.body.clientHeight;
	page_X_Offset = document.body.scrollLeft;
	page_Y_Offset = document.body.scrollTop;
	document.getElementById('bigpic').style.marginTop= 0;
	document.getElementById('bigpic').style.marginLeft= 0;
	document.getElementById('bigpic').innerHTML = '<img id="bigpicimg" src="' + picnaam + '" border="1" alt="Click here to close picture" style="filter:alpha(opacity=100); -moz-opacity:1.0">';
	if ( w == 0 ) w = document.getElementById('bigpicimg').width;
	if ( h == 0 ) h = document.getElementById('bigpicimg').height;
	if ( w < 25 ) w = 200;
	if ( h < 25 ) h = 200;
	zet_x = e.offsetX?(e.x):e.clientX;
	zet_y = e.offsetY?(e.y):e.clientY;
	zet_x += page_X_Offset;
	zet_y += page_Y_Offset;
	zet_x -= w/2;
	zet_y -= h/2;
	if ( (zet_x + w) > (cWidth  + page_X_Offset) ) zet_x = cWidth  + page_X_Offset - w - 15;
	if ( (zet_y + h) > (cHeight + page_Y_Offset) ) zet_y = cHeight + page_Y_Offset - h - 15;
	if (zet_x < page_X_Offset) zet_x = page_X_Offset;
	if (zet_y < page_Y_Offset) zet_y = page_Y_Offset;

	if (anim == 0) // no anim
	{
		document.getElementById('bigpic').style.left = zet_x;
		document.getElementById('bigpic').style.top = zet_y;
		document.getElementById('bigpic').style.width = w;
		document.getElementById('bigpic').style.height = h;
		document.getElementById('bigpic').style.visibility = "visible";
	}
	if (anim == 1) // opacity from invisible to visible
	{
		document.getElementById('bigpic').style.left = zet_x;
		document.getElementById('bigpic').style.top = zet_y;
		document.getElementById('bigpic').style.width = w;
		document.getElementById('bigpic').style.height = h;
		document.getElementById('bigpic').style.visibility = "visible";
		BP_opacity = 0;		// reset opacity
		if (navigator.appName.indexOf("Netscape")!=-1&&parseInt(navigator.appVersion)>=5)
		document.getElementById('bigpicimg').style.MozOpacity=0;
		else if (navigator.appName.indexOf("Microsoft")!=-1&&parseInt(navigator.appVersion)>=4)
		document.getElementById('bigpicimg').filters.alpha.opacity=0;
		lightup();		// and light up
	}
	if (anim == 2) // grow from lefttop
	{
		document.getElementById('bigpic').style.left = zet_x;
		document.getElementById('bigpic').style.top = zet_y;
		BP_width	= 0; // reset initial values (since anim could have been used already)
		BP_height	= 0;
		BPT_width	= w; // set the target sizes
		BPT_height	= h;
		document.getElementById('bigpic').style.width	= w;			// zet size van div
		document.getElementById('bigpic').style.height  = h;
		document.getElementById('bigpicimg').width		= 0;			// maak plaatje 0 x 0
		document.getElementById('bigpicimg').height		= 0;
		document.getElementById('bigpic').style.visibility= "visible";
		open_width_height();
	}
	if (anim == 3) // Roll down
	{
		document.getElementById('bigpic').style.left = zet_x;
		document.getElementById('bigpic').style.top = zet_y;
		BP_height	= 0;	// reset initial values (since anim could have been used already)
		BPT_height	= h;
		document.getElementById('bigpic').style.width	= w;			// zet size van div
		document.getElementById('bigpic').style.height  = h;
		document.getElementById('bigpicimg').width		= w;			// maak plaatje w x 0
		document.getElementById('bigpicimg').height		= 0;
		document.getElementById('bigpic').style.visibility= "visible";
		speed = 2;
		do_roll_down();
	}
	if (anim == 4) // curtain
	{
		document.getElementById('bigpic').style.left = zet_x;
		document.getElementById('bigpic').style.top = zet_y;
		BP_width	= 0; // reset initial values (since anim could have been used already)
		BPT_width	= w; // set the target sizes
		document.getElementById('bigpic').style.width	= w;			// zet size van div
		document.getElementById('bigpic').style.height  = h;
		document.getElementById('bigpicimg').width		= 0;			// maak plaatje 0 x h
		document.getElementById('bigpicimg').height		= h;
		document.getElementById('bigpic').style.visibility= "visible";
		speed = 2;
		do_curtain();
	}
}

function lightup()
{
	BP_opacity += 10;																	// add 10 to opacity value
	if (navigator.appName.indexOf("Netscape")!=-1&&parseInt(navigator.appVersion)>=5)
	document.getElementById('bigpicimg').style.MozOpacity=BP_opacity/100;				// in mozilla set 0.0 - 1.0
	else if (navigator.appName.indexOf("Microsoft")!=-1&&parseInt(navigator.appVersion)>=4)
	document.getElementById('bigpicimg').filters.alpha.opacity=BP_opacity;				// in MSIE set 0 - 100
	if(BP_opacity < 100) setTimeout('lightup()', 50);									// if not there repeat in .1 secs
}

function open_width_height()
{
	BP_width	+= 50;											// add 50 to size
	if (BP_width > BPT_width) BP_width = BPT_width;				// if larger than target use target
	BP_height	+= 50;											// add 50 to size
	if (BP_height > BPT_height) BP_height = BPT_height;			// if larger than target use target
	document.getElementById('bigpicimg').width = BP_width;
	document.getElementById('bigpicimg').height	= BP_height;
	if ( (BP_height != BPT_height) || (BP_width != BPT_width) ) setTimeout('open_width_height()', 25); // if more to go repeat
}

function do_roll_down()
{
	BP_height += speed;
	speed = speed * 2;											// double roll_down speed
	if (BP_height > BPT_height) BP_height = BPT_height;			// if larger than target use target
	document.getElementById('bigpicimg').height	= BP_height;
	if (BP_height != BPT_height) setTimeout('do_roll_down()', 25); // if more to go repeat
}

function do_curtain()
{
	BP_width += speed;
	speed = speed + 4;											// increase speed
	if (BP_width > BPT_width) BP_width = BPT_width;				// if larger than taget use target
	document.getElementById('bigpicimg').width = BP_width;
	if ( BP_width != BPT_width ) setTimeout('do_curtain()', 25); // if more to go repeat
}

