/*
var objLayer='';						- 
var intClipHeight = 264; 				- de hoogte van een pagina, de layer waar de clipping overheen ligt mag geen hoogte in css hebben
var intClipTop = 0;						- altijd 0, is nl de bovenkant van de layer
var intClipBottom = intClipHeight;		- het einde van de eerste pagina
var layerTop = 40;						- de positie van de layer die in css gedefinieerd is.
var layerWidth = '';					- wordt in de init functie gezet, bevat de breedte van de layer
*/


function initClipping(layerId){
	objLayer = document.getElementById(layerId);
	if(!objLayer){return;}
	layerWidth = objLayer.offsetWidth;
	//als de huidige inhoud van de layer kleiner is dan de clipbottom, dan clipbottom resetten naar de inhoud van de layer
	intClipBottom = (intClipBottom > objLayer.offsetHeight ? objLayer.offsetHeight : intClipBottom);
	objLayer.style.clip="rect("+intClipTop+"px,"+layerWidth+"px,"+intClipBottom+"px,0px)";

}

function moveForward(){
	//verschuif de layer omhoog 
	layerTop = layerTop-intClipHeight;	
	objLayer.style.top = (layerTop)+'px';

	//verschuif de clipping omlaag (clipping zit nl vast aan layer en die is zojuist omhooggeschoven)	
	intClipBottom = intClipBottom + intClipHeight;
	intClipTop = intClipTop + intClipHeight;
	objLayer.style.clip="rect("+intClipTop+"px,"+layerWidth+"px,"+intClipBottom+"px,0px)";
}

function moveBackward(){
	//verschuif de layer omlaag 
	layerTop = layerTop+intClipHeight;	
	objLayer.style.top = (layerTop)+'px';

	//verschuif de clipping omlaag (clipping zit nl vast aan layer en die is zojuist omhooggeschoven)	
	intClipBottom = intClipBottom - intClipHeight;
	intClipTop = intClipTop - intClipHeight;
	objLayer.style.clip="rect("+intClipTop+"px,"+layerWidth+"px,"+intClipBottom+"px,0px)";
}

function toggleScrollButtons(){

	document.getElementById('scrollforward').style.display='none';
	document.getElementById('scrollforward-grey').style.display='inline';
	document.getElementById('scrollback').style.display='none';
	document.getElementById('scrollback-grey').style.display='inline';
	
	if(intClipBottom < objLayer.offsetHeight)
	{
		document.getElementById('scrollforward').style.display='inline';
		document.getElementById('scrollforward-grey').style.display='none';		
	}
	
	if(layerTop<0)
	{
		document.getElementById('scrollback').style.display='inline';
		document.getElementById('scrollback-grey').style.display='none';
	}	
}


/*==============picture settings==============*/
function initPictureClipping(layerId){
	objPictureLayer = document.getElementById(layerId);
	if(!objPictureLayer){return;}
	PicturelayerWidth = objPictureLayer.offsetWidth;
	//als de huidige inhoud van de layer kleiner is dan de clipbottom, dan clipbottom resetten naar de inhoud van de layer
	intPictureClipBottom = (intPictureClipBottom > objPictureLayer.offsetHeight ? objPictureLayer.offsetHeight : intPictureClipBottom);
	objPictureLayer.style.clip="rect("+intPictureClipTop+"px,"+PicturelayerWidth+"px,"+intPictureClipBottom+"px,0px)";
}

function movePictureForward(){
	//verschuif de layer omhoog 
	PicturelayerTop = PicturelayerTop-intPictureClipHeight;	
	objPictureLayer.style.top = (PicturelayerTop)+'px';

	//verschuif de clipping omlaag (clipping zit nl vast aan layer en die is zojuist omhooggeschoven)	
	intPictureClipBottom = intPictureClipBottom + intPictureClipHeight;
	intPictureClipTop = intPictureClipTop + intPictureClipHeight;
	objPictureLayer.style.clip="rect("+intPictureClipTop+"px,"+PicturelayerWidth+"px,"+intPictureClipBottom+"px,0px)";
}

function movePictureBackward(){
	//verschuif de layer omlaag 
	PicturelayerTop = PicturelayerTop+intPictureClipHeight;	
	objPictureLayer.style.top = (PicturelayerTop)+'px';

	//verschuif de clipping omlaag (clipping zit nl vast aan layer en die is zojuist omhooggeschoven)	
	intPictureClipBottom = intPictureClipBottom - intPictureClipHeight;
	intPictureClipTop = intPictureClipTop - intPictureClipHeight;
	objPictureLayer.style.clip="rect("+intPictureClipTop+"px,"+PicturelayerWidth+"px,"+intPictureClipBottom+"px,0px)";
}



function togglePictureScrollButtons(){
	document.getElementById('scrollbackPicture').style.display='none';
	document.getElementById('scrollback-greyPicture').style.display='inline';
	document.getElementById('scrollforwardPicture').style.display='none';
	document.getElementById('scrollforward-greyPicture').style.display='inline';

	if(intPictureClipBottom < objPictureLayer.offsetHeight){
		document.getElementById('scrollforwardPicture').style.display='inline';
		document.getElementById('scrollforward-greyPicture').style.display='none';		
	}
	
	if(PicturelayerTop<0)
	{		
		document.getElementById('scrollbackPicture').style.display='inline';
		document.getElementById('scrollback-greyPicture').style.display='none';
	}
}