﻿// JScript File
window.clickedJs = null;
function BOSShowModalPopup(id, jsCode) {
    if (jsCode == "")
        return false;

    if (jsCode.disabled == true || jsCode.disabled == "disabled")
        return false;

    if (window.clickedJs == null) {
        window.clickedJs = jsCode + "";
        $find(id).show();
        return false;
    }
    return true;
}

function BOSShowModalPopupWithMessage(id, jsCode, message) {
    if (jsCode == "")
        return false;

    if (jsCode.disabled == true || jsCode.disabled == "disabled")
        return false;

    if (window.clickedJs == null)
    {
        document.getElementById("bosMessageWarningText").innerHTML = message;
        
        if ((jsCode+"").substr(0, 11) == "javascript:")
            window.clickedJs = jsCode+"";
        else
            window.clickedJs = jsCode;
        $find(id).show();
        return false;
    }
    return true;
}

function ModalPopupConfirmed() {
    if (window.clickedJs != null)
    {
        if (typeof(window.clickedJs) == "string")
        {
            window.clickedJs = window.clickedJs + "";
            window.clickedJs = window.clickedJs.substr(11);
            setTimeout(window.clickedJs, 5);
        }
        else setTimeout("window.clickedJs.click()", 5);
    }
}

function ModalPopupCanceled() {
   window.clickedJs = null;
}

var marker;
var overlayInstance = null;
var map;
var client;
var lastMarkerLocation;
var panorama;
var mapT;

    //something happens b4 this point that makes the rest not work
function addStreetView(latlng) {
    var guyIcon = new GIcon(G_DEFAULT_ICON);
    guyIcon.image = "http://maps.google.com/intl/en_us/mapfiles/cb/man_arrow-0.png";
    guyIcon.transparent = "http://maps.google.com/intl/en_us/mapfiles/cb/man-pick.png";
    guyIcon.imageMap = [
        26,13, 30,14, 32,28, 27,28, 28,36, 18,35, 18,27, 16,26,
        16,20, 16,14, 19,13, 22,8
     ];
    guyIcon.iconSize = new GSize(49, 52);
    guyIcon.iconAnchor = new GPoint(25, 35);  // near base of guy's feet
    guyIcon.infoWindowAnchor = new GPoint(25, 5);  // top of guy's head

    //console.log(       guyIcon.image)
   // console.log("guyIcon", guyIcon)
    //console.log("marker", marker)
    marker = new GMarker(latlng, {icon: guyIcon, draggable: true});
    map.addOverlay(marker);
    //console. log("marker", marker)

    //console.log(       guyIcon.image)

    //console.log("adding marker", marker);
    //console. log("marker", marker)

    //console.log(       guyIcon.image)
    
    GEvent.addListener(marker, "dragend", onDragEnd);
    GEvent.addListener(marker, "click", openPanoramaBubble);
    
    toggleOverlay();
    
    lastMarkerLocation = latlng;
}

        
        
        
function ShowGoogleMap() {
    if (GBrowserIsCompatible())
    {
        window.btnInterval = null;
        GPolygon.prototype.Contains = function(point) 
        {
            var j=0;
            var oddNodes = false;
            var x = point.lng();
            var y = point.lat();
            for (var i = 0; i < this.getVertexCount(); i++)
            {
                j++;
                if (j == this.getVertexCount()) {j = 0;}
                if (((this.getVertex(i).lat() < y) && (this.getVertex(j).lat() >= y)) || ((this.getVertex(j).lat() < y) && (this.getVertex(i).lat() >= y))) 
                {
                    if (this.getVertex(i).lng() + (y - this.getVertex(i).lat()) / (this.getVertex(j).lat() - this.getVertex(i).lat()) * (this.getVertex(j).lng() - this.getVertex(i).lng()) < x)
                    {
                        oddNodes = !oddNodes
                    }
                }
            }
            return oddNodes;
        }

        GPolyline.prototype.Contains = GPolygon.prototype.Contains;       
        
        
        
        
        
        client = new GStreetviewClient();


        map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(latitude, longitude), accuracy);        
        var latlng = new GLatLng(latitude, longitude);


        addStreetView(latlng);


   


        var request = GXmlHttp.create();
        request.open("GET", "../../../../../../areas.xml", true);
        request.onreadystatechange = function()
        {
            if (request.readyState == 4) 
            {
                var xmlDoc = GXml.parse(request.responseText);
                var areas = xmlDoc.documentElement.getElementsByTagName("polyline");

                for (var j = 0; j < areas.length; j++) 
                {
                    // get any line attributes
                    var color = areas[j].getAttribute("color");
                    var borderOpacity = areas[j].getAttribute("borderOpacity") != null ? parseFloat(areas[j].getAttribute("borderOpacity")) : 0.0;
                    var areaOpacity = areas[j].getAttribute("areaOpacity") != null ? parseFloat(areas[j].getAttribute("areaOpacity")) : 0.0;
                    var borderColor = areas[j].getAttribute("borderColor") != null ? areas[j].getAttribute("borderColor") : null;
                    var width  = parseFloat(areas[j].getAttribute("width"));
                    
                    // read each point on that line
                    var points = areas[j].getElementsByTagName("point");
                    var pts = [];
                    for (var k = 0; k < points.length; k++) 
                    {
                        pts[k] = new GLatLng(parseFloat(points[k].getAttribute("lat")),
                        parseFloat(points[k].getAttribute("lng")));
                    }
                    polygons[j] = new GPolygon(pts, borderColor, width, borderOpacity, color, areaOpacity );
                    polygons[j].url = areas[j].getAttribute("url");
                }

                var pointToArea = null;
                if (pid.length == 1)
                {
                    var txtLatLng = coord[0].split(",");
                    var pointToArea = new GLatLng(txtLatLng[0],txtLatLng[1]);
                }

                for (j = 0; j < polygons.length; j++)
                {
                    //map.addOverlay(polygons[j]);
                    if (pointToArea != null)
                    {
                        if (polygons[j].Contains(pointToArea) && polygons[j].url != null)
                        {
                            window.btnInterval = setInterval("ShowAdditionalLink('" + polygons[j].url + "')", 100);
                        }
                    }
                }
            }
        }
        request.send(null);

        // Adding a Property markers
        for (var i = 0; i < pid.length; i++)
        {
            var coordArray = coord[i].split(",");
            var point = new GLatLng(coordArray[0],coordArray[1]);
            
            if(isValid == 'True')
            {
                map.addOverlay(createMarker(point, i, showBubble, loggedUserID));
            }
        }

        // Adding a Train markers
        for (var i = 0; i < trainStantion.length; i++)
        {
            if(trainStantion[i] != "")
            {
                var point = new GLatLng(trainLat[i],trainLng[i]);
                map.addOverlay(createTrainMarker(point, i));
            }
        }

        // Adding a School markers
        for (var i = 0; i < schoolName.length; i++)
        {
            if(schoolName[i] != "")
            {
                var point = new GLatLng(schoolLat[i],schoolLng[i]);
                map.addOverlay(createSchoolMarker(point, i));
            }
        }
        
    }
}

function openPanoramaBubble() {

 /* var contentNode = document.createElement('div');
  contentNode.style.textAlign = 'center';
  contentNode.style.width = '458px';
  contentNode.style.height = '260px';
  contentNode.innerHTML = 'Loading panorama';*/

  var smallNode = document.getElementById("pano");
  smallNode.style.display = "block";
  //marker.openInfoWindow(smallNode, {maxContent: contentNode, maxTitle: "Full screen"});

  panorama = new GStreetviewPanorama(smallNode);
  panorama.setLocationAndPOV(marker.getLatLng(), null);
  GEvent.addListener(panorama, "pano", onNewLocation);
  GEvent.addListener(panorama, "yawchanged", onYawChange); 
  window.setTimeout("panorama.checkResize()", 5)

  //panorama.setContainer(smallNode);  
  //window.setTimeout("panorama.checkResize()", 5);

 /*var iw = map.getInfoWindow();
  GEvent.addListener(iw, "maximizeend", function() {
    panorama.setContainer(contentNode);  
    
  });
  GEvent.addListener(marker, "infowindowbeforeclose", function() {
    panorama.remove();
  });*/
}

function toggleOverlay() {
  if (!overlayInstance) {
    overlayInstance = new GStreetviewOverlay();
    map.addOverlay(overlayInstance);
  } else {
    map.removeOverlay(overlayInstance);
    overlayInstance = null;
  }
}

function onYawChange(newYaw) {
    
  var GUY_NUM_ICONS = 16;
  var GUY_ANGULAR_RES = 360/GUY_NUM_ICONS;
  if (newYaw < 0) {
    newYaw += 360;
  }
  guyImageNum = Math.round(newYaw/GUY_ANGULAR_RES) % GUY_NUM_ICONS;
  guyImageUrl = "http://maps.google.com/intl/en_us/mapfiles/cb/man_arrow-" + guyImageNum + ".png";
  marker.setImage(guyImageUrl);
}

function onNewLocation(lat, lng) {
    
  var latlng = new GLatLng(lat, lng);
  marker.setLatLng(latlng);
}

function onDragEnd() {
  var latlng = marker.getLatLng();
  if (panorama) {
    client.getNearestPanorama(latlng, onResponse);
  }
}

function onResponse(response) {
  
  if (response.code != 200) {
    marker.setLatLng(lastMarkerLocation);
  } else {
    var latlng = new GLatLng(response.Location.lat, response.Location.lng);
    marker.setLatLng(latlng);
    lastMarkerLocation = latlng;
    openPanoramaBubble();
  }
}


function ShowAdditionalLink(url) {
    try
    {
        document.getElementById("localAreaTop").style.display = 'inline';
        document.getElementById("localAreaTopLink").href = url;

        document.getElementById("localAreaBottom").style.display = 'inline';
        document.getElementById("localAreaBottomLink").href = url;

        clearInterval(window.btnInterval);
    }
    catch(e)
    {
    }
}

var icons = new Array("iconFlatTopRight.gif","iconFlatTopLeft.gif","iconFlatBottomLeft.gif","iconFlatBottomRight.gif","iconTrain.gif","iconSchool.gif");
var iconsShadow = new Array("iconFlatShadow.gif","iconFlatShadow.gif","iconFlatShadow.gif");

function createIcon(index, posx, posy) {
    var icon = new GIcon();

    icon.image = "http://estates.thomasgeorge.net/images/public/map/" + icons[index];
    icon.shadow = "http://estates.thomasgeorge.net/images/public/map/iconFlatShadow" //+ iconsShadow[index];
    icon.iconSize = new GSize(20, 25);
    //icon.shadowSize = new GSize(21, 24);
    icon.iconAnchor = new GPoint(posx, posy);
    icon.infoWindowAnchor = new GPoint(9, 0);
    return icon;
}

// Creates a marker at the given point with the given number label
function createMarker(point, number, showBuble, LoggedUserID) {
    var iconPaddingArray = iconPadding[number].split("#");
    var marker = new GMarker(point, createIcon(iconIndexes[number], iconPaddingArray[0], iconPaddingArray[1]));

    //var marker = new GMarker(point);
    //var showBuble = '<%= ShowBubble %>';

    if (showBuble == 'True') {
        var text = 
        '<table id="bubble_property">' +
            '<tr>' +
                '<td rowspan="4" class="thumb">' +
                    '<img src="' + imagePath[number] + '" alt="" />' +
                '</td>' +
            '</tr>' +
            '<tr>' +
                '<td class="price">Price: &pound;' + price[number] + '</td>' +
            '</tr>' +
            '<tr>'+
                '<td class="type">Type: ' + propType[number] + '</td>' +
            '</tr>' +
            '<tr>' +
                '<td class="bedrooms">Bedrooms: ' + bedroomsCount[number] + '</td>' +
            '</tr>' +
            '<tr>'+
                '<td class="shortlist" >' +
                    '<a href="javascript:add(\'' + LoggedUserID + '\',\'' + pid[number] + '\');" style="display:' + showShortListButton[number] + ';"><img src="http://estates.thomasgeorge.net/images/public/btn_shortlist.gif" alt="Add to Shortlist" /></a>' +
                    '<img src="http://estates.thomasgeorge.net/images/public/btn_shortlisted.gif" style="display:' + showShortListedImage[number] + ';" src="Shortlisted" />' +
                '</td>' +
                '<td class="viewDetails">' +
                    '<a href="javascript:redirect(\'' + detailsUrl[number] + '\');"><img src="http://estates.thomasgeorge.net/images/public/btn_details.gif" alt="View Details" /></a>' +
                '</td>' +
            '</tr>' +
        '</table>';

        GEvent.addListener(marker, "click", function() {
            marker.openInfoWindowHtml(text);
        });
    }
return marker;
}

// Creates a marker at the given point with the given number label for train
function createTrainMarker(point, number) {
    var marker = new GMarker(point, createIcon(4, 0, 0));
    var train = 
        '<table id="bubble_train">' +
          '<tbody>' +
            '<tr>' +
              '<td class="stName">' + trainStantion[number] + '</td>' +
            '</tr>' +
            '<tr>' +
              '<td class="stOperator">' + trainOperator[number] + '</td>' +
            '</tr>' +
            '<tr>' +
              '<td class="stPostcode">' + trainPostcode[number] + '</td>' +
            '</tr>' +
          '</tbody>' +
        '</table>';

    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(train);
    });
    return marker;
}

// Creates a marker at the given point with the given number label for train
function createSchoolMarker(point, number) {
    var marker = new GMarker(point, createIcon(5, 0, 0));
    var school =
        '<table id="bubble_school">' +
          '<tbody>' +
            '<tr>' +
              '<td class="schName">' + schoolName[number] + '</td>' +
            '</tr>' +
            '<tr>' +
              '<td class="schType">' + schoolType[number] + '</td>' +
            '</tr>' +
            '<tr>' +
              '<td class="schAddress">' + schoolAddress[number] + '<br />' + schoolPostcode[number] + '</td>' +
            '</tr>' +
          '</tbody>' +
        '</table>';

    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(school);
    });
    return marker;
}

function redirect(url) {
    window.location = url;
}

function add(userid,prid) {
    Bos.Google.WebService.AddToShortList(userid,prid, OnSuccessCallback, OnServiceError);
}

function OnSuccessCallback() {
    var url = window.location.href;
    
    if (url.indexOf("refresh") < 0) {
        if (url.indexOf("?") > 0)
            url = url + "&refresh=true";
        else
            url = url + "?refresh=true";
    }
    window.location.href = url;
}

function OnServiceError() {
}

function FocusSubmit(buttonid) {
    alert(buttonid);
    document.getElementById(buttonid).focus();
    return false;
}

function HistoryBack() {
    if (window.history.length > 0)
    {
        window.history.back();
    }
    return false;
}
