// Map Objects
var mapSize = { width: 5120, height: 4680 };
var scale = { small : "small", middle : "middle", large : "large" };
var scaleDimensions = { small : { x : 15, y: 18}, middle : { x : 25, y: 31}, large : { x : 64, y: 78} };
var imgDirs = { small : "../ii/map/map/small/", middle : "../ii/map/map/middle/", large : "../ii/map/map/large/" };
var navigateArrows = $A();
navigateArrows = ["view_left", "view_lt", "view_top", "view_rt", "view_right", "view_rb", "view_bottom", "view_lb"];
var showcoords = true;

function getScales(sc)
{
    if (sc == scale.small)
        return { x : 15, y: 18};
    if (sc == scale.middle)
        return { x : 25, y: 31};
    if (sc == scale.large)
        return { x : 64, y: 78};  
    return null;          
}

function getDirections(arrow)
{
    if (arrow == "view_left")
        return { x : 1, y: 0 };
    if (arrow == "view_lt")
        return { x : 1, y: 1 };
    if (arrow == "view_top")
        return { x : 0, y: 1 }; 
    if (arrow == "view_rt")
        return { x : -1, y: 1 };
    if (arrow == "view_right")
        return { x : -1, y: 0 };
    if (arrow == "view_rb")
        return { x : -1, y: -1 };  
    if (arrow == "view_bottom")
        return { x : 0, y: -1 };
    if (arrow == "view_lb")
        return { x : 1, y: -1 };          
        
    return {x: 0, y: 0 };          
}

function getImgDir(sc)
{
    if (sc == scale.small)
        return imgDirs.small;
    if (sc == scale.middle)
        return imgDirs.middle;
    if (sc == scale.large)
        return imgDirs.large;  
    return "";          
}

//  ---
function Map(id)
{
     this.id = id;
     this.initX = 0;
     this.initY = 0;
     this.x = 0;
     this.y = 0;
     this.countX = 10;
     this.countY = 10;
     this.cellWidth = 80;
     this.cellHeight = 60;
     this.scaleLevel = scale.small;
     this.imgDir = imgDirs.small;
     this.commonDir = "../ii/map/";
     
     this.objects = new MapObjects();
     this.objects.id = id;
     
     this.imgCount = 0;
     
}
Map.prototype.CreateField = function()
{
    var parentEl = null;
    parentEl = $(this.id);
    attachEcmaClass(parentEl, this);
    var loadEl = $("loadDiv");
    loadEl.setStyle({ width: "800px", height: "600px", position : "absolute", zIndex: "10" });
    var loadEl = $("loadImg");
    loadEl.style.left = "121px";
    loadEl.style.top = "100px";
    var tableEl = $c("table", this.id + "_table", parentEl);
    tableEl.cellPadding = "0";
    tableEl.cellSpacing = "0";
    tableEl.observe("click", clickMap);
    tableEl = $c("tbody", "", tableEl);
    var trEl = null;
    var tdEl = null;
    for (var i = 0; i < this.countX; ++i)
    {
        trEl =$c("tr", "", tableEl);
        for (var j = 0; j < this.countY; ++j)
        {
            tdEl = $c("td", this.id + "_cell_" + i + "_" + j, trEl);  
            tdEl.x = j;
            tdEl.y = i; 
            tdEl.setStyle({ width: this.cellWidth + "px", height: this.cellHeight + "px" });
            attachEcmaClass(tdEl, this);
        }
    }    
    $("loadDiv").setStyle({ left: getLeft(parentEl) + 1 + "px", top: getTop(parentEl) + 1 + "px" });
    var infoEl = $c("div", this.id + "_info", parentEl).hide();
    infoEl.className = "infoBlock";
    infoEl.observe("mouseover", mouseOverInfo);
    infoEl.observe("mouseout", mouseOutInfo);
    $c("div", this.id + "_name", infoEl).setStyle({ textAlign: "center", fontWeight: "bold" });
    $c("div", this.id + "_text", infoEl);
    $c("div", this.id + "_adress", infoEl);
    $c("div", this.id + "_image", infoEl);
    $c("div", this.id + "_img", infoEl);
    $c("div", this.id + "_link", infoEl);
}

Map.prototype.SetStartPosition = function(initX, initY)
{
    this.initX = initX;
    this.initY = initY;
    this.x = initX;
    this.y = initY;
}

Map.prototype.SetCenterPosition = function(x, y)
{
    $("loadDiv").show(); 
    
    var dimensions = getScales(this.scaleLevel);
    var setX = (x < dimensions.x) ? x : dimensions.x - 1;
    var setY = (y < dimensions.y) ? y : dimensions.y - 1;
    
    setX = (setX - (this.countX / 2) < 0) ? 0 : setX - (this.countX / 2);  
    setX = (x + (this.countX / 2) >= getScales(this.scaleLevel).x) ? getScales(this.scaleLevel).x - this.countX : setX;  
    
    setY = (y - (this.countY / 2) < 0) ? 0 : setY - (this.countY / 2);  
    setY = (y + (this.countY / 2) >= getScales(this.scaleLevel).y) ? getScales(this.scaleLevel).y - this.countY : setY;   
    
    for (var i = 0; i < this.countY; ++i)
        for (var j = 0; j < this.countX; ++j)
            $(this.id + "_img_" + i + "_" + j).src = this.imgDir + (setY + i) + "_" + (setX + j) + ".gif";       this.x = setX;
    this.y = setY;
    
    setCbXY(setX, setY);
    doMapCallBack(callbackType.objects);
}

Map.prototype.SetScale = function(sc)
{
    if (sc != scale.small && sc != scale.middle && sc != scale.large)
        return;
    this.scaleLevel = sc;
    this.imgDir = getImgDir(sc);
    this.x = this.initX;
    this.y = this.initY;
}

Map.prototype.InitMap = function()
{ 
    var dimension = getScales(this.scaleLevel);
    var loopx = (dimension.x - this.initX >= this.countX) ? this.countX : (dimension.x - this.initX);
    var loopy = (dimension.y - this.initY >= this.countY) ? this.countY : (dimension.y - this.initY);
    var tdEl = null;
    var imgEl = null;
    for (var i = 0; i < loopy; ++i)
        for (var j = 0; j < loopx; ++j)
        {
            tdEl = $(this.id + "_cell_" + i + "_" + j);
            if ($(this.id + "_img_" + i + "_" + j) == null)
            {
                imgEl = $c("img", this.id + "_img_" + i + "_" + j, tdEl);
                assignEvent(imgEl, "load", this.imgLoadComplete);
                attachEcmaClass(imgEl, this);
            }    
            else
                imgEl = $(this.id + "_img_" + i + "_" + j);    
            imgEl.src = this.imgDir + (i + this.initY) + "_" + (j + this.initX) + ".gif";
        }   
    for (var i = 0; i < navigateArrows.size(); ++i)
    {
        assignEvent($(navigateArrows[i]), "click", this.ClickArrow);
        attachEcmaClass($(navigateArrows[i]), this);
    }
    
    setCbXY(this.initX, this.initY);
    var tout = setTimeout("doMapCallBack('" + callbackType.objects + "')", 100);
}

Map.prototype.ClickArrow = function(ev)
{
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    var directions = getDirections(el.id);
    var scales = getScales(ctx.scaleLevel);
    var sourseEl = null;
    var destEl = null; 
    var x = 0;
    var y = 0;
    if (ctx.x - directions.x < 0 || ctx.x - directions.x > scales.x - ctx.countX) 
        directions.x = 0;
    if (ctx.y - directions.y < 0 || ctx.y - directions.y > scales.y - ctx.countY) 
        directions.y = 0;
        
    if (directions.x == 0 && directions.y == 0)        
        return;    
    
    $("loadDiv").show();    
            
    for (var i = 0; i < ctx.countY; ++i)
        for (var j = 0; j < ctx.countX; ++j)
        {
            if (directions.x == 1)
                x = ctx.countX - j - 1;
            if (directions.x <= 0)
                x = j;
            if (directions.y == 1)
                y = ctx.countY - i - 1;
            if (directions.y <= 0)
                y = i;    
            
            if (x + directions.x > -1 && x + directions.x < ctx.countX) 
                if (y + directions.y > -1 && y + directions.y < ctx.countY)   
                {
                    sourseEl = $(ctx.id + "_img_" + y + "_" + x);        
                    destEl = $(ctx.id + "_img_" + (y + directions.y) + "_" + (x + directions.x));        
                    destEl.src = sourseEl.src;
                }
        }
        
    ctx.x -= directions.x; 
    ctx.y -= directions.y;
    x = (directions.x == 1) ? 0 : ctx.countX - 1;
    y = (directions.y == 1) ? 0 : ctx.countX - 1;
    if (directions.x != 0)
        for (var i = 0; i < ctx.countY; ++i)
        {
            $(ctx.id + "_img_" + i + "_" + x).src = ctx.imgDir + (ctx.y + i) + "_" + (ctx.x + x) + ".gif";
        }
    if (directions.y != 0)
        for (var i = 0; i < ctx.countX; ++i)
        {
            $(ctx.id + "_img_" + y + "_" + i).src = ctx.imgDir + (ctx.y + y) + "_" + (ctx.x + i) + ".gif";
        }  
    MoveSelected();    
    
    setCbXY(ctx.x, ctx.y);  
    doMapCallBack(callbackType.objects);
}

Map.prototype.DrawObjects = function()
{
    var dimensions = getScales(this.scaleLevel);
    var resX = Math.round(mapSize.width / dimensions.x);
    var resY = Math.round(mapSize.height / dimensions.y);
    var mapPosX = this.x * resX;
    var mapPosY = this.y * resY;
    
    var imgEl = null;
    for (var i = 0, len = this.objects.object.size(); i < len; ++i)
    {
        var elPosX = (this.objects.object[i].mapX - mapPosX) / resX * this.cellWidth;
        var elPosY = (this.objects.object[i].mapY - mapPosY)  / resY * this.cellHeight;
        imgEl = $c("img", this.id + "_obj_" + i, $("mapView"));
        imgEl.object = this.objects.object[i];
        imgEl.src = this.commonDir + "ico/" + this.objects.object[i].type + ".gif";
        imgEl.setStyle({ position: "absolute", cursor: "pointer" });
        imgEl.setStyle({ left: (getLeft($(this.id + "_table")) + elPosX - 7) + "px", top: (getTop($(this.id + "_table")) + elPosY - 7) + "px" });
        attachEcmaClass(imgEl, this);
        imgEl.observe("mouseover", mouseOverObject);
        imgEl.observe("mouseout", mouseOutObject);
        if ($("cb_" + this.objects.object[i].type).checked == false)
            imgEl.hide();
    }
}

//  MapObjects Class
function MapObjects()
{
    this.id = "";
    this.object = $A();
}

MapObjects.prototype.Add = function(id, type, name, adress, text, image, link, mapX, mapY)
{
    this.object[this.object.size()] = new MapObject();
    
    this.object.last().id = id;
    this.object.last().type = type;
    this.object.last().name = name;
    this.object.last().adress = adress;
    this.object.last().text = text;
    this.object.last().image = image;
    this.object.last().link = link;
    this.object.last().mapX = mapX;
    this.object.last().mapY = mapY;
}

MapObjects.prototype.Delete = function(index)
{
    if ((index>-1)&&(index<this.object.size()))
        this.object.splice(index,1);
}

MapObjects.prototype.Clear = function()
{
    this.object.clear();
}

MapObjects.prototype.Last = function()
{
    this.object.last();
}

MapObjects.prototype.ClearObjects = function()
{
    for (var i = 0; i < this.object.size(); ++i)
    {
        try
        {
            $(this.id + "_obj_" + i).remove();
        }
        catch(x)
        {
            alert(x);
        }    
    }
    this.object.clear();
}

//  MapObject Class
function MapObject()
{
    this.id = 0;
    this.type = "";
    this.name = "";
    this.adress = "";
    this.text = "";
    this.image = "";
    this.link = "";
    this.mapX = 0;
    this.mapY = 0;
    
    this.isCashed = false;
}

//  ----------------------------------------------
//  Onload funtions
//  ----------------------------------------------  
Map.prototype.imgLoadComplete = function(ev) 
{
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    if (ctx.imgCount == (ctx.countX * ctx.countY) - 1)
    {
        ctx.imgCount = 0;
        $("loadDiv").hide();
    }
    else
        ctx.imgCount++;
}
function onLoad()
{
    $("loadDiv").hide(); 
    assignEvent($("preMap"), "click", preMap_Click);
    attachEcmaClass($("preMap"), map);
    
    var selected = $c("div", "selDiv", $("topPanel"));
    selected.setStyle({ border: "solid 1px red", position: "absolute" });
    var dimensions = getScales(map.scaleLevel);
    var w = Math.round(2500 / dimensions.x) - 2;
    var h = Math.round(2250 / dimensions.y) - 2;
    selected.setStyle({ width: w + "px", height: h + "px" });
    var l = getLeft($("preMap")) + Math.round(250 / dimensions.x) * map.initX;
    var t = getTop($("preMap")) + Math.round(225 / dimensions.y) * map.initY;
    selected.setStyle({ left: l + "px", top: t + "px" });
    selected.setStyle({ cursor: "crosshair" });
    
    assignEvent(selected, "click", preMap_Click);
    attachEcmaClass(selected, map);  
}
//  ----------------------------------------------  
//  Interface functions
//  ----------------------------------------------  
function toggleScale(sc)
{
    if (map.scaleLevel == sc)
        return;
    $("scale_" + map.scaleLevel).className = "scaleBtn";
    $("scale_" + sc).className = "scaleBtn_sel";
    $("loadDiv").show();
    var x = Math.round((getScales(sc).x * (map.x + 5)) / getScales(map.scaleLevel).x - 5);
    var y = Math.round((getScales(sc).y * (map.y + 5)) / getScales(map.scaleLevel).y - 5);
    map.SetScale(sc);
    map.imgCount = 0;
    map.SetStartPosition(x, y);
    map.InitMap();
    
    var selected = $("selDiv");
    var dimensions = getScales(map.scaleLevel);
    var w = Math.round(2500 / dimensions.x);
    var h = Math.round(2250 / dimensions.y);
    selected.setStyle({ width: w + "px", height: h + "px" });
    var l = getLeft($("preMap")) + Math.round(250 / dimensions.x) * map.initX;
    var t = getTop($("preMap")) + Math.round(225 / dimensions.y) * map.initY;
    selected.setStyle({ left: l + "px", top: t + "px" }); 
}

function mouseOverBtn(sc)
{
    $("scale_" + sc).addClassName("scaleBtn_hov");
}

function mouseOutBtn(sc)
{
    $("scale_" + sc).removeClassName("scaleBtn_hov");
}

function preMap_Click(ev)
{
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    var dimensions = getScales(map.scaleLevel);
    var evX = ev.clientX;
    var evY = ev.clientY;
    if (ev.srcElement == undefined)
    {
        if (evY != ev.pageY)
            evY = ev.pageY;
    }
    else
        evY = ev.offsetY + getTop(el);
    
    var x = Math.round((evX - getLeft($("preMap"))) / (250 / dimensions.x));
    var y = Math.round((evY - getTop($("preMap"))) / (225 / dimensions.y));
    map.SetCenterPosition(x, y);
    
    var selected = $("selDiv");
    var l = getLeft($("preMap")) + (250 / dimensions.x) * map.x;
    var t = getTop($("preMap")) + (225 / dimensions.y) * map.y;
    selected.setStyle({ left: l + "px", top: t + "px" });
}

function MoveSelected()
{
    var dimensions = getScales(map.scaleLevel);
    var selected = $("selDiv");
    var l = getLeft($("preMap")) + (250 / dimensions.x) * map.x;
    var t = getTop($("preMap")) + (225 / dimensions.y) * map.y;
    selected.setStyle({ left: l + "px", top: t + "px" });
}
function clickMap(ev)
{
    if (showcoords)
    {
        var evx = (ev.x) ? ev.x : ev.pageX;
        var evy = (ev.y) ? ev.y : ev.pageY;
        var k = mapSize.width / getScales(map.scaleLevel).x;
        var x = Math.round(k * map.x + ((evx - getLeft($("mapView_table"))) * 10 * k) / $("mapView_table").getWidth());
        k = mapSize.height / getScales(map.scaleLevel).y;
        var y = Math.round(k * map.y + ((evy - getTop($("mapView_table"))) * 10 * k) / $("mapView_table").getHeight());
        alert("x = " + x + " y = " + y);
    }
}
//  ----------------------------------------------
// Callback functions
//  ----------------------------------------------
var callbackType = { objects: "obj", info: "info" };
var callbackObjects = { x: 0, y: 0 };
var callbackInfo = { id: "" };

function setCbXY(x, y)
{
    callbackObjects.x = x;
    callbackObjects.y = y;
}

function doMapCallBack(type)
{
    map.objects.ClearObjects();
    if (type == callbackType.objects)
        var callbackParams = { type: callbackType.objects, id: 0, x: callbackObjects.x, y: callbackObjects.y, scaleX: getScales(map.scaleLevel).x, scaleY: getScales(map.scaleLevel).y  };
    else    
        var callbackParams = { type: callbackType.info, id: callbackInfo.id, x: 0, y: 0, scaleX: 0, scaleY: 0 };
    $("map_params").value = Object.toJSON(callbackParams);
    if (typeof doCallBack != undefined)
        doCallBack(this, type);
}

function mapCallBackEvent(args, ctx)
{
    if (args != "")
    {
        var request = args.evalJSON();
        if (ctx == callbackType.objects)
        { 
            request.each(function(obj){
                map.objects.Add(obj.id, obj.type, obj.name, obj.adress, obj.text, obj.image, obj.link, obj.mapX, obj.mapY);
            });
            map.DrawObjects();
        }
        else
        {
        }   
    }
}

function mapCallBackError(args, ctx)
{
    window.alert(args + " " + ctx);
}

//  ----------------------------------------------
//  Functions for working with map objects
//  ----------------------------------------------
var tout = 0;
function mouseOverObject(ev)
{
    clearTimeout(tout);
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    var infoStr = "";
    var infoEl = $(ctx.id + "_info");
    infoEl.setStyle({ left: (getLeft(el) + 15) + "px", top: (getTop(el) - 20) + "px"  });
    if (el.object.name != "")
        $(ctx.id + "_name").show().update(el.object.name);
    else    
        $(ctx.id + "_text").hide();
    if (el.object.text != "")
        $(ctx.id + "_text").show().update(el.object.text);
    else    
        $(ctx.id + "_adress").hide();
    if (el.object.adress != "")
        $(ctx.id + "_adress").show().update(el.object.adress);
    else    
        $(ctx.id + "_adress").hide();  
    if (el.object.image != "")
        $(ctx.id + "_img").show().update("<img src='" + el.object.image + "' />");
    else    
        $(ctx.id + "_img").hide();      
    if (el.object.link != "")
        $(ctx.id + "_link").show().update("<a href='" + el.object.link + "' target='blank'>Перейти на страницу...</a>");
    else    
        $(ctx.id + "_link").hide();       
        
    infoEl.show();
}

function mouseOutObject(ev)
{
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    tout = setTimeout("$('" + ctx.id + "_info').hide()", 200);
}

function mouseOverInfo(ev)
{
    clearTimeout(tout);
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    $(ctx.id + "_info").show();
}

function mouseOutInfo(ev)
{
    clearTimeout(tout);
    var el = Event.element(ev);
    ctx = getEcmaClass(ev);
    
    $(ctx.id + "_info").hide();
}

//  ----------------------------------------------
function selectObects(id)
{
    var obj = map.objects.object;
    var i = 0;
    obj.each(function (el)
    {
        if (el.type == id)
            if ($("cb_" + id).checked)
                $("mapView_obj_" + i).show();
            else
                $("mapView_obj_" + i).hide();
        i++;        
    });
}

function selectAllCbs()
{
    var cbs = $A($$("input.check"));
    cbs.each(function (el) 
    {
        el.checked = true;
        selectObects(el.value);
    });
}

function deselectAllCbs()
{
    var cbs = $A($$("input.check"));
    cbs.each(function (el)
    {
        el.checked = false;
        selectObects(el.value);
    });
}