var map = null;
var showinfo = false;
var currentRegion = null;
var currentMapType = null;

$(function()
{
    $(".topbar-image").click(function()
    {
        var mapType = $(this).attr("id").split("-", 2)[0];
        ChangeMap(mapType);
    });
});

function ChangeMap(mapType) 
{
    currentMapType = mapType;
    SetTiles(mapType);
    $('#legend').css("background-image", "url('App_Themes/Default/legend_" + mapType + ".png')");
}

function GetMap()
{
    map = new VEMap('myMap');

    map.LoadMap(new VELatLong(53.6, -2.33), 5, 'r', false);
    
    map.AttachEvent("onclick", MouseHandler);
    map.AttachEvent("ondoubleclick", function() { showinfo = false; });
    map.AttachEvent("onstartzoom", function() { showinfo = true; });
    map.AttachEvent("onendzoom", function() { showinfo = false; });
    map.AttachEvent("onstartpan", function() { showinfo = true; });
    map.AttachEvent("onendpan", function() { showinfo = false; });

    $('#legend').appendTo('#myMap').append("<div id='help-icon' style='position:absolute;right:10px;top:83px;width:15px;height:15px;cursor:pointer;' />");
    $('#shootlogo').appendTo('#myMap');

    $("#help-icon").click(function()
    {
        var helpPopup = $('#help-popup');
        helpPopup.empty();
        helpPopup.append("<img src='App_Themes/Default/text_" + currentMapType + ".png' alt='" + currentMapType + " help text' />");
        helpPopup.click(function()
        {
            $(this).hide();
            return false;
        });
        helpPopup.show();
        return false;
    });
    
    $('#help-popup').appendTo('#myMap');

    //set the map to initially be recession
    ChangeMap("recession");
}

function SetTiles(mapType)
{
    //delete the old tile layer
    if (map.GetTileLayerCount() > 0)
        map.DeleteTileLayer("tiles");

    //grab first char of map type
    var m = mapType.substring(0, 1);

    //var linkspec = location.href.substring(0, location.href.lastIndexOf("/") + 1) + "GeneratedTileHandler.ashx?style=r&quad=%4";
    //Note: r%4 for recession, o%4 for optimism and e%4 for equipped
    var tileSourceSpec = new VETileSourceSpecification("tiles", "http://tiles.shoothill.com/btsurvey/" + mapType + "/" + m + "%4.png");
    
    tileSourceSpec.NumServers = 1;
    tileSourceSpec.ZIndex = 100;
    if ($.browser.msie && $.browser.version == 6)
        tileSourceSpec.Opacity = 1.0;
    else
        tileSourceSpec.Opacity = 0.8;
    
    map.AddTileLayer(tileSourceSpec, true);
}

function AddPoint()
{
    var ll = new VELatLong(52.3362394103582, -3.76285316758741);
    var shape = new VEShape(VEShapeType.Pushpin, ll);
    
    shape.SetTitle("Wales");
    shape.SetDescription("<table>" +
        "<tr><td style='width:200px'>Northwest Overall</td><td style='background-color:yellow;width:30px'></td></tr>" +
        "<tr><td style='width:200px'>Women Business Owners</td><td style='background-color:orange;width:30px'></td></tr>" +
        "<tr><td style='width:200px'>Sole Traders</td><td style='background-color:pink;width:30px'></td></tr>" +
        "<tr><td style='width:200px'>Companies Over 5 Years Old</td><td style='background-color:blue;width:30px'></td></tr>" +
        "</table>");
    shape.SetCustomIcon("<img class='icons' src='app_themes/default/icon.png'/>");

    map.AddShape(shape);
}

function onEndZoom(e)
{
    var width = Math.pow(0.8 * (e.zoomLevel + 1), 2) + 0.01;
    
    if (width > 35)
        width = 35;
        
    $.rule('.icons', 'style').css('width', width + 'px');
}

function MapClick(e)
{
    if (!showinfo)
        return false;

    var ll = map.PixelToLatLong(new VEPixel(e.mapX, e.mapY));
    
    x = e.centerX;
    y = e.centerY;

    PageMethods.GetRegionName(ll.Latitude, ll.Longitude, getRegionNameCallback);
}

function getRegionNameCallback(regionName)
{
    if (regionName.length == 0)
        return false;

    currentRegion = regionName;

    var popup = $('#popup');

    $('#region').html(regionName);
    $('#region').click(function() {
        //hide all the content divs
        $("#tabPage > div").hide();
        //show the main tab page
        $("#main-tabpage").show();
    });
    
    popup.css("display", "block");

    SetUpPopupTabs();    
    
    showinfo = false;

    //empty all tabs
    $("#tabPage > div").empty();
    //Set loading gif on main tab
    $('#main-tabpage').append("<img src='App_Themes/Default/survey-loading.gif' alt='loading...' style='margin-top:25px;margin-left:165px;' />");
    //hide all other tabs
    $("#tabPage > div:not(:first)").hide();
    //show main tab
    $('#main-tabpage').show();
    
    //PageMethods.GetTabPageHtml(regionName, mapName, itemsName, getTabPageHtmlCallback);
    PageMethods.GetTabPageHtml(regionName, currentMapType, 'MainPage', getTabPageHtmlCallback);
}

function getTabPageHtmlCallback(result) {
    //$("#tabPage > div").empty();
    //$("#tabPage > div:not(:first)").hide();
    $('#main-tabpage').html(result);
    //$('#main-tabpage').show();
}

function SetUpPopupTabs() {

    //set up click events for navigation
    $("#tabrow img").click(function()
    {
        //debugger;

        //hide all the content divs
        $("#tabPage > div").hide();

        //get the id of the image
        var itemName = $(this).attr("id");

        itemName = itemName.split("-", 2)[0];

        //split the id on the hyphen and add "-tabpage"
        var pageID = itemName + "-tabpage";

        //if the div is empty
        if ($("#" + pageID).is(":empty"))
        {
            //Set loading gif
            $("#" + pageID).append("<img src='App_Themes/Default/survey-loading.gif' alt='loading...' style='margin-top:25px;margin-left:165px;' />");

            PageMethods.GetTabPageHtml(currentRegion, currentMapType, itemName, function(content) { $("#" + pageID).html(content); });
        }

        //set the id of the one pointed to to be visible
        $("#" + pageID).show();

        //stop further execution of events
        return false;
    });

    //hide all but the first divs
    $("#tabPage > div:not(:first)").hide();

}

function MouseHandler(e)
{
    var msg;
    
    if (e.eventName == "onclick")
    {
        if (e.leftMouseButton)
        {
            MapClick(e);
        }
        else if (e.rightMouseButton)
        {
            msg = "onclick (right mouse button)  event";
        }
        else if (e.leftMouseButton)
        {
            msg = "onclick (middle mouse button)  event";
        }
    } 
    else
    {
        msg = e.eventName + " event.";
    }
}