﻿// JScript File

addLoadEvent(initPopup);

function initPopup()
{
    //attach event handler to thumbnails
    var divPhotographs = document.getElementById("photographs");
    var links = divPhotographs.getElementsByTagName("a");
    
    for (i = 0; i < links.length; i++)
    {
        links[i].onclick = getPhoto;
    }
    
}

function getPhoto() 
{
    //load the photo in response to thumbnail click
    var imgPhoto = document.getElementById("photo");
    
    imgPhoto.src = this.href;
    imgPhoto.alt = this.firstChild.alt;
    imgPhoto.title = this.firstChild.title;
    imgPhoto.onload = showPopup;
    
    return false;
}

function showPopup() 
{
    //when the photo has loaded, show it in the popup
    var divCover = document.getElementById("greyCover");
    var divPopup = document.getElementById("photoPopup");
    var imgPhoto = document.getElementById("photo");
    var divCaption = document.getElementById("popupCaption");
        
    //calculate size of cover and show
    var width = (document.body.scrollWidth > document.body.offsetWidth) ? document.body.scrollWidth : document.body.offsetWidth;
    var height = (document.body.scrollHeight > document.body.offsetHeight) ? document.body.scrollHeight : document.body.offsetHeight;
    divCover.style.display = "block";
    divCover.style.width = width + "px";
    divCover.style.height = height + "px";    
    
    //calcualte position of popup and show
    width = self.innerWidth || (document.documentElement.clientWidth || document.body.clientWidth);
    height = self.innerHeight || (document.documentElement.clientHeight || document.body.clientHeight);
    var scrollLeft = self.pageXOffset || (document.documentElement.scrollLeft || document.body.scrollLeft);
    var scrollTop = self.pageYOffset || (document.documentElement.scrollTop || document.body.scrollTop);
    var left;
    var top;
    divPopup.style.display = "block";
    divPopup.style.width = (imgPhoto.clientWidth + 20) + "px";
    divPopup.style.height = (imgPhoto.clientHeight + 70) + "px";
    left = (width > divPopup.offsetWidth) ? ((width - divPopup.offsetWidth) / 2) : 0;
    left += scrollLeft;
    top = (height > divPopup.offsetHeight) ? ((height - divPopup.offsetHeight) / 2) : 0;
    top += scrollTop;
    divPopup.style.left = left + "px";
    divPopup.style.top = top + "px";
    if(imgPhoto.title != "undefined") divCaption.innerHTML = imgPhoto.title;
    
    return false;
}



function closePopup() 
{
    var divCover = document.getElementById("greyCover");
    var divPopup = document.getElementById("photoPopup");
    
    divCover.style.display = "none";
    divPopup.style.display = "none";
    
    return false;
}
