/*
Developed by: Mahmoud Almokadem
Date: 6/2/2010
*/


function setPan(imgId, divContId, divImgId)
{
    var img = document.getElementById(imgId);
    var divCont = document.getElementById(divContId);
    var divImg = document.getElementById(divImgId);
    
    var w = img.clientWidth;
    var h = img.clientHeight;
    
    //img.style.display = 'none';
    
    //Add handler to image
    divCont.onmousedown = function(e){onmousedown(e, divContId);};
    divCont.onmousemove = function(e){onmousemove(e, divContId);};
    divCont.onmouseup = function(e){onmouseup(e);};
    divCont.onmouseout = function(e){onmouseout(e);};
    
    
    //divImg.style.backgroundImage = 'url(' + img.src + ')';
    divCont.style.cursor = 'pointer';
    
    divImg.style.width = w + 'px';
    divImg.style.height = h + 'px';
}


var downed = false;
var fScrollX, fScrollY;
var fX, fY;

function onmousedown(e, divContId)
{
    if(!e) e = window.event;
    
    downed = true;
    
    //Handle here
    
    fX = (e.clientX - getX(divContId));
    fY = (e.clientY - getY(divContId));
    
    fScrollX = getScrollX(divContId);
    fScrollY = getScrollY(divContId);
}


function onmousemove(e, divContId)
{
    
    try
    {
        if(!divContId)
            return;
            
        if(!e) e = window.event;
        if(downed)
        {
            //Handle here
            
            var eX, eY, eScrollX, eScrollY
            if(!window.event)
            {
                eX = (e.clientX);
                eY = (e.clientY);
            }
            else
            {
                eX = (e.clientX) - getX(divContId);
                eY = (e.clientY) - getY(divContId);
            }
        
            eScrollX = fScrollX - (eX - fX);
            eScrollY = fScrollY - (eY - fY);
        
            document.getElementById(divContId).scrollLeft = eScrollX;
            document.getElementById(divContId).scrollTop = eScrollY;
            
           

        }
    }
    catch (ex)
    {
    }
}

var lastScrollX = 0;
var lastScrollY  =0;


function onmouseup(e)
{
    //Handle here
    downed = false;
}

function onmouseout(e)
{
    //Handle here
    downed = false;
}


function getScrollX(elementId)
{
   try
   {
       lastScrollX= document.getElementById(elementId).scrollLeft;
       return lastScrollX;
   }
   catch(ex)
   {
        return lastScrollX;
   }
   
}

function getScrollY(elementId)
{
    try
    {
        lastScrollY = document.getElementById(elementId).scrollTop;
        return lastScrollY;
    }
    catch(ex)
    {
        return lastScrollY;
    }
    
}



function setInfo(e, divContId)
{
    document.getElementById('divMouseX').innerHTML = 'X: ' + (e.clientX - getX(divContId));
    document.getElementById('divMouseY').innerHTML = 'Y: ' + (e.clientY - getY(divContId));
    
    document.getElementById('divScrollX').innerHTML = 'Scroll X: ' + getScrollX(divContId);
    document.getElementById('divScrollY').innerHTML = 'Scroll Y: ' + getScrollY(divContId);
}





function getX(elementId)
{
    var oElement = document.getElementById(elementId);
    
    var iReturnValue = 0;
    while( oElement != null ) 
    {
        iReturnValue += oElement.offsetLeft;
        oElement = oElement.offsetParent;
    }
    
    return iReturnValue;
}

function getY(elementId)
{
    var oElement = document.getElementById(elementId);
    
    var iReturnValue = 0;
    while( oElement != null ) 
    {
        iReturnValue += oElement.offsetTop;
        oElement = oElement.offsetParent;
    }
    
    return iReturnValue;
}