var g_stringLoad = "";
var g_stringResize = "";
var g_maxMapID = 1;
var g_picWidth = 512;
var g_picHeight = 512;
var g_maps = new Array();
var g_movex = 217441.2;
var g_movey = 4392270;
var g_zoom = 0.00303789787;
var g_zoomStep = 1.5;
var g_mouseDown = false;
var g_pan = false;
var g_mapURL = "GetMap.aspx";
var g_webServiceURL = "SelectWebService.aspx";
var g_IE = (navigator.appVersion.indexOf("MSIE")!=-1) && (navigator.userAgent.indexOf("Opera")==-1);
var g_Chrome = navigator.appVersion.indexOf("Chrome") != -1;
var g_hookedLoad = false;
var g_hookedResize = false;
var g_prevLoadCode = null;
var g_prevResizeCode = null;

function insertMap(requestHandler, responseHandler, moveX, moveY, zoom)
{
    var mapID = g_maxMapID++;
    
    g_movex = parseFloat(moveX);
    g_movey = parseFloat(moveY);
    g_zoom  = parseFloat(zoom);

    document.write("<div ondragstart=\"return false;\" onselectstart=\"return false;\" onmousedown=\"mapDown(" + mapID + ",event)\" onmouseout=\"mapOut(" + mapID + ",event)\" onmousemove=\"mapMove(" + mapID + ",event)\" onmouseup=\"mapUp(" + mapID + ",event)\" id=\"mapDiv" + mapID + "\" class=\"mapDiv\"></div>");

    g_stringLoad += "initMap(" + mapID + ", \"" + requestHandler + "\", \"" + responseHandler + "\",\""+moveX+ "\", \""+moveY+ "\", \""+zoom + "\" );";
    g_stringResize += "mapResize(" + mapID + ");";
    
    var prevCode = null;

    if (!g_hookedLoad)
    {
        g_prevLoadCode = window.onload;
        window.onload = function () { loadHandler(); };
        g_hookedLoad = true;
    }

    if (!g_hookedResize)
    {
        g_prevResizeCode = window.onresize;
        window.onresize = function () { resizeHandler(); };
        g_hookedResize = true;
    }
}

function loadHandler()
{
    if (g_prevLoadCode)
        g_prevLoadCode();
    eval(g_stringLoad);
}

function resizeHandler()
{
    if (g_prevResizeCode)
        g_prevResizeCode();
    eval(g_stringResize);
}

function initMap(mapID, requestHandler, responseHandler, moveX, moveY, zoom)
{
    g_movex = parseFloat(moveX);
    g_movey = parseFloat(moveY);
    g_zoom  = parseFloat(zoom);


    var mapDiv = document.getElementById("mapDiv" + mapID);
    mapDiv.onRequest = window[requestHandler];
    mapDiv.onResponse = window[responseHandler];
    
    if (mapDiv.addEventListener)
        mapDiv.addEventListener('DOMMouseScroll', function(evt) {mapWheel(evt, mapID);}, false);
    else
        mapDiv.attachEvent("onmousewheel", function(evt) {mapWheel(evt, mapID);});
    
    var up = document.createElement("img");
    up.id = "up" + mapID;
    up.setAttribute("src", "images/up.gif");
    if (up.addEventListener)
        up.addEventListener("click", function() {upClick(mapID)}, false);
    else
        up.attachEvent("onclick", function() {upClick(mapID)});
    up.style.cursor = "pointer";
    up.style.position = "absolute";
    document.body.appendChild(up);

    var down = document.createElement("img");
    down.id = "down" + mapID;
    down.setAttribute("src", "images/down.gif");
    if (down.addEventListener)
        down.addEventListener("click", function() {downClick(mapID)}, false);
    else
        down.attachEvent("onclick", function() {downClick(mapID)});
    down.style.cursor = "pointer";
    down.style.position = "absolute";
    document.body.appendChild(down);

    var left = document.createElement("img");
    left.id = "left" + mapID;
    left.setAttribute("src", "images/left.gif");
    if (left.addEventListener)
        left.addEventListener("click", function() {leftClick(mapID)}, false);
    else
        left.attachEvent("onclick", function() {leftClick(mapID)});
    left.style.cursor = "pointer";
    left.style.position = "absolute";
    document.body.appendChild(left);

    var right = document.createElement("img");
    right.id = "right" + mapID;
    right.setAttribute("src", "images/right.gif");
    if (right.addEventListener)
        right.addEventListener("click", function() {rightClick(mapID)}, false);
    else
        right.attachEvent("onclick", function() {rightClick(mapID)});
    right.style.cursor = "pointer";
    right.style.position = "absolute";
    document.body.appendChild(right);

    var plus = document.createElement("img");
    plus.id = "plus" + mapID;
    plus.setAttribute("src", "images/plus.gif");
    if (plus.addEventListener)
        plus.addEventListener("click", function() {plusClick(mapID)}, false);
    else
        plus.attachEvent("onclick", function() {plusClick(mapID)});
    plus.style.cursor = "pointer";
    plus.style.position = "absolute";
    document.body.appendChild(plus);

    var minus = document.createElement("img");
    minus.id = "minus" + mapID;
    minus.setAttribute("src", "images/minus.gif");
    if (minus.addEventListener)
        minus.addEventListener("click", function() {minusClick(mapID)}, false);
    else
        minus.attachEvent("onclick", function() {minusClick(mapID)});
    minus.style.cursor = "pointer";
    minus.style.position = "absolute";
    document.body.appendChild(minus);

    createMap(mapID, g_movex, g_movey, g_zoom);
    positionButtons(mapID);
    loadMapPix(mapID);
}

function createMap(mapID, movex, movey, zoom)
{
    var mapDiv = document.getElementById("mapDiv" + mapID);

    var w = mapDiv.offsetWidth * 2;
    var h = mapDiv.offsetHeight * 2;
    
    var actualWidth = 0;
    var actualHeight = 0;
    var cols = 0;
    var rows = 0;
    while (actualWidth < w)
    {
        actualWidth += g_picWidth;
        cols++;
    }
    while (actualHeight < h)
    {
        actualHeight += g_picHeight;
        rows++;
    }

    var left = (-actualWidth / 4);
    var top = (-actualHeight / 4);

    var y = top;
    var x;

    for (var i=0; i<rows; i++)
    {
        x = left;
        for (var j=0; j<cols; j++)
        {
            var img = document.createElement("img");
            mapDiv.appendChild(img);
            img.setAttribute("class", "mapImage");
            img.style.position = "absolute";
            img.style.width = g_picWidth + "px";
            img.style.height = g_picHeight + "px";
            img.setAttribute("onmousedown", "return false;");
            img.style.display = "none";

            if (g_IE)
                img.onload = function() {this.style.display = "block";};
            else
                img.setAttribute("onload", "this.style.display = \"block\";");
            x += g_picWidth;
        }
        y += g_picHeight;
    }
    
    g_maps[mapID] = new mapObject(mapID, rows, cols, actualWidth, actualHeight, left, top, 
                                (movex - (actualWidth  / 2) / zoom),
                                (movey + (actualHeight / 2) / zoom), zoom);


    resetPosition(mapID, top, left);
}

function mapResize(mapID, evt)
{

    var mo = g_maps[mapID];
    if (!mo)
        return;
    var mapDiv = mo.div;

    if (mapDiv.offsetWidth == 0 || mapDiv.offsetHeight == 0)
        return;

    var w = mapDiv.offsetWidth * 2;
    var h = mapDiv.offsetHeight * 2;
    
    var actualWidth = 0;
    var actualHeight = 0;

    while (actualWidth < w)
    {
        actualWidth += g_picWidth;
    }
    while (actualHeight < h)
    {
        actualHeight += g_picHeight;
    }

    if (actualWidth != mo.width || actualHeight != mo.height)
    {
        
        while (mapDiv.firstChild)
            mapDiv.removeChild(mapDiv.firstChild);

        var centerx = mo.movex + (mo.width  / 2) / mo.zoom;
        var centery = mo.movey - (mo.height / 2) / mo.zoom;

        createMap(mapID, centerx, centery, mo.zoom);
        positionButtons(mapID);
        loadMapPix(mapID);    
    }
}

function positionButtons(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    
    if (mapDiv.offsetHeight == 0 || mapDiv.offsetWidth == 0)
    {
        document.getElementById("up" + mapID).style.display = "none";
        document.getElementById("down" + mapID).style.display = "none";
        document.getElementById("left" + mapID).style.display = "none";
        document.getElementById("right" + mapID).style.display = "none";
        document.getElementById("minus" + mapID).style.display = "none";
        document.getElementById("plus" + mapID).style.display = "none";
        return;
    }

    var up = document.getElementById("up" + mapID);
    up.style.top = mapDiv.offsetTop + "px";
    up.style.left = mapDiv.offsetLeft + 16 + "px";
    up.style.display = "inline";

    var down = document.getElementById("down" + mapID);
    down.style.top = mapDiv.offsetTop + 32 + "px";
    down.style.left = mapDiv.offsetLeft + 16 + "px";
    down.style.display = "inline";

    var left = document.getElementById("left" + mapID);
    left.style.top = mapDiv.offsetTop + 16 + "px";
    left.style.left = mapDiv.offsetLeft + "px";
    left.style.display = "inline";

    var right = document.getElementById("right" + mapID);
    right.style.top = mapDiv.offsetTop + 16 + "px";
    right.style.left = mapDiv.offsetLeft + 32 + "px";
    right.style.display = "inline";

    var plus = document.getElementById("plus" + mapID);
    plus.style.top = mapDiv.offsetTop + 48 + 8 + "px";
    plus.style.left = mapDiv.offsetLeft + 16 + "px";
    plus.style.display = "inline";

    var minus = document.getElementById("minus" + mapID);
    minus.style.top = mapDiv.offsetTop + 80 + "px";
    minus.style.left = mapDiv.offsetLeft + 16 + "px";
    minus.style.display = "inline";
}

function resetPosition(mapID, top, left)
{
    var mo = g_maps[mapID];
    mo.top = top;
    mo.left = left;
    mo.startx = 0;
    mo.starty = 0;
    mo.clickx = 0;
    mo.clicky = 0;

    var mapDiv = mo.div;

    var y = top;
    var x;

    var index = 0;
    for (var i=0; i<mo.rows; i++)
    {
        x = left;
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[index++];
            img.style.left = x + "px";
            img.style.top = y + "px";
            x += g_picWidth;
        }
        y += g_picHeight;
    }
}

function loadMapPix(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;

    var index = 0;
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[index];
            img.style.display = "none";
            img.setAttribute("src", getImageSrc(mapID, i, j));
            index++;
        }
    }
}

function getImageSrc(mapID, row, col)
{

    var radVal;
        if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_0").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_0").value;
        else if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_1").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_1").value;
        else if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_2").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_2").value;
        else if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_3").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_3").value;
        else if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_4").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_4").value;
        else if(document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_5").checked)
            radVal = document.getElementById("ctl00_ContentPlaceHolder1_RadioButtonList1_5").value;
       
    var mo = g_maps[mapID];

    var ystep = g_picHeight / mo.zoom;
    var centy = (g_picHeight / 2) / mo.zoom;
    var my = mo.movey - row * ystep - centy;

    var xstep = g_picWidth / mo.zoom;
    var centx = (g_picWidth / 2) / mo.zoom;
    var mx = mo.movex + col * xstep + centx;

    return g_mapURL + "?zoom=" + mo.zoom + "&movex=" + mx + "&movey=" + my + "&width=" + g_picWidth + "&height=" + g_picHeight +
     "&Rad="+radVal +"&Dtm="+ document.getElementById("ctl00_ContentPlaceHolder1_DropDownList1").value + " " + document.getElementById("ctl00_ContentPlaceHolder1_DropDownList2").value + 
     "&names=" + document.getElementById("chkNames").checked + "&stations=" + document.getElementById("chkStations").checked;
}

function mapObject(mapID, rows, cols, width, height, left, top, movex, movey, zoom)
{
    this.mapID = mapID;
    this.movex = movex;
    this.movey = movey;
    this.zoom = zoom;
    this.clickx = 0;
    this.clicky = 0;
    this.startx = 0;
    this.starty = 0;
    this.rows = rows;
    this.cols = cols;
    this.width = width;
    this.height = height;
    this.div = document.getElementById("mapDiv" + mapID);
    this.left = left;
    this.top = top;
    return this;
}

function mapDown(mapID, evt)
{
    if (evt.button == 2)    return;
    g_mouseDown = true;
    g_pan = false;

    var mo = g_maps[mapID];
    var mapDiv = mo.div;

    mo.clickx = evt.clientX + document.documentElement.scrollLeft;
    mo.clicky = evt.clientY + document.documentElement.scrollTop;
    
    mo.startx = mo.left;
    mo.starty = mo.top;
    
    return false;
}

function mapMove(mapID, evt)
{
    if (!g_mouseDown) return;

    g_pan = true;
    
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    mapDiv.style.cursor = "move";

    var x = evt.clientX + document.documentElement.scrollLeft;
    var y = evt.clientY + document.documentElement.scrollTop;
    
    // Check Map Click with tolerance
    var tol = 3;
    if(Math.abs( mo.clickx - x) <= tol &&
       Math.abs( mo.clicky - y) <= tol)
      {
        g_pan = false;
        return;
      }
      
    // END of Check Map Click with tolerance
       
    
    var index = 0;
    
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[index];
            img.style.left = (mo.startx + (j * g_picWidth ) + (x - mo.clickx)) + "px";
            img.style.top =  (mo.starty + (i * g_picHeight) + (y - mo.clicky)) + "px";
            index++;
        }
    }

    mo.left = mo.startx + (x - mo.clickx);
    mo.top  = mo.starty + (y - mo.clicky);

    checkMap(mapID, x, y);
    closePopUp();
}

function mapUp(mapID, evt)
{
    if (evt.button == 2 || !g_mouseDown)    return;
    var mo = g_maps[mapID];
    var mapDiv = mo.div;

    if (!g_pan && mapDiv.onRequest && mapDiv.onResponse)
    {
        var clickx = (evt.clientX + document.documentElement.scrollLeft - mapDiv.offsetLeft) - mo.left;
        var clicky = (evt.clientY + document.documentElement.scrollTop - mapDiv.offsetTop ) - mo.top;

        var X = mo.movex + clickx / mo.zoom;
        var Y = mo.movey - clicky / mo.zoom;

        var dtm =  document.getElementById("ctl00_ContentPlaceHolder1_DropDownList1").value + " " + document.getElementById("ctl00_ContentPlaceHolder1_DropDownList2").value;
        
        var url = g_webServiceURL + "?" + mapDiv.onRequest(mapID, clickx, clicky, X, Y) +"&dtm="+dtm + "&stations=" + document.getElementById("chkStations").checked;
        
        postXMLHTTP(url, null, mapDiv.onResponse, mapID, clickx, clicky, X, Y);
    }

    g_pan = false;
    g_mouseDown = false;
    mapDiv.style.cursor = "default";
    return false;
}

function mapOut(mapID, evt)
{
    if (g_pan)
    {
        var tolerance = 5;
        var mo = g_maps[mapID];
        var mapDiv = mo.div;

        var mousex = (evt.clientX + document.documentElement.scrollLeft);// - mapDiv.offsetLeft) - mo.left;
        var mousey = (evt.clientY + document.documentElement.scrollTop);// - mapDiv.offsetTop ) - mo.top;
        
        var outside = (mousex - mapDiv.offsetLeft < tolerance) || (mousex - (mapDiv.offsetLeft + mapDiv.offsetWidth) > -tolerance) ||
                        (mousey - mapDiv.offsetTop < tolerance) || (mousey - (mapDiv.offsetTop + mapDiv.offsetHeight) > -tolerance);

        if (outside)
        {
            g_pan = false;
            g_mouseDown = false;
            mapDiv.style.cursor = "default";
        }
    }
}

function getXMLHTTP()
{
	try
	{
		var o;
		if (window.ActiveXObject)
		{
            try
            {
                o = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e)
            {
                o = new ActiveXObject("Microsoft.XMLHTTP");
            }
		}
		else if (window.XMLHttpRequest)
			o = new XMLHttpRequest();
		return o;
	}
	catch(e)
	{
		alert("getXMLHTTP : " + e);
	}
	return null;
}

function postXMLHTTP(url, sXML, callback)
{
	try
	{
		var extraArgs = null;
		if (postXMLHTTP.arguments.length > 3)
		{
			extraArgs = new Array(postXMLHTTP.arguments.length-3);
			for (var i=0; i<extraArgs.length; i++)
				extraArgs[i] = postXMLHTTP.arguments[i+3];
		}
		xmlhttp = getXMLHTTP();
		xmlhttp.open("GET", url, true);
		xmlhttp.onreadystatechange = function ()
		{
			if (xmlhttp.readyState == 4)
			{
				if (callback) 
				    callback(xmlhttp, extraArgs);
			}
		}
		xmlhttp.send(sXML);
	}
	catch(e)
	{
	    alert("postXMLHTTP : " + e);
	}
}

function mapWheel(event, mapID)
{
    var delta = 0;
    if (event.wheelDelta)
    {
        delta = event.wheelDelta/120;
        if (window.opera)
            delta = -delta;
    }
    else if (event.detail)
    {
        delta = -event.detail/3;
    }

    if (event.preventDefault)
        event.preventDefault();
	event.returnValue = false;
	
	var handler = delta > 0 ? plusClick : minusClick;
	
	delta = Math.abs(delta);
	for (var i=0; i<delta; i++)
	    handler(mapID);
    closePopUp();
}

function checkMap(mapID, evtX, evtY)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    
    if (mo.top > 0)
    {
        while (mo.top >= 0)
            addImageRow(mapID, true, evtY);
    }
    else if (mo.top + mo.height <= mapDiv.offsetHeight)
    {
        while (mo.top + mo.height < mapDiv.offsetHeight)
            addImageRow(mapID, false, evtY);
    }
    
    if (mo.left > 0)
    {
        while (mo.left >= 0)
            addImageCol(mapID, true, evtX);
    }
    else if (mo.left + mo.width <= mapDiv.offsetWidth)
    {
        while (mo.left + mo.width < mapDiv.offsetWidth)
            addImageCol(mapID, false, evtX);
    }

}

function addImageRow(mapID, top, evtY)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    
    var displacement = top ? -g_picHeight : g_picHeight;

    mo.top += displacement;
    mo.starty = mo.top;
    mo.clicky = evtY;
    mo.movey -= displacement / mo.zoom;
    
    var ystep = top ? -g_picHeight : g_picHeight;

    if (top)
    {
        for (var i=mo.rows-1; i>=0; i--)
        {
            for (var j=0; j<mo.cols; j++)
            {
                var img = mapDiv.childNodes[i * mo.cols + j];
                img.style.top = (img.offsetTop + ystep) + "px";
                img.style.display = "none";
                
                if (i == 0)
                    img.setAttribute("src", getImageSrc(mapID, i, j));
                else
                {
                    var copy = mapDiv.childNodes[(i - 1) * mo.cols + j];
                    img.setAttribute("src", copy.getAttribute("src"));
                }
            }
        }
    }
    else
    {
        for (var i=0; i<mo.rows; i++)
        {
            for (var j=0; j<mo.cols; j++)
            {
                var img = mapDiv.childNodes[i * mo.cols + j];
                img.style.top = (img.offsetTop + ystep) + "px";
                img.style.display = "none";
                
                if (i == mo.rows-1)
                    img.setAttribute("src", getImageSrc(mapID, i, j));
                else
                {
                    var copy = mapDiv.childNodes[(i + 1) * mo.cols + j];
                    img.setAttribute("src", copy.getAttribute("src"));
                }
            }
        }
    }
}

function addImageCol(mapID, left, evtX)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    
    var displacement = left ? -g_picWidth : g_picWidth;

    mo.left += displacement;
    mo.startx = mo.left;
    mo.clickx = evtX;
    mo.movex += displacement / mo.zoom;
    
    var xstep = left ? -g_picHeight : g_picHeight;

    if (left)
    {
        for (var i=0; i<mo.rows; i++)
        {
            for (var j=mo.cols-1; j>=0; j--)
            {
                var img = mapDiv.childNodes[i * mo.cols + j];
                img.style.left = (img.offsetLeft + xstep) + "px";
                img.style.display = "none";

                if (j == 0)
                    img.setAttribute("src", getImageSrc(mapID, i, j));
                else
                {
                    var copy = mapDiv.childNodes[i * mo.cols + j - 1];
                    img.setAttribute("src", copy.getAttribute("src"));
                }
            }
        }
    }
    else
    {
        for (var i=0; i<mo.rows; i++)
        {
            for (var j=0; j<mo.cols; j++)
            {
                var img = mapDiv.childNodes[i * mo.cols + j];
                img.style.left = (img.offsetLeft + xstep) + "px";
                img.style.display = "none";

                if (j == mo.cols-1)
                    img.setAttribute("src", getImageSrc(mapID, i, j));
                else
                {
                    var copy = mapDiv.childNodes[i * mo.cols + j + 1];
                    img.setAttribute("src", copy.getAttribute("src"));
                }
            }
        }
    }
}

function upClick(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    mo.top += g_picHeight;
    mo.startx = 0;
    mo.starty = 0;
    mo.clickx = 0;
    mo.clicky = 0;
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[i * mo.cols + j];
            img.style.top = (img.offsetTop + g_picHeight) + "px";
        }
    }
    checkMap(mapID, 0, 0);
    closePopUp();
}

function downClick(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    mo.top -= g_picHeight;
    mo.startx = 0;
    mo.starty = 0;
    mo.clickx = 0;
    mo.clicky = 0;
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[i * mo.cols + j];
            img.style.top = (img.offsetTop - g_picHeight) + "px";
        }
    }
    checkMap(mapID, 0, 0);
    closePopUp();
}

function leftClick(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    mo.left += g_picWidth;
    mo.startx = 0;
    mo.starty = 0;
    mo.clickx = 0;
    mo.clicky = 0;
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[i * mo.cols + j];
            img.style.left = (img.offsetLeft + g_picWidth) + "px";
        }
    }
    checkMap(mapID, 0, 0);
    closePopUp();
}

function rightClick(mapID)
{
    var mo = g_maps[mapID];
    var mapDiv = mo.div;
    mo.left -= g_picWidth;
    mo.startx = 0;
    mo.starty = 0;
    mo.clickx = 0;
    mo.clicky = 0;
    for (var i=0; i<mo.rows; i++)
    {
        for (var j=0; j<mo.cols; j++)
        {
            var img = mapDiv.childNodes[i * mo.cols + j];
            img.style.left = (img.offsetLeft - g_picWidth) + "px";
        }
    }
    checkMap(mapID, 0, 0);
    closePopUp();
}

function plusClick(mapID)
{
    var mo = g_maps[mapID];

    var left = (-mo.width  / 4);
    var top =  (-mo.height / 4);

    var displacex = (left - mo.left) / mo.zoom;
    var displacey = (top  - mo.top ) / mo.zoom;

    resetPosition(mapID, top, left);

    var centerx = mo.movex + (mo.width  / 2) / mo.zoom;
    var centery = mo.movey - (mo.height / 2) / mo.zoom;

    mo.zoom *= g_zoomStep;

    mo.movex = centerx - (mo.width  / 2) / mo.zoom + displacex;
    mo.movey = centery + (mo.height / 2) / mo.zoom - displacey;
    loadMapPix(mapID);
    closePopUp();
}

function minusClick(mapID)
{
    var mo = g_maps[mapID];

    var left = (-mo.width  / 4);
    var top =  (-mo.height / 4);

    var displacex = (left - mo.left) / mo.zoom;
    var displacey = (top  - mo.top ) / mo.zoom;

    resetPosition(mapID, top, left);

    var centerx = mo.movex + (mo.width  / 2) / mo.zoom;
    var centery = mo.movey - (mo.height / 2) / mo.zoom;
    
    mo.zoom /= g_zoomStep;

    mo.movex = centerx - (mo.width  / 2) / mo.zoom + displacex;
    mo.movey = centery + (mo.height / 2) / mo.zoom - displacey;
    loadMapPix(mapID);
    closePopUp();
}