/*
 *  Wsnav Overview Tool
 *  Korem inc.
 */


function Overview(wsnav){
    this.wsnav = wsnav;    
    this.wsnav.addEventListener(this);
    this.overviewInstanceKey = null;
    this.overviewWorkspaceKey = null;
    this.mapWidth = 200;
    this.mapHeight = 150;
    this.mapBounds = null;
    this.xmin = 0;
    this.xmax = 0;
    this.ymin = 0;
    this.ymax = 0;

    this.drawing=false;
    this.panWidth = 50;
    this.panHeight = 38;
    this.panTop = 0;
    this.panLeft = 0;
    this.pixelStartX;
    this.pixelStartY;
    this.tx;
    this.ty;
    this.outX = 0;
    this.outY = 0;
    this.isOut = false;
}



Overview.prototype.mapevent=function(name){
    if(name=="map_loaded"){
        this.updateOverview();
    }
    else if(name=="map_init_end"){
        this.init();
    }
}

Overview.prototype.getImg=function(){
    return document.getElementById("imgOverview");
}

Overview.prototype.init=function(){
    var temp = this;
    //this.displayTest = document.getElementById("divDisplayTest");

    this.getImg().style.width = this.mapWidth+"px";
    this.getImg().style.height = this.mapHeight+"px";
/*
    //INIT TOOL
    var url = this.wsnav.baseHREF + "/wsnav/InitOverview.do" + "?mapInstanceKey=" + this.wsnav.mapInstanceKey + "&overviewInstanceKey=" + this.overviewInstanceKey + "&refresh=" + Math.random();
    var x = createXmlHttpRequest();
    x.open("GET",url,true);
    x.onreadystatechange = function(){ 
        if(x.readyState == 4) {
            wsnav.refreshMap();
        } 
    } 
    x.send(null);
*/

    //UPDATE BOUNDS AND PAN
    document.getElementById("imgOverview").onload = function(e){
        temp.updateBounds();
        temp.updatePan();
    }


    document.getElementById("divOverview").onclick = function(e){ 
        if(!temp.wsnav.isLoading){
            if (!e) var e = window.event;
            
            var posX = e.clientX - findPosX(document.getElementById("divOverview"));
            var posY = e.clientY - findPosY(document.getElementById("divOverview"));

            posX = temp.screenToNumeric( posX, temp.xmin, temp.xmax, temp.mapWidth);
            posY = temp.screenToNumeric( (temp.mapHeight-posY), temp.ymin, temp.ymax, temp.mapHeight);

            var url = temp.wsnav.baseHREF + "/wsnav/UpdateMapWithOverview.do" 
                        + "?mapInstanceKey=" + temp.wsnav.mapInstanceKey
                        + "&overviewInstanceKey=" + temp.overviewInstanceKey
                        + "&overview.x=" + posX
                        + "&overview.y=" + posY
                        + "&refresh=" + Math.random();


            var x = createXmlHttpRequest();
            x.open("GET",url,true);
            x.onreadystatechange = function(){ 
                if(x.readyState == 4) {
                    wsnav.refreshMap();
                } 
            } 
            x.send(null);

        }
    }
    
    /**** PANNING ****/
    var pan = document.getElementById("divOverviewPan");
    var panFixed = document.getElementById("divOverviewPanFixed");
    pan.style.width = this.mapWidth+"px";
    pan.style.height = this.mapHeight+"px";
    panFixed.style.width = this.mapWidth+"px";
    panFixed.style.height = this.mapHeight+"px";

    document.getElementById("imgOverviewPan").onmouseover = function(e){
        this.style.cursor = "url("+temp.wsnav.baseHREF+"/wsnav/images/pan/grab.cur), -moz-grab";

    }

    document.getElementById("imgOverviewPan").onmouseout = function(e){
        this.style.cursor = 'default';
    }

    document.getElementById("imgOverviewPan").onmousedown = function(e){
        if (!e) var e = window.event;
        temp.drawing = true;
        temp.tx = parseInt(this.style.left+0);
        temp.ty = parseInt(this.style.top+0);
        temp.pixelStartX = temp.wsnav.nn6 ? e.clientX : event.clientX;
        temp.pixelStartY = temp.wsnav.nn6 ? e.clientY : event.clientY;

        //change cursor to grabbing
        this.style.cursor = "url("+temp.wsnav.baseHREF+"/wsnav/images/pan/grabbing.cur), -moz-grabbing";
        return false;
    }
    
    document.getElementById("imgOverviewPan").onmousemove=function(e){
        if (temp.drawing){
            if (!e) var e = window.event;
            var clientX = temp.wsnav.nn6 ? e.clientX : event.clientX;
            var clientY = temp.wsnav.nn6 ? e.clientY : event.clientY;
            
            // only if inside the overview image
            var xMin = findPosX(document.getElementById("divOverview"));
            var xMax = findPosX(document.getElementById("divOverview")) + temp.mapWidth;
            var yMin = findPosY(document.getElementById("divOverview"));
            var yMax = findPosY(document.getElementById("divOverview")) + temp.mapHeight;
            if( (clientX > xMin) && (clientX < xMax) && (clientY > yMin) && (clientY < yMax) ){
                this.style.left = temp.tx + clientX - temp.pixelStartX;
                this.style.top  = temp.ty + clientY - temp.pixelStartY;

                // to don't go out of overview bounds
                temp.isOut = false;
                temp.outX = clientX;
                temp.outY = clientY;
            }
            else{
                temp.isOut = true;
            }

/*
            temp.displayTest.innerHTML = 'clientX: ' + clientX + '<br>clientY: ' + clientY;
            temp.displayTest.innerHTML += '<br>outX: ' + temp.outX + '<br>outY: ' + temp.outY;
            temp.displayTest.innerHTML += '<br>xMin: ' + xMin + '<br>xMax: ' + xMax;
            temp.displayTest.innerHTML += '<br>yMin: ' + yMin + '<br>yMax: ' + yMax;
            temp.displayTest.innerHTML += '<br>isOut: ' + temp.isOut;
*/
            return false;
        }
    }

    document.getElementById("imgOverviewPan").onmouseup = function(e){
        //change cursor to grab hand
        this.style.cursor = "url("+temp.wsnav.baseHREF+"/wsnav/images/pan/grab.cur), -moz-grab";

        if (!e) var e = window.event;
        temp.wsnav.loadingAction(true);
        temp.drawing=false;

        // to don't go out of overview bounds
        var clientX = temp.isOut ? temp.outX : e.clientX;
        var clientY = temp.isOut ? temp.outY : e.clientY;

        var xDeplacement = (clientX - temp.pixelStartX)*-1;
        var yDeplacement = (clientY - temp.pixelStartY);
        
        if(xDeplacement != 0 || yDeplacement != 0){
            var oldCenterX = temp.wsnav.xmin+(temp.wsnav.xmax - temp.wsnav.xmin)/2;
            var oldCenterY = temp.wsnav.ymin+(temp.wsnav.ymax - temp.wsnav.ymin)/2;
            var newCenterX = oldCenterX - ((xDeplacement * (temp.xmax-temp.xmin)) / temp.mapWidth);
            var newCenterY = oldCenterY - ((yDeplacement * (temp.ymax-temp.ymin)) / temp.mapHeight);

            temp.wsnav.setCenter(newCenterX,newCenterY);
            temp.wsnav.refreshMap();
        }
    }
    
}//END INIT OVERVIEW


Overview.prototype.updateOverview=function(){

    document.getElementById("divOverview").style.visibility='visible';
    document.getElementById("imgOverview").src = this.wsnav.baseHREF + "/wsnav/GetOverviewImage.do?mapInstanceKey=" + this.wsnav.mapInstanceKey
                                                        + "&overviewInstanceKey=" + this.overviewInstanceKey
                                                        + "&mapWidth=" + this.mapWidth
                                                        + "&mapHeight=" + this.mapHeight
                                                        + "&refresh=" + Math.random();
}


Overview.prototype.updateBounds=function(){
    var url = this.wsnav.baseHREF+"/wsnav/WebServiceCaller.do?pnsURL="+this.wsnav.baseHREFpns
                                +"&service=MapService&method=getBounds&p.1.string="+this.overviewInstanceKey
                                +"&contentType=text/xml&refresh="+Math.random(); 
    var x = createXmlHttpRequest();
    x.open("GET",url,false);
    x.send(null);
    this.bounds = x.responseText;
    this.xmin = Number(x.responseXML.getElementsByTagName("X").item(0).firstChild.nodeValue);
    this.xmax = Number(x.responseXML.getElementsByTagName("X").item(1).firstChild.nodeValue);
    this.ymin = Number(x.responseXML.getElementsByTagName("Y").item(0).firstChild.nodeValue);
    this.ymax = Number(x.responseXML.getElementsByTagName("Y").item(1).firstChild.nodeValue);
}



Overview.prototype.updatePan=function(){
    this.updatePanDim();
    var imgPan = document.getElementById("imgOverviewPan");
    var imgPanFixed = document.getElementById("imgOverviewPanFixed");
    imgPan.className = 'overviewPan';
    imgPanFixed.className = 'overviewPanFixed';

    imgPan.style.width = Math.round(this.panWidth-2)+"px";
    imgPan.style.height = Math.round(this.panHeight-2)+"px";
    imgPanFixed.style.width = Math.round(this.panWidth-2)+"px";
    imgPanFixed.style.height = Math.round(this.panHeight-2)+"px";

    this.updatePanPos();
    imgPan.style.top = Math.round(this.panTop-2);
    imgPan.style.left = Math.round(this.panLeft-2);
    imgPanFixed.style.top = Math.round(this.panTop-2);
    imgPanFixed.style.left = Math.round(this.panLeft-2);
}


Overview.prototype.screenToNumeric=function(pos,min,max,mapDim){
    var screenPos = pos*(max-min)/mapDim;
    screenPos += min;
    return screenPos;
}

Overview.prototype.updatePanDim=function(){
    this.panWidth = (this.wsnav.xmax - this.wsnav.xmin) / (this.xmax - this.xmin) * this.mapWidth;
    this.panHeight = (this.wsnav.ymax - this.wsnav.ymin) / (this.ymax - this.ymin) * this.mapHeight;
}

Overview.prototype.updatePanPos=function(){
    this.panTop = (this.ymax - this.wsnav.ymax) / (this.ymax - this.ymin) * this.mapHeight;;
    this.panLeft = (this.wsnav.xmin - this.xmin) / (this.xmax - this.xmin) * this.mapWidth;
}