//
// Configuration
//

// Global vartiables
var g_strLoadingImage = '/Images/Icons/iconClose.png';
var g_strCloseButton = '/Images/Icons/iconClose.png';
var g_intPageScroll = 0;
var g_intPageWidth = 0;
var g_intPageHeight = 0;
var g_intWindowWidth = 0;
var g_intWindowHeight = 0;
var g_intXScroll = 0;
var g_intYScroll = 0;
var g_intStanWidth = 740;
var g_intStanHeight = 520;
var g_strImages = new Array();

var maxWidthImage = 800; //800 is max width show image in pixels*
var maxHeightImage = 800; //800 is max width show image in pixels*

//Set g_intPageScroll Y page scroll value
function getPageScroll()
{
	if (self.pageYOffset) {
		g_intPageScroll = self.pageYOffset;
	} else if (document.documentElement && document.documentElement.scrollTop){
		// Explorer 6 Strict
		g_intPageScroll = document.documentElement.scrollTop;
	} else if (document.body) {
	    // all other Explorers
		g_intPageScroll = document.body.scrollTop;
	}
	return g_intPageScroll;
}

//Set page width, height and window width, height
function getPageSize()
{
	if (window.innerHeight && window.scrollMaxY) {	
		g_intXScroll = document.body.scrollWidth;
		g_intYScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ 
	    // all but Explorer Mac
		g_intXScroll = document.body.scrollWidth;
		g_intYScroll = document.body.scrollHeight;
	} else { 
	    // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		g_intXScroll = document.body.offsetWidth;
		g_intYScroll = document.body.offsetHeight;
	}
	
	var g_intWindowWidth, g_intWindowHeight;
	if (self.innerHeight) {
	    // all except Explorer
		g_intWindowWidth = self.innerWidth;
		g_intWindowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { 
	    // Explorer 6 Strict Mode
		g_intWindowWidth = document.documentElement.clientWidth;
		g_intWindowHeight = document.documentElement.clientHeight;
	} else if (document.body) { 
	    // other Explorers
		g_intWindowWidth = document.body.clientWidth;
		g_intWindowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(g_intYScroll < g_intWindowHeight)
		g_intPageHeight = g_intWindowHeight;
	else
		g_intPageHeight = g_intYScroll;

	// for small pages with total width less then width of the viewport
	if(g_intXScroll < g_intWindowWidth){	
		g_intPageWidth = g_intWindowWidth;
	} else {
		g_intPageWidth = g_intXScroll;
	}
	
	var l_aryPageSize = new Array(g_intPageWidth,g_intPageHeight,g_intWindowWidth,g_intWindowHeight) 
	return l_aryPageSize;
}

//Wait function, Bad function!!
function Wait(p_intMilliSec)
{
    var l_intCounterX = 0;
    var l_datDate = new Date();
    var l_datCurrentDate = new Date();
    while(l_datCurrentDate-l_datDate < p_intMilliSec)
    {
        l_datCurrentDate = new Date();
        l_intCounterX++;
    }
}

function SetLightBox()
{
    var l_objBody = document.getElementsByTagName("body").item(0);
    
    if (!document.getElementsByTagName){ return; }
    var l_objAnchors = document.getElementsByTagName("a");
    var l_intCounter = 0;
    var l_intCounter2 = 0;
    
    //Set LightBox Array list
    while(l_intCounter < l_objAnchors.length)
    {
        var l_objAnchor = l_objAnchors[l_intCounter];
        if(l_objAnchor.getAttribute('rel') && l_objAnchor.getAttribute('rel') == 'LightBox')
        {
            l_objAnchor.setAttribute('ImgNr', l_intCounter2);
            l_objAnchor.onclick = function () {return ShowLightBox(this);}
            g_strImages[l_intCounter2] = l_objAnchor;
            l_intCounter2++;
        }
        l_intCounter++;
    }

    //Create Overlay
    var l_objOverlay = document.createElement("div");
    l_objOverlay.setAttribute('id','Overlay');
    l_objOverlay.style.display = 'none';
    l_objOverlay.style.position = 'absolute';
    l_objOverlay.style.top = '0';
    l_objOverlay.style.left = '0';
    l_objOverlay.style.zIndex = '300';
    l_objOverlay.style.width = '100%';
    
    l_objBody.insertBefore(l_objOverlay, l_objBody.firstChild);

    //Create LightBox
    var l_objLightBox = document.createElement("div");
	l_objLightBox.setAttribute('id','LightBox');
	l_objLightBox.style.display = 'none';
	l_objLightBox.style.position = 'absolute';
	l_objLightBox.style.zIndex = '310';	
	l_objBody.insertBefore(l_objLightBox, l_objOverlay.nextSibling);
	
    var l_imgPreloadCloseButton = new Image();
    //Create Close button
    l_imgPreloadCloseButton.onload = function()
    {
        var l_objCloseButton = document.createElement("img");
        l_objCloseButton.src = g_strCloseButton;
        l_objCloseButton.setAttribute('id','CloseButton');
		l_objCloseButton.setAttribute('title', 'Sluiten')
		l_objCloseButton.onclick = function () {HideLightBox();}
		l_objLightBox.appendChild(l_objCloseButton);
    } 
    l_imgPreloadCloseButton.src = g_strCloseButton;
    
    //Create empty MainImage 
    var l_objMainImage = document.createElement("img");
    l_objMainImage.setAttribute('id','LightboxMainImage');
    l_objLightBox.appendChild(l_objMainImage);
    
//    //Create navigation div
    var l_objNavContainer = document.createElement("div");
    l_objNavContainer.setAttribute('id','LightBoxNav');
    l_objLightBox.appendChild(l_objNavContainer);
    
//    //Create title div
    var l_objTitleContainer = document.createElement("div");
    l_objTitleContainer.setAttribute('id','TitleDiv');
    l_objTitleContainer.style.width = '500px';
    l_objNavContainer.appendChild(l_objTitleContainer);
    
//    //Create Prev/next links
    var l_objPrevImgLink = document.createElement("a");
    l_objPrevImgLink.setAttribute('href','#');
	l_objPrevImgLink.setAttribute('id','PrevImgLink');
	l_objPrevImgLink.innerHTML = 'vorige';
	l_objNavContainer.appendChild(l_objPrevImgLink);
	l_objNavContainer.innerHTML += ' | ';
	
    var l_objNextImgLink = document.createElement("a");
    l_objNextImgLink.setAttribute('href','#');
	l_objNextImgLink.setAttribute('id','NextImgLink');
	l_objNextImgLink.innerHTML = 'volgende';
	l_objNavContainer.appendChild(l_objNextImgLink);
}

function ShowLightBox(p_objImage)
{
    var l_objOverlay = document.getElementById('Overlay');
    var l_objLightBox = document.getElementById('LightBox');
    var l_objLightBoxImage = document.getElementById('LightboxMainImage');
    var l_objNextImgLink = document.getElementById('NextImgLink');
    var l_objPrevImgLink = document.getElementById('PrevImgLink');
    var l_objTitle = document.getElementById('TitleDiv');
    var l_intCurrentImgNr = Math.abs(p_objImage.getAttribute('ImgNr'));
    var l_intImagesLength = g_strImages.length-1;
    var l_intNextNr = l_intCurrentImgNr + 1;
    
//    //Set Next/Prev Array Items
    if(l_intNextNr > l_intImagesLength)
        l_intNextNr = 0;
    var l_intPrevNr = l_intCurrentImgNr - 1
    if(l_intPrevNr < 0)
        l_intPrevNr = l_intImagesLength;
//    
//    //Set Next Link
    l_objNextImgLink.setAttribute('ImgNr',l_intNextNr);
    l_objNextImgLink.setAttribute('href',g_strImages[l_intNextNr]);
    l_objNextImgLink.onclick = function () {return ShowLightBox(g_strImages[l_intNextNr]);}
//    
//    //Set Prev Link
    l_objPrevImgLink.setAttribute('ImgNr',l_intPrevNr);
    l_objPrevImgLink.setAttribute('href',g_strImages[l_intPrevNr]);
    l_objPrevImgLink.onclick = function () {return ShowLightBox(g_strImages[l_intPrevNr]);}
    
    var arrayPageSize = getPageSize();
	var arrayPageScroll = getPageScroll();
	var l_imgPreloadImage = new Image();
    l_imgPreloadImage.onload = function()
    {
        l_objLightBoxImage.src = l_imgPreloadImage.src;
        if(p_objImage.getAttribute('title'))
            l_objTitle.innerHTML = p_objImage.getAttribute('title');
        else
            l_objTitle.innerHTML = '';
            
//        if(l_imgPreloadImage.width > maxWidthImage){
//            var resizeHeight = ((l_imgPreloadImage.height)/(l_imgPreloadImage.width)* maxWidthImage);
//            l_objLightBox.resizeImageContainer(maxWidthImage, resizeHeight);
//            Element.setWidth('l_objLightBoxImage', maxWidthImage);
//        } else  {
//            l_objLightBox.resizeImageContainer(l_imgPreloadImage.width, l_imgPreloadImage.height);
//        }	
        
        var lightboxTop = arrayPageScroll + ((arrayPageSize[3] - 35 - l_imgPreloadImage.height) / 2) - 35;
		var lightboxLeft = ((arrayPageSize[0] - l_imgPreloadImage.width) / 2) - 15;
		l_objOverlay.style.height = (g_intPageHeight + 'px');
	    l_objOverlay.style.display = 'block';
		l_objLightBox.style.top = (lightboxTop < 0) ? "0px" : lightboxTop + "px";
		l_objLightBox.style.left = (lightboxLeft < 0) ? "0px" : lightboxLeft + "px";
		l_objLightBox.style.display = 'block';
    } 
    l_imgPreloadImage.src = p_objImage.getAttribute('href');
    document.getElementById('webcam').style.visibility = 'hidden';
    return false;
}

function HideLightBox()
{
	var l_objOverlay = document.getElementById('Overlay');
	var l_objLightbox = document.getElementById('LightBox');
	l_objOverlay.style.display = 'none';
	l_objLightbox.style.display = 'none';
	document.getElementById('webcam').style.visibility = 'visible';
}