var imageNr=-1;

var fade=0;
var prevImageH=0;
var prevImageW=0

var inter, alpha=0, thumbs=0;

var x=200;
var y=200;

var goalX=0;
var goalY=0;


var mouseX = 0
var mouseY = 0

window.onresize = function () {

    thumbWidth();

    if(document.getElementById("gImagesBg").style.display=="block"){
        var pagesize=getPageSize();

        document.getElementById('gImagesBg').style.width=Math.max(pagesize[0], pagesize[2]);
        document.getElementById('gImagesBg').style.height=Math.max(pagesize[1], pagesize[3]);


        clearTimeout(inter);
        changeShape(imageNr, imageNr, 1);

    }
}

window.onscroll = function(){
    goalX=-document.body.scrollLeft;
    goalY=-document.body.scrollTop;

    clearTimeout(inter);
    changeShape(imageNr, imageNr, 1);
}

function setOpacity(value, obj) {
    obj.style.opacity = value/10;
    obj.style.filter = 'alpha(opacity=' + value*10 + ')';
}

// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false;

// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE);

// Set-up to use getMouseXY function onMouseMove
//document.onmousemove = getMousePosition;

// Main function to retrieve mouse x-y pos.s

function getMousePosition(e) {
    if (IE) { // grab the x-y pos.s if browser is IE
        mouseX = event.clientX + document.body.scrollLeft
        mouseY = event.clientY + document.body.scrollTop
    } else {  // grab the x-y pos.s if browser is NS
        mouseX = e.pageX
        mouseY = e.pageY
    }
    // catch possible negative values in NS4
    if (mouseX < 0){
        mouseX = 0;
    }
    if (mouseY < 0){
        mouseY = 0;
    }

    return true
}


function getPosition(obj) {
    var curleft = curtop = 0;
    if (obj.offsetParent) {
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    return [curleft,curtop];
}


//
// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
//
function getPageSize(){

    var xScroll, yScroll;

    if (window.innerHeight && window.scrollMaxY) {
        xScroll = document.body.scrollWidth;
        yScroll = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
        xScroll = document.body.scrollWidth;
        yScroll = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
        xScroll = document.body.offsetWidth;
        yScroll = document.body.offsetHeight;
    }

    var windowWidth, windowHeight;
    if (self.innerHeight) {	// all except Explorer
        windowWidth = self.innerWidth;
        windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
        windowWidth = document.documentElement.clientWidth;
        windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
        windowWidth = document.body.clientWidth;
        windowHeight = document.body.clientHeight;
    }

    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
        pageHeight = windowHeight;
    } else {
        pageHeight = yScroll;
    }

    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){
        pageWidth = windowWidth;
    } else {
        pageWidth = xScroll;
    }


    arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
    return arrayPageSize;
}



function nextImage(){
    if(document.getElementById('show'+(imageNr+1))!=null && (alpha==10 || imageNr==-1)){
        imageNr++;

        setOpacity(0, document.getElementById('show'+imageNr));
        document.getElementById('newWindow').href=document.getElementById('show'+imageNr).src;
        clearTimeout(inter);
        changeShape(imageNr, (imageNr-1), 0);
    }
}

function prevImage(){
    if(document.getElementById('show'+(imageNr-1))!=null && alpha==10){
        imageNr--;

        setOpacity(0, document.getElementById('show'+imageNr));
        document.getElementById('newWindow').href=document.getElementById('show'+imageNr).src;
        clearTimeout(inter);
        changeShape(imageNr, (imageNr+1), 0);
    }
}

function changeShape(newnr, prevnr, mode){
    var ww=0;
    var hh=0;
    var h=0;
    var w=0;

    if(newnr>-1){
        if(document.getElementById('show'+newnr).style.display!="block"){
            document.getElementById('show'+newnr).style.display='block';
            h=document.getElementById('show'+newnr).offsetHeight;
            w=document.getElementById('show'+newnr).offsetWidth;
            document.getElementById('show'+newnr).style.display='none';
        }else{
            h=document.getElementById('show'+newnr).offsetHeight;
            w=document.getElementById('show'+newnr).offsetWidth;
        }
    }

    var windowSize=getPageSize(), winW, winH;

    winW = windowSize[2];
    winH = windowSize[3];


    if(w!=0 && h!=0){
        ww=w+20;
        hh=h+60;
    }else{
        var position=getPosition(document.getElementById("thumb"+imageNr));
        goalX=Math.round(winW/2)-position[0]-50;
        goalY=Math.round(winH/2)-position[1]-50;
    }

    if(ww>winW-40){
        ww=winW-40;
    }

    if(hh>winH-40){
        hh=winH-40;
    }
    switch(mode){
        case 0: //Fade out

            if(alpha>0){
                alpha--;
                setOpacity(alpha, document.getElementById('show'+prevnr));
                setOpacity(alpha, document.getElementById('gControls'));

                if(document.getElementById('show'+(prevnr-1))!=null){
                    setOpacity(alpha, document.getElementById('gButtonLeft'));
                }

                if(document.getElementById('show'+(prevnr+1))!=null){
                    setOpacity(alpha, document.getElementById('gButtonRight'));
                }
            }else{
                document.getElementById('show'+prevnr).style.display='none';
                fade=0;
                mode++;
            }
            break;

        case 1: //Resize
            if(fade<2){

                fade+=.1;

                var scale=Math.exp(-(fade*fade)*Math.PI);

                var tempW=ww+(prevImageW-ww)*scale;
                var tempH=hh+(prevImageH-hh)*scale;

                var tempX=goalX+(x-goalX)*scale;
                var tempY=goalY+(y-goalY)*scale;

                var iimw=tempW-20;
                var iimh=tempH-60;

                if(iimw<0){
                    iimw=0;
                }

                if(iimh<0){
                    iimh=0;
                }

                document.getElementById('gImages').style.width=Math.round(tempW)+"px";
                document.getElementById('gImages').style.height=Math.round(tempH)+"px";
                document.getElementById('gInner').style.width=Math.round(iimw)+"px";
                document.getElementById('gInner').style.height=Math.round(iimh)+"px";
                document.getElementById('gImages').style.marginLeft=Math.round(-tempW/2-tempX)+"px";
                document.getElementById('gImages').style.marginTop=Math.round(-tempH/2-tempY)+"px";

            }else{
                if(ww!=0 && hh!=0){
                    document.getElementById('show'+newnr).style.display='block';
                    mode++;
                }else{
                    fadeBg(0);
                    mode=3;
                }
                prevImageW=ww;
                prevImageH=hh;
                x=goalX;
                y=goalY;
            }
            break;

        case 2: //Fade in
            if(alpha<10){
                alpha++;
                setOpacity(alpha, document.getElementById('show'+newnr));
                setOpacity(alpha, document.getElementById('gControls'));

                if(document.getElementById('show'+(imageNr-1))!=null){
                    setOpacity(alpha, document.getElementById('gButtonLeft'));
                }

                if(document.getElementById('show'+(imageNr+1))!=null){
                    setOpacity(alpha, document.getElementById('gButtonRight'));
                }

            }else{
                mode++;
            }

            break;
    }

    if(mode<3){
        inter=setTimeout("changeShape("+newnr+", "+prevnr+", "+mode+");", 1000/25);
    }else if(nr>-1){
        clearTimeout(inter);
    }

}

function showImage(img){
    document.getElementById('gImages').style.width=0+"px";
    document.getElementById('gImages').style.height=0+"px";
    document.getElementById('gInner').style.width=0+"px";
    document.getElementById('gInner').style.height=0+"px";
    document.getElementById('gImages').style.marginLeft=0+"px";
    document.getElementById('gImages').style.marginTop=0+"px";
    document.getElementById('gImagesBg').style.display="block";
    document.getElementById('newWindow').href=document.getElementById('show'+img).src;

    var pagesize=getPageSize();

    document.getElementById('gImagesBg').style.width=pagesize[0];
    document.getElementById('gImagesBg').style.height=pagesize[1];

    setOpacity(0, document.getElementById('gImagesBg'));
    setOpacity(0, document.getElementById('gButtonLeft'));
    setOpacity(0, document.getElementById('gButtonRight'));
    setOpacity(0, document.getElementById('gControls'));

    var position=getPosition(document.getElementById("thumb"+img));

    x=Math.round(pagesize[2]/2)-position[0]-50;
    y=Math.round(pagesize[3]/2)-position[1]-50;
    
    goalX=-document.body.scrollLeft;
    goalY=-document.body.scrollTop;

    bgAlpha=0;
    clearTimeout(inter);
    imageNr=img;
    fadeBg(5);
}

function hideImage(){
    clearTimeout(inter);
    changeShape(-1, imageNr, 0);
}

function fadeBg(a){
    if(bgAlpha<a){
        bgAlpha++;
        inter=setTimeout("fadeBg("+a+");", 5);
    }

    if(bgAlpha>a){
        bgAlpha--;
        inter=setTimeout("fadeBg("+a+");", 5);
    }

    if(bgAlpha==a && a!=0){
        document.getElementById('gImages').style.display="block";

        setOpacity(0, document.getElementById('show'+imageNr));
        clearTimeout(inter);
        changeShape(imageNr, imageNr, 0);
    }else if(bgAlpha==0){
        document.getElementById('gImagesBg').style.display="none";
        clearTimeout(inter);
    }else{
        document.getElementById('gImages').style.display="none";
    }

    if(bgAlpha!=a){
        setOpacity(bgAlpha, document.getElementById('gImagesBg'));
    }
}