// JScript File
// TW Map Api Key = "ABQIAAAACpVVepRB_8LlWZS5c-WAKxSARb386zDFOwsQec9aq2PMEB-MjRSnLy0amVttuel5Fpyb928Fh0DQig"
var map = null;
//var gSearch = null;
var veLatLongArray = null;
var defaultLocation = new GLatLng(54.495567521874065,-4.526367187500011);
var mapZoomLevel, initialRequest, ajaxRequest, markers, loadingElement;
var topLeft, bottomRight;
var searchCenter = null;
var myMapWidth = 710;
var queryStringID = "ctl00_ctl00_MainPlaceholder_MainContent_SearchResults_QueryStringHolder";
//Ajax search results change the structure of the page resulting in a different id for this div
var altQueryStringID = "SearchResults_QueryStringHolder";
var queryString;
var redrawMap;

var useNewService = false;

function initialiseMap()
{
    veLatLongArray = Array();
    mapZoomLevel = 5;
    initialRequest = true;
    ajaxRequest = false;
    redrawMap = false;
    useNewService = false;
    
    //get the div which exists
    var queryStringElement = document.getElementById(queryStringID) || document.getElementById(altQueryStringID);
    
    //get the inner html of div
    queryString = $(queryStringElement).text();    
    
    // Hack
    queryString = queryString.replace("®","&reg");
    
    setupMap();
    getLatLongs("GetMapPins", queryString);
}

function setupMap()
{
    if(map == null)
    {
        map = new GMap2(document.getElementById('myMap'), {size:new GSize(myMapWidth, 370)});
        
        map.setCenter(defaultLocation, mapZoomLevel);
        
        gMapUiOpts = new GMapUIOptions(map.getSize());
        gMapUiOpts.maptypes.physical = false;
        
        map.setUI(gMapUiOpts);
        
        map.addControl(new GOverviewMapControl());
        
        markers = new Array();        
        
        //GEvent.addListener(map, "click", function() { map.removeOverlay(); } );
    }
}

function getLatLongs(webService, queryString)
{
    showLoading();
    map.clearOverlays();
    
    var width = map.getSize().width;
    var height = map.getSize().height;

    topLeft = map.fromContainerPixelToLatLng(new GPoint(0,0)).toString();
    bottomRight = map.fromContainerPixelToLatLng(new GPoint(width,height)).toString();
    
    //strip parenthesises
    topLeft = topLeft.substr(1, topLeft.length - 2);
    bottomRight = bottomRight.substr(1, bottomRight.length - 2);
    
    if (webService == "GetRedrawPins")
    {
        $(".reset-search").show();            
        $(".search-result-header").hide();
    }
         
    CallWebService(webService, map.getZoom(), width, height, topLeft, bottomRight, queryString);
}

var newStartupNodes = new Array();

function IncomingPinsJson(data)
{
    var serverData = getPinsArray(data);
    
    if(serverData != null)
    {
        var pinsCount = serverData["pins"].length;
                
        for(var i = 0; i < pinsCount; i++)
        {
            var pinData = serverData["pins"][i];
            
            addPin(pinData["lat"], pinData["long"], pinData["title"], pinData["description"], pinData["url"], pinData["image"], pinData["company"], pinData["distance"], pinData["bedroomRange"], pinData["pricesFrom"]);
            
            newStartupNodes[i] = new GLatLng(pinData["lat"], pinData["long"]);
        }               
        
        //alert("Initial = " + initialRequest);
        //alert("Ajax = " + ajaxRequest);        
        
        if(initialRequest)
        {            
            initialRequest = false;
            captureZoomAndPan();
            setMapView(startupNodes);
            useNewService = true;
        }
        else if(ajaxRequest)
        {            
            ajaxRequest = false;
            setMapView(newStartupNodes);
        }
        else if (redrawMap)
        {                                           
            setMapView(newStartupNodes);
            redrawMap = false;
            //doCluster = true;  
        }
        
        hideLoading();
    }
    
    addCenterPin();
}

function addCenterPin()
{
    if(!searchCenter) return;
        
    var loc = new GLatLng(searchCenter.Lat, searchCenter.Lng);
    
    var theme = getThemeFromHost(location.hostname);
    var imagePath = "/gw/images/yellow-center-icon.png";
    var centerIcon = new GIcon(G_DEFAULT_ICON);
    centerIcon.image = imagePath;
    centerIcon.iconSize = new GSize(32,32);
    
    var pin = new GMarker(loc, {icon:centerIcon} );
    
    map.addOverlay(pin);
    
    markers.push(pin);
    veLatLongArray.push(loc);    
}

function captureZoomAndPan()
{    
    GEvent.addListener(map, "moveend", function(oldLevel, newLevel){ if (redrawMap) { return; } updateMap(); });
}

function updateMap(setZoom)
{
    mapZoomLevel = map.getZoom();
    
    markers.length = 0;
    
    map.clearOverlays();
    veLatLongArray = Array();
    
    if(setZoom)
    {
        map.setZoom(mapZoomLevel);
    }       
    
    if(useNewService)
    {
        getLatLongs("GetRedrawPins", queryString);        
        var newQueryString = "q=latlong&topleft=" + topLeft.replace(" ", "") + "&bottomright=" + bottomRight.replace(" ", "") + "&zoomlevel=" + mapZoomLevel;
        
        // If not compound query, append querystring to reload the search results list
        if (queryString.indexOf("q=cq") == -1)
        {
            newQueryString = newQueryString + "&" + queryString;
        }               
        ReloadResults(newQueryString, false);
    }
    else
    {
        getLatLongs("GetMapPins", queryString);
    }   
}

function getPinsArray(data)
{
    var array = null;
    
    if(data.substring(0, 2) == "/*" && data.substring(data.length - 2) == "*/")
    {
        var formattedData = data.substring(2, data.length - 2);
        array = eval("(" + formattedData + ")");
    }
    
    return array;
}

function addPin(lat, lng, title, desc, url, image, company, distance, bedrooms, price)
{
    var theme = getThemeFromHost(location.hostname);
    
    var redirect = (url.indexOf("developmentredirect.aspx") != -1);
    
    var cluster = (title == "Multiple developments");
    
    var houseIcon = new GIcon();
    var imagePath = "/gw/app_themes/" + theme + "/images/";
    
    houseIcon.image = cluster ? "/gw/images/red-house-many-new.png" : "/gw/images/red-house-new.png";
    houseIcon.iconSize = cluster ? new GSize(40, 46) : new GSize(33, 38);
    houseIcon.iconAnchor = new GPoint(20,16);
    houseIcon.shadowSize = new GSize(0, 0);
    
    var loc = new GLatLng(lat, lng);
    
    var pin = new GMarker(loc, {icon:houseIcon});
    
    var infoOverlayHtml = new houseInfoOverlay(pin, generateInfoHtml(title, desc, url, image, company, redirect, distance, bedrooms, price, loc));
    
    map.addOverlay(pin);
    
    GEvent.addListener(pin, "mouseover", function() { displayHouseOverlay(pin, infoOverlayHtml); });
    //displayHouseOverlay(pin, infoOverlayHtml);
    GEvent.addListener(pin, "mouseout", function() { hideHouseOverlay(this); });
    
    if (cluster)
    {
        GEvent.addListener(pin, "click", function() { displayHouseOverlay(pin, infoOverlayHtml); });
    }
    else
    {   
        if (redirect)
        {
            GEvent.addListener(pin, "click", function() { tb_show(null, url, false); });
        }
        else
        {     
            GEvent.addListener(pin, "click", function() { window.location.href = url; });
        }
    }
    
    markers.push(pin);
    veLatLongArray.push(loc);
}

function UpdateMapView() 
{ 
    showLoading();
    
    updateMap(false);
    
    ajaxRequest = true;
    
    queryStringID = "SearchResults_QueryStringHolder";
    
    if(useNewService)
    {
        getLatLongs("GetRedrawPins", queryString);
        //ReloadResults(query, updateMap);
    }
    else
    {
        getLatLongs("GetMapPins", queryString);
    }
}

function generateInfoHtml(title, desc, url, imageSrc, company, isRedirect, distance, bedrooms, price, loc)
{
    var cluster = (title == "Multiple developments");

    var outer = document.createElement("div");    
    outer.id = "overlaycontainer";
    outer.className = "#CLSS#";
        
    var dmrtop = document.createElement("img");
    dmrtop.className = "dmrimage";
    dmrtop.src = "/gw/images/popup/top.png";        
    
    var dmrContainer = document.createElement("div");
    dmrContainer.className = "dmrbody";
        
    var dmr = document.createElement("div");
    dmr.className = "dmrpadding";
    
    var dmrHeader = document.createElement("h1");
    dmrHeader.className = "dmrh1";
    dmrHeader.innerHTML = "Development Name:";
    
    dmr.appendChild(dmrHeader);
    
    if(!cluster)
    {
        var devLink = document.createElement("a");        
        
        if(isRedirect)
        {            
            devLink.className = "dsra thickbox";
            devLink.onclick = "tb_show(null, '" + url + "', false);";            
        }
        else
        {
            devLink.className = "dsra";
            devLink.href = url;
        }
        
        devLink.innerHTML = title.indexOf("<li>") > -1 ? title.substring(4) : title;
        
        dmr.appendChild(devLink);
        
        if (imageSrc != '')
        {
            var devImageLink = document.createElement("a");
            devImageLink.href = url;
            
            var devImage = document.createElement("img");                   
            devImage.src = imageSrc;
            
            devImageLink.appendChild(devImage);
            
            dmr.appendChild(devImageLink);
        }
        
        var devDesc = document.createElement("div");        
        devDesc.innerHTML = "<p class=\"dmrp\"><a href=\"" + url + "\">" + desc + "</a></p>";
        
        if(bedrooms.length > 0)
        {
            devDesc.innerHTML += "<p class=\"dmrp\"><a href=\"" + url + "\">" + bedrooms + " bedroom homes.</a></p>";
        }
        devDesc.innerHTML += "<p class=\"dmrp\"><a href=\"" + url + "\">Price from: " + price + "</a></p>";        
                
        if(parseFloat(distance) > "0")
        {
            var distPara = document.createElement("p");
            distPara.className = "dmrp";
            distPara.innerHTML = "<a href=\"" + url + "\">Distance: " + distance + " miles.</a>";
            
            devDesc.appendChild(distPara);
        }       
        
        dmr.appendChild(devDesc);
        
        var divClear = document.createElement("div");
        divClear.className = "clearfloat";
        
        dmr.appendChild(divClear);
    }
    else
    {
        dmr.innerHTML += unescape(desc);
    }    
    
    //var dmrzoom = document.createElement("div");
    //dmrzoom.className = "dmrzoom";
    
    var dmrbottom = document.createElement("img");
    dmrbottom.src = "/gw/images/popup/bottom.png";
    dmrbottom.className = "dmrimage";        
    
    // Zoom button
    var zoomAnchor = document.createElement("a");
    zoomAnchor.className = "zoombutton";
    
    var onclickAttr = document.createAttribute("onclick");
    onclickAttr.nodeValue = "centerAndZoom(" + loc.lat() + "," + loc.lng() + ");";
    
    zoomAnchor.setAttributeNode(onclickAttr);
    
    dmr.appendChild(zoomAnchor);
    
    // Close button    
    var closeAnchor = document.createElement("a");
    closeAnchor.className = "closebutton-map";  
    closeAnchor.innerHTML = "Close";
    
    var closeOnClickAttr = document.createAttribute("onclick");
    closeOnClickAttr.nodeValue = "hideHouseOverlayNow();";
    
    closeAnchor.setAttributeNode(closeOnClickAttr);
    
    dmr.appendChild(closeAnchor);
    
    var divClear2 = document.createElement("div");
    divClear2.className = "clearfloat";   
    dmr.appendChild(divClear2);
    
    dmrContainer.appendChild(dmr);
    
    outer.appendChild(dmrtop);
    outer.appendChild(dmrContainer);
    outer.appendChild(dmrbottom);
    
    return outer.outerHTML || new XMLSerializer().serializeToString(outer);
}