var zoomMousePosStart, imagemapMousePosStart
var viewportwidth = pageWidth*2-20
var viewportheight = bookheight-20


function zoomimageloaded(img){
    img.reallycomplete=true
    if (document.getElementById('zoompageleft').reallycomplete==true && document.getElementById('zoompageright').reallycomplete==true) {

    document.getElementById('dblpagezoom').style.display='block'
    animate('LoadingIconFadeOut',0,100,300, 
        function(n){document.getElementById('dblpagezoom').style.opacity=n/100;
        document.getElementById('dblpagezoom').style.filter='alpha(opacity='+n+')'},function(){document.getElementById('loader').style.display='none'}, true)
    }
}

function toggleZoom(e){
    if (document.getElementById('ZoomPanel').style.display=='none') 
        openZoom(e,true)
    else
        closeZoom()
}

function closeZoom(leavefade){
        
        if (document.getElementById('ZoomPanel').style.display=='none') return
        
        catalogueState = enumCatalogueState['ready']
        
        document.getElementById('zoom').className="navlinks zoom zoomin"
        
        if (!leavefade){
        
        if (bookmode == 1 || pageCount > 2) 
        {
            animate('FadeButtonsAnimation',0,100,300, 
                function(n){document.getElementById('pageNextButton').style.filter='alpha(opacity='+n+')';
                document.getElementById('pageNextButton').style.opacity=n/100;
                document.getElementById('pagePrevButton').style.filter='alpha(opacity='+n+')';
                document.getElementById('pagePrevButton').style.opacity=n/100;},function(){}, true)
        }
            animate('FadeAnimation',70,0,300, 
                function(n){document.getElementById('Fade').style.opacity=n/100;
                document.getElementById('Fade').style.filter='alpha(opacity='+n+')'},function(){document.getElementById('Fade').style.display='none'}, true)

        }
        
        animate('ZoomAnimation',viewportheight, 20 ,300,
            function(n){
                document.getElementById('ZoomPanel').style.top= ((bookheight - n) / 2) + 'px'
                document.getElementById('ZoomPanel').style.height=n+'px'},
                function(){
                    animate('ZoomAnimation', viewportwidth,Math.floor(.1*pageWidth),300,
                    function(n){
                        document.getElementById('ZoomPanel').style.width = n + 'px'
                        document.getElementById('ZoomPanel').style.marginLeft = Math.round(-parseInt(document.getElementById('ZoomPanel').style.width)/2)+'px'
                    },function(n){document.getElementById('ZoomPanel').style.display = 'none'}, true)
                }, true)


}

function openZoom(e, skipposition){
    e = e || window.event
  
    //if (document.getElementById('thumbnails').style.display=='block') toggleThumbnails(true,true)
    
    if (catalogueState != enumCatalogueState['ready']) return
    
    catalogueState = enumCatalogueState['busy']

    document.getElementById('zoom').className="navlinks zoom zoomout"
    
    document.getElementById('tooltip').style.display='none'

    document.getElementById('dblpagezoom').style.marginLeft=-zoomWidth+'px'
    document.getElementById('dblpagezoom').style.marginTop=-zoomHeight/2+'px'
    
    if (e && (!skipposition)){
        zoomMousePosStart = cursorPos(e)
        var containerpos = elementPos(document.getElementById('container'))
        
        if (viewportwidth<zoomWidth*2) {
            
            document.getElementById('dblpagezoom').style.marginLeft=-2*(zoomMousePosStart[0]-containerpos[0])/bookWidth*zoomWidth+'px'
            if (parseInt(document.getElementById('dblpagezoom').style.marginLeft)>-viewportwidth/2) document.getElementById('dblpagezoom').style.marginLeft= -viewportwidth/2+'px'
            if (viewportwidth/2-parseInt(document.getElementById('dblpagezoom').style.marginLeft)-2*zoomWidth > 0) document.getElementById('dblpagezoom').style.marginLeft= viewportwidth/2-2*zoomWidth+'px'
        }
        if (viewportheight<zoomHeight) {
            document.getElementById('dblpagezoom').style.marginTop=-zoomHeight*(zoomMousePosStart[1]-containerpos[1])/bookheight+'px'
            if (parseInt(document.getElementById('dblpagezoom').style.marginTop)>-viewportheight/2) document.getElementById('dblpagezoom').style.marginTop= -viewportheight/2+'px'
            if (viewportheight/2-parseInt(document.getElementById('dblpagezoom').style.marginTop)-zoomHeight > 0) document.getElementById('dblpagezoom').style.marginTop= viewportheight/2-zoomHeight+'px'
        }
    }
    
    
    document.getElementById('loader').style.display='block'
    document.getElementById('dblpagezoom').style.display='none'
    document.getElementById('zoompageleft').reallycomplete=false
    document.getElementById('zoompageright').reallycomplete=false
    
    document.getElementById('ZoomPanel').style.width = Math.floor(.1*pageWidth)+'px'
    document.getElementById('ZoomPanel').style.left = '50%'
    document.getElementById('ZoomPanel').style.marginLeft = Math.floor(-parseInt(document.getElementById('ZoomPanel').style.width)/2)+'px'
    document.getElementById('ZoomPanel').style.display = 'block'

    viewportToImagemap()       
    
    if (currentpage!=0){
        document.getElementById('zoompageleft').style.visibility='visible'
        if (document.getElementById('zoompageleft').getAttribute('src')!=formatString(imageUrlFormat,catalogueID,2,currentpage))
            document.getElementById('zoompageleft').src=formatString(imageUrlFormat,catalogueID,2,currentpage)
        else 
            zoomimageloaded(document.getElementById('zoompageleft'))
    } else {
        zoomimageloaded(document.getElementById('zoompageleft'))
        document.getElementById('zoompageleft').style.visibility='hidden'
    }
        
    if (currentpage!=pageCount){
        document.getElementById('zoompageright').style.visibility='visible'
        if (document.getElementById('zoompageright').getAttribute('src')!=formatString(imageUrlFormat,catalogueID,2,currentpage+1))
            document.getElementById('zoompageright').src=formatString(imageUrlFormat,catalogueID,2,currentpage+1)
         else
            zoomimageloaded(document.getElementById('zoompageright'))
    } else {
        zoomimageloaded(document.getElementById('zoompageright'))
        document.getElementById('zoompageright').style.visibility='hidden'
    }
    
    document.getElementById('Fade').style.display='block'
    
    animate('FadeAnimation',0,70,300, 
        function(n){document.getElementById('Fade').style.opacity=n/100;
        document.getElementById('Fade').style.filter='alpha(opacity='+n+')';},function(){}, true)


    if (bookmode == 1 || pageCount > 2) 
    {
        animate('FadeButtonsAnimation',100,0,300, 
            function(n){document.getElementById('pageNextButton').style.filter='alpha(opacity='+n+')';
            document.getElementById('pageNextButton').style.opacity=n/100;
            document.getElementById('pagePrevButton').style.filter='alpha(opacity='+n+')';
            document.getElementById('pagePrevButton').style.opacity=n/100;},function(){}, true)
    }
    
    animate('ZoomAnimation',0, viewportheight ,300,
        function(n){
            document.getElementById('ZoomPanel').style.top= ((bookheight - n) / 2) + 'px'
            document.getElementById('ZoomPanel').style.height=n+'px'},
            function(){
                animate('ZoomAnimation',Math.floor(.1*pageWidth), viewportwidth ,300,
                function(n){
                    document.getElementById('ZoomPanel').style.width = n + 'px'
                    document.getElementById('ZoomPanel').style.marginLeft = Math.round(-parseInt(document.getElementById('ZoomPanel').style.width)/2-2)+'px'
                },function(n){}, true)
            }, true)

}

function zoomMouseDown(e){
    e = e || window.event
    
    if (e.preventDefault)
        e.preventDefault()
        
    zoomMousePosStart = cursorPos(e)
    document.onmousemove=zoomMouseMove
    document.onmouseup=zoomMouseUp
}

function zoomMouseMove(e){

    e = e || window.event   
    currentMousePos=cursorPos(e)
    if (zoomMousePosStart){
        
        if (viewportwidth<zoomWidth*2) {
            document.getElementById('dblpagezoom').style.marginLeft=parseInt(document.getElementById('dblpagezoom').style.marginLeft)+currentMousePos[0]-zoomMousePosStart[0]+'px'
            if (parseInt(document.getElementById('dblpagezoom').style.marginLeft)>-viewportwidth/2) document.getElementById('dblpagezoom').style.marginLeft= -viewportwidth/2+'px'
            if (viewportwidth/2-parseInt(document.getElementById('dblpagezoom').style.marginLeft)-2*zoomWidth > 0) document.getElementById('dblpagezoom').style.marginLeft= viewportwidth/2-2*zoomWidth+'px'
        }
        if (viewportheight<zoomHeight) {
            document.getElementById('dblpagezoom').style.marginTop=parseInt(document.getElementById('dblpagezoom').style.marginTop)+currentMousePos[1]-zoomMousePosStart[1]+'px'
            if (parseInt(document.getElementById('dblpagezoom').style.marginTop)>-viewportheight/2) document.getElementById('dblpagezoom').style.marginTop= -viewportheight/2+'px'
            if (viewportheight/2-parseInt(document.getElementById('dblpagezoom').style.marginTop)-zoomHeight > 0) document.getElementById('dblpagezoom').style.marginTop= viewportheight/2-zoomHeight+'px'
        }
        viewportToImagemap()
        zoomMousePosStart=cursorPos(e)
    }
}

function zoomMouseUp(e){
    zoomMousePosStart = null
    document.onmousemove=null
    document.onmouseup=null
}

function viewportToImagemap(){
    //These equations may seem overly complex however this is due to making up for loss of precision
    document.getElementById('zoomimagemapmarker').style.marginLeft = -(parseInt(document.getElementById('dblpagezoom').style.marginLeft)+viewportwidth/2)/(zoomWidth*2-viewportwidth)*(document.getElementById('zoomimagemap').clientWidth-document.getElementById('zoomimagemapmarker').clientWidth)+'px'
    document.getElementById('zoomimagemapmarker').style.marginTop = -(parseInt(document.getElementById('dblpagezoom').style.marginTop)+viewportheight/2)/(zoomHeight-viewportheight)*(document.getElementById('zoomimagemap').clientHeight-document.getElementById('zoomimagemapmarker').clientHeight)+'px'
}

function imagemapToViewport(){
    document.getElementById('dblpagezoom').style.marginLeft = -parseInt(document.getElementById('zoomimagemapmarker').style.marginLeft)/(document.getElementById('zoomimagemap').clientWidth-document.getElementById('zoomimagemapmarker').clientWidth)*(zoomWidth*2-viewportwidth)-viewportwidth/2+'px'
    document.getElementById('dblpagezoom').style.marginTop = -parseInt(document.getElementById('zoomimagemapmarker').style.marginTop)/(document.getElementById('zoomimagemap').clientHeight-document.getElementById('zoomimagemapmarker').clientHeight)*(zoomHeight-viewportheight)-viewportheight/2+'px'
}

function imagemapMarkerMouseDown(e){
    e = e || window.event
    imagemapMousePosStart = cursorPos(e)
    document.onmousemove=imagemapMarkerMouseMove
    document.onmouseup=imagemapMarkerMouseUp
}

function imagemapMarkerMouseMove(e){
    e = e || window.event   
    currentMousePos=cursorPos(e)
    
    if (imagemapMousePosStart){

            document.getElementById('zoomimagemapmarker').style.marginLeft=parseInt(document.getElementById('zoomimagemapmarker').style.marginLeft)+currentMousePos[0]-imagemapMousePosStart[0]+'px'
            document.getElementById('zoomimagemapmarker').style.marginTop=parseInt(document.getElementById('zoomimagemapmarker').style.marginTop)+currentMousePos[1]-imagemapMousePosStart[1]+'px'
            if (parseInt(document.getElementById('zoomimagemapmarker').style.marginLeft) < 0) document.getElementById('zoomimagemapmarker').style.marginLeft='0px'
            if (parseInt(document.getElementById('zoomimagemapmarker').style.marginTop) < 0) document.getElementById('zoomimagemapmarker').style.marginTop='0px'
            if (parseInt(document.getElementById('zoomimagemapmarker').style.marginLeft) >= parseInt(document.getElementById('zoomimagemap').clientWidth)-parseInt(document.getElementById('zoomimagemapmarker').clientWidth)) document.getElementById('zoomimagemapmarker').style.marginLeft=parseInt(document.getElementById('zoomimagemap').clientWidth)-parseInt(document.getElementById('zoomimagemapmarker').clientWidth)+'px'
            if (parseInt(document.getElementById('zoomimagemapmarker').style.marginTop) >= parseInt(document.getElementById('zoomimagemap').clientHeight)-parseInt(document.getElementById('zoomimagemapmarker').clientHeight)) document.getElementById('zoomimagemapmarker').style.marginTop=parseInt(document.getElementById('zoomimagemap').clientHeight)-parseInt(document.getElementById('zoomimagemapmarker').clientHeight)+'px'
            imagemapToViewport()
        imagemapMousePosStart=cursorPos(e)
    }

}

function imagemapMarkerMouseUp(e){
    imagemapMousePosStart=null
    document.onmousemove=null
    document.onmouseup=null
}