/* Handles zooming into images
 *
 * requires: events.js
 */  

window.hasZoomedInPopup = false;
window.zoomedInPopupTime = null;

// Creates a fullscreen zoomed in view of the url.
// 
// If known, pass image_id and imageAspectRatio to improve the
// quality of the popup.  If these are present, url is ignored.
function zoomIntoImage(url, image_id, imageAspectRatio, dir)
{
    if(window.hasZoomedInPopup)
        removeZoomedInPopup();
    
    if(dir && dir != '')
        dir = dir + '/';
    else
        dir = '';
    
    window.hasZoomedInPopup = true;
    
    var ratio = imageAspectRatio;
    
    var div = document.createElement('div');
    
    div.id = 'zoomedInPopup';
    
    var screenWidth = document.body.clientWidth;
    var screenHeight = document.body.clientHeight;
    
    div.style.position = 'absolute';
    div.style.textAlign = 'center';
    div.style.zIndex = 100;
    div.style.top = document.body.scrollTop + 'px';
    div.style.left = document.body.scrollLeft + 'px';
    div.style.width = screenWidth + 'px';
    div.style.height = screenHeight + 'px';
    
    if(image_id) {
        
        var topMargin = document.createElement('div');
        
        var imageWidth = parseInt(screenWidth * 0.75);
        var imageHeight = parseInt(screenHeight * 0.75);
        
        if(ratio) {
            
            if(parseFloat(imageWidth) / parseFloat(imageHeight) >= ratio)
                imageWidth = parseInt(parseFloat(imageHeight) * ratio);
            else
                imageHeight = parseInt(parseFloat(imageWidth) / ratio);
        }
        
        topMargin.style.marginTop = ((screenHeight - imageHeight) / 2) + "px";
        topMargin.style.marginLeft = ((screenWidth - imageWidth) / 2) + "px";
        topMargin.style.textAlign = 'left';
        
        var bgSpan = document.createElement('div');
        
        bgSpan.style.backgroundColor = '#FFF';
        bgSpan.style.backgroundImage = "url('"+dir+"img/loading_big.gif')";
        bgSpan.style.backgroundRepeat = 'no-repeat';
        bgSpan.style.backgroundAttachment = 'fixed';
        bgSpan.style.backgroundPosition = 'center';
        
        bgSpan.style.width = imageWidth + "px";
        bgSpan.style.height = imageHeight + "px";
        
        var img = document.createElement('img');
        
        img.style.zIndex = 120;
        img.width = imageWidth;
        img.height = imageHeight;
        
        img.src = dir + "getimage.php?image_id=" + image_id + "&width=" + imageWidth
            + "&height=" + imageHeight + "&dontSave=1";
        
        bgSpan.appendChild(img);
        topMargin.appendChild(bgSpan);
        div.appendChild(topMargin);
    }
    else {
        
        var topMargin = document.createElement('div');
        
        topMargin.style.marginTop = "100px";
        
        var img = document.createElement('img');
        
        img.style.zIndex = 120;
        
        img.src = url;
        
        topMargin.appendChild(img);
        div.appendChild(topMargin);
    }
    
    document.body.appendChild(div);
    
    var popupTimeout = 30000;
    
    setTimeout(removeZoomedInPopup, popupTimeout);
    
    window.zoomedInPopupTime = (new Date()).getTime();
    
    doAttachEvent(window, 'scroll', removeZoomedInPopup);
    doAttachEvent(document.body, 'keypress', removeZoomedInPopup); // IE
    doAttachEvent(window, 'keypress', removeZoomedInPopup); // FF
    doAttachEvent(div, 'click', removeZoomedInPopup);
    doAttachEvent(document.body, 'mousemove', removeZoomedInPopup);
}

// Removes the fullscreen zoomed in image popup if there is one.
function removeZoomedInPopup(ev, param, eventName)
{
    var t = (new Date()).getTime();
    var setupT = window.zoomedInPopupTime;
    
    var timeout = 2000;
    
    var clickTimeout = 100;
    
    if(eventName != 'click' && t - setupT < timeout)
        return;
    
    if(eventName == 'click' && t - setupT < clickTimeout)
        return;
    
    var mousemoveTimeout = 5000;
    
    if(eventName == 'mousemove' && t - setupT < mousemoveTimeout)
        return;
    
    var node = document.getElementById('zoomedInPopup');
    
    if(node) {
        
        doDetachEvent(window, 'scroll', removeZoomedInPopup);
        doDetachEvent(document.body, 'keypress', removeZoomedInPopup); // IE
        doDetachEvent(window, 'keypress', removeZoomedInPopup); // FF
        doDetachEvent(node, 'click', removeZoomedInPopup);
        doAttachEvent(document.body, 'mousemove', removeZoomedInPopup);
    
        node.parentNode.removeChild(node);
    }
    
    window.hasZoomedInPopup = false;
}