﻿// JScript File

var gMap = null;
var polygonPoints = new Array(0);   //To hold all the polygon points.

var fillColor = "#0000FF"; // blue fill
var lineColor = "#000000"; // black line
var opacity = .5;
var lineWeight = 2;
var JMarker = null;
var polyShape = null;
var polyLine = null;
var i = 0;              //Variable used to show the GMarker
var GMarkers = [];      //Variable used to show the GMarker
var LatLngToZoomToo = null;
var OverlayShape = null;
var PShapePoints = null;

var gHospitalSearch;
var gSchoolSearch;
var gRailSearch;
var gAirportSearch;
var gLibrary;
var gLocalSearchMarkers = [];
var zoomLevel;

var loadedOnPageLoad = 0;
var Counter;
var imgSz = new GSize(19, 19);
//var imgSz = new GSize(28, 28);
var iconAnchorPnt = new GPoint(6, 20);
var infoAnchorPnt = new GPoint(25, 1);

//Create CTMLS marker icon.
var class1 = new GIcon();
class1.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_residential.png";
class1.iconSize = imgSz;
class1.iconAnchor = iconAnchorPnt;
class1.infoWindowAnchor = infoAnchorPnt;

var class2 = new GIcon();
class2.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_condo.png";
class2.iconSize = imgSz;
class2.iconAnchor = iconAnchorPnt;
class2.infoWindowAnchor = infoAnchorPnt;

var class3 = new GIcon();
class3.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_multi.png";
class3.iconSize = imgSz;
class3.iconAnchor = iconAnchorPnt;
class3.infoWindowAnchor = infoAnchorPnt;

var class4 = new GIcon();
class4.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_lot.png";
class4.iconSize = imgSz;
class4.iconAnchor = iconAnchorPnt;
class4.infoWindowAnchor = infoAnchorPnt;

var class5 = new GIcon();
class5.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_commercial.png";
class5.iconSize = imgSz;
class5.iconAnchor = iconAnchorPnt;
class5.infoWindowAnchor = infoAnchorPnt;

var class6 = new GIcon();
class6.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_rental.png";
class6.iconSize = imgSz;
class6.iconAnchor = iconAnchorPnt;
class6.infoWindowAnchor = infoAnchorPnt;

var HospitalIcon = new GIcon();
HospitalIcon.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_07-01.png";
HospitalIcon.iconSize = imgSz;
HospitalIcon.iconAnchor = iconAnchorPnt;
HospitalIcon.infoWindowAnchor = infoAnchorPnt;

var SchoolIcon = new GIcon();
SchoolIcon.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_08-01.png";
SchoolIcon.iconSize = imgSz;
SchoolIcon.iconAnchor = iconAnchorPnt;
SchoolIcon.infoWindowAnchor = infoAnchorPnt;

var AirportIcon = new GIcon();
AirportIcon.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_10-01.png";
AirportIcon.iconSize = imgSz;
AirportIcon.iconAnchor = iconAnchorPnt;
AirportIcon.infoWindowAnchor = infoAnchorPnt;

var RailIcon = new GIcon();
RailIcon.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_11-01.png";
RailIcon.iconSize = imgSz;
RailIcon.iconAnchor = iconAnchorPnt;
RailIcon.infoWindowAnchor = infoAnchorPnt;

var LibIcon = new GIcon();
LibIcon.image = "http://www.ctreal.com/CMSTemplates/CTMLSSearchSite/images/ListingIcons/mapicon_09-01.png";
LibIcon.iconSize = imgSz;
LibIcon.iconAnchor = iconAnchorPnt;
LibIcon.infoWindowAnchor = infoAnchorPnt;

var allowedBounds = new GLatLngBounds(new GLatLng(40.35910267579199, -74.542236328125), new GLatLng(42.62183364891663, -70.9716796875));

var mapType = null;
var mapControl = null;
var mapZoom = null;

function loadMap()
{   
    if(loadedOnPageLoad == 1)
    {
        loadedOnPageLoad = 0;
        return;
    }
    
    zoomLevel = 8;
   
    var mapTypePosition = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(20, 10));
    var mapControlPosition = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(20, 10));
    var MapZoomPosition = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(35, 110));
    
    if(mapType == null)
        mapType = document.getElementById("MapType");
    mapTypePosition.apply(mapType);
    
    if(mapControl == null)
        mapControl = document.getElementById("MapControl");
    mapControlPosition.apply(mapControl);
    
    if(mapZoom == null)
        mapZoom = document.getElementById("MapZoom");
    MapZoomPosition.apply(mapZoom);

    //Initialize the map to the center of CT.
    gMap = new GMap2(document.getElementById("map"));
    gMap.setCenter(new GLatLng(41.500753, -72.757385), zoomLevel);

    //Add all the controls to the map.
    gMap.getContainer().appendChild(mapType);
    gMap.getContainer().appendChild(mapControl);   
    gMap.getContainer().appendChild(mapZoom);

    //Register the draw map function.
    drawPolygonOnMap();

    outlineCT();

    gMap.continuousZoomEnabled();

    GEvent.addListener(gMap, "move", function() { checkBounds(); });
    GEvent.addListener(gMap, "zoomend", function() { OnZoomEnd(); });

}



function OnZoomEnd()
{
    zoomLevel = gMap.getZoom();
}

function SetMapCenter()
{
    if(gMap != null)
        gMap.setCenter(LatLngToZoomToo, 12);
}

function GMapView()
{
    gMap.setMapType(G_NORMAL_MAP);
}

function GSatelliteView()
{
    gMap.setMapType(G_SATELLITE_MAP);
}

function GHybridView()
{
    gMap.setMapType(G_HYBRID_MAP);
}

function ZoomMap(dir)
{
    if(dir == "in")
        zoomLevel = zoomLevel + 1;
    else
        zoomLevel = zoomLevel -1;
        
    gMap.setZoom(zoomLevel);
}

function PanMap(pan)
{
    if (pan == "top")
        gMap.panDirection(0, 1);
    else if(pan == "left")
        gMap.panDirection(1, 0);
    else if(pan =="right")
        gMap.panDirection(-1, 0);
    else
        gMap.panDirection(0, -1);
}

function hideMapView()
{
    var upView = document.getElementById("upView");
    var UPMap = document.getElementById("UPMap");
    var pnlMap = document.getElementById("pnlMap");
    var primary_display_footerPage = document.getElementById("primary_footer");

    upView.style.display = 'block';
    UPMap.style.display = 'none';
    pnlMap.style.display = 'none';
    primary_display_footerPage.style.display = 'none';
    
    //Deactivate Sherpa
    var canIDraw = document.getElementById("checkbox_sherpa");
    canIDraw.disabled = 'disabled';
    canIDraw.checked = false;
}

function loadMapView()
{
    var upView = document.getElementById("upView");
    var UPMap = document.getElementById("UPMap");
    var primary_display_footerPage = document.getElementById("primary_footer");

    upView.style.display = 'none';
    UPMap.style.display = 'block';
    primary_display_footerPage.style.display = 'block';

    //load the map again.
    loadMap();
}

function showMapView()
{
    var upView = document.getElementById("upView");
    var UPMap = document.getElementById("UPMap");
    var pnlMap = document.getElementById("pnlMap");
    var primary_display_footerPage = document.getElementById("primary_footer");

    upView.style.display = 'none';
    UPMap.style.display = 'block';
    pnlMap.style.display = 'block';
    primary_display_footerPage.style.display = 'block';

    //load the map again.
    loadMap();

    if(GMarkers != null)
    {
        if(GMarkers.length > 0)
        {   
            for(var j=0; j<GMarkers.length; j++)
            {
                var markerID = GMarkers[j];
                //GEvent.addListener(markerID, "mouseover", function() { markerID.openInfoWindowHtml(html); });
                gMap.addOverlay(markerID);
            }
            
            SetMapCenter();
            toggle_POI("on");
        }
    }
    
    //Activate Sherpa
    var canIDraw = document.getElementById("checkbox_sherpa");
    canIDraw.disabled = false;
    canIDraw.checked = false;
    
    //Draw the polygon.
    drawPolygonShape();
}

function showMapViewSetNull()
{
    mapType = null;
    mapControl = null;
    mapZoom =null;

    showMapView();
}

function drawPolygonShape()
{
    if(PShapePoints == null || PShapePoints.length == 0)
        return;
    
    var PShape = new GPolygon(PShapePoints, lineColor, lineWeight, fillColor, opacity);
    gMap.addOverlay(PShape);
    gMap.setCenter(PShape.getBounds().getCenter(), 12);
}

// A Rectangle is a simple overlay that outlines a lat/lng bounds on the
    // map. It has a border of the given weight and color and can optionally
    // have a semi-transparent background color.
    function Rectangle(bounds, opt_weight, opt_color) {
      this.bounds_ = bounds;
      this.weight_ = opt_weight || 1;
      this.color_ = opt_color || "#000000";
    }
    Rectangle.prototype = new GOverlay();

    // Creates the DIV representing this rectangle.
    Rectangle.prototype.initialize = function(map) {
      // Create the DIV representing our rectangle
      var div = document.createElement("div");
      div.style.border = this.weight_ + "px solid " + this.color_;
      div.style.position = "absolute";
      div.style.background = "#000000";
      div.className = 'DivOverlay';

      // Our rectangle is flat against the map, so we add our selves to the
      // MAP_PANE pane, which is at the same z-index as the map itself (i.e.,
      // below the marker shadows)
      map.getPane(G_MAP_MAP_PANE).appendChild(div);

      this.map_ = map;
      this.div_ = div;
    }

    // Remove the main DIV from the map pane
    Rectangle.prototype.remove = function() {
      this.div_.parentNode.removeChild(this.div_);
    }

    // Copy our data to a new Rectangle
    Rectangle.prototype.copy = function() {
      return new Rectangle(this.bounds_, this.weight_, this.color_,
                           this.backgroundColor_, this.opacity_);
    }

    // Redraw the rectangle based on the current projection and zoom level
    Rectangle.prototype.redraw = function(force) {
      // We only need to redraw if the coordinate system has changed
      //if (!force) return;

      // Calculate the DIV coordinates of two opposite corners of our bounds to
      // get the size and position of our rectangle
      var c1 = this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
      var c2 = this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());

      // Now position our DIV based on the DIV coordinates of our bounds
      this.div_.style.width = Math.abs(c2.x - c1.x) + 20 + "px";
      this.div_.style.height = Math.abs(c2.y - c1.y) + 20 + "px";
      this.div_.style.left = (Math.min(c2.x, c1.x) - this.weight_) - 10 + "px";
      this.div_.style.top = (Math.min(c2.y, c1.y) - this.weight_) - 10 + "px";
    }

var DivOverlay = null;
    function displayViewportBounds(state) {
      
      if(state == "off" && DivOverlay == null)
        return;
      
      if(state != "on")
      {
        gMap.removeOverlay(DivOverlay);
        DivOverlay = null;
      }
      else{
            if(state == "on" && DivOverlay != null)
            {
                gMap.removeOverlay(DivOverlay);
                DivOverlay = null;
            }
            
            // Display a rectangle in the center of the map at about a quarter of
            // the size of the main map
            var bounds = gMap.getBounds();
            var southWest = bounds.getSouthWest();
            var northEast = bounds.getNorthEast();
            var lngDelta = (northEast.lng() - southWest.lng()) / 60;
            var latDelta = (northEast.lat() - southWest.lat()) / 60;
            var rectBounds = new GLatLngBounds(
                new GLatLng(southWest.lat() + latDelta,
                            southWest.lng() + lngDelta),
                new GLatLng(northEast.lat() - latDelta,
                            northEast.lng() - lngDelta));
            DivOverlay = new Rectangle(rectBounds);
            gMap.addOverlay(DivOverlay);
        }
    }

function mview_overlay(state)
	{
	    if (state == "on")
			{
				document.getElementById('mview_disable_overlay').style.color = '#FFFFFF';	
				document.getElementById('mview_enable_overlay').style.color = '#668798';
				displayViewportBounds("on");
			}
		else
			{
				
				document.getElementById('mview_disable_overlay').style.color = '#668798';
				document.getElementById('mview_enable_overlay').style.color = '#FFFFFF';
				displayViewportBounds("off");
			}
	}
	
	function toggle_POI(state)
	{
	    if(state == "on")
	    {
	        document.getElementById('poi_disable').style.color = '#FFFFFF';	
		    document.getElementById('poi_enable').style.color = '#668798';
		    
		    if(gLocalSearchMarkers.length == 0)
		        searchPointsOfInterest();
	    }
	    else
	    {
	        document.getElementById('poi_disable').style.color = '#668798';
			document.getElementById('poi_enable').style.color = '#FFFFFF';
			ClearPointOfInterests();
	    }
	}

// If the map position is out of range, move it back
function checkBounds() {

    //Redraw the overlay again.
    if(DivOverlay != null)
    {
        gMap.removeOverlay(DivOverlay);
        DivOverlay = null;
        
        displayViewportBounds("on");
    }

    // Perform the check and return if OK
    if (allowedBounds.contains(gMap.getCenter())) {
      return;
    }
    
    var C = gMap.getCenter();
    var X = C.lng();
    var Y = C.lat();

    var AmaxX = allowedBounds.getNorthEast().lng();
    var AmaxY = allowedBounds.getNorthEast().lat();
    var AminX = allowedBounds.getSouthWest().lng();
    var AminY = allowedBounds.getSouthWest().lat();

    if (X < AminX) {X = AminX;}
    if (X > AmaxX) {X = AmaxX;}
    if (Y < AminY) {Y = AminY;}
    if (Y > AmaxY) {Y = AmaxY;}
    gMap.setCenter(new GLatLng(Y,X));
}

function createMarker(latlng, searchclass, MLSID, address, addressLine2, price, style, beds, baths, sqft, timesViewed)
{
    var icon = null;
    var name = "name='btnDetailView" + MLSID + "'";
    var id= "id='btnDetailView" + MLSID + "'";

    if (beds != "0")
        beds = beds + " Bed.";
    else
        beds = '';
    
    if(baths != "0")
        baths = baths + " Bath";
    else
        baths = '';
    
    if(sqft != "0")
       sqft = sqft + " Apx. SqFt";
    else
       sqft = '';
    
    var html = "<table><tr><td height='8'></td></tr></table><table border='0' cellpadding='0' cellspacing='0' width='210'><tr><td width='120'><table><tr><td width='120' valign='top'><a class='lnk_10B'" + name + " " + id + "onclick='javascript:showDetailView(this);' href='#'><img class='border_2B' src='/DisplayImage.aspx?ID=" + MLSID + "' border='0' alt='' width='108' height='68' /></a></td><td width='10'></td><td valign='top' width='80'><table border='0' cellspacing='0' cellpadding='0' width='120'><tr><td><a class='lnk_10B'" + name + " " + id + " onclick='javascript:showDetailView(this);' href='#'> Price:" + price + "</a></td></tr><tr><td height='5'></td></tr><tr><td class='GMGrey'>" + style + "</td></tr><tr><td class='GMGrey'>" + address + "</td></tr><tr><td class='GMGrey'>" + addressLine2 + "</td></tr><tr><td height='5'></td></tr><tr><td class='GMGrey'>" + beds + " " + baths + " </td></tr><tr><td class='GMGrey'>" + sqft + " </td></tr><tr><td class='GMGrey'>Viewed: " + timesViewed + "</td></tr></table><table border='0' cellspacing='0' cellpadding='0' width='120'><tr><td height='5'></td></tr></table><table border='0' cellspacing='0' cellpadding='0' width='120'><tr><td><a class='lnk_10B' " + name + " " + id + " onclick='javascript:showDetailView(this);' href='#'>Full Details</a></td></tr><tr><td height='1'></td></tr><tr><td height='1'></td></tr></table></td></tr></table></td></tr></table>";
    
    if(searchclass == 1)
        icon = class1;
    else if(searchclass == 2)
        icon = class2;
    else if(searchclass == 4)
        icon = class3;
    else if(searchclass == 8)
        icon = class4;
    else if(searchclass == 16)
        icon = class5;
    else
        icon = class6;
    
    var marker = null;
    marker = new GMarker(latlng, icon);
    GEvent.addListener(marker, "mouseover", function() { marker.openInfoWindowHtml(html); });
    gMap.addOverlay(marker);
    
    if(i == -1)
    {
        i = 0;
    }
    
    GMarkers[i] = marker;
    i++;
    
    //return marker;
}

function searchPointsOfInterest()
{
    if(gLocalSearchMarkers.length > 0)
        ClearPointOfInterests();
    else
    {    
        gLocalSearchMarkers = [];
            
        gHospitalSearch = new GlocalSearch();
        gHospitalSearch.setResultSetSize(GSearch.LARGE_RESULTSET);
        gHospitalSearch.setCenterPoint(gMap);
        gHospitalSearch.setSearchCompleteCallback(null, OnHospitalSearchCompleted);
        gHospitalSearch.setUserDefinedClassSuffix("H");
        gHospitalSearch.execute("hospital");
        
        gSchoolSearch = new GlocalSearch();
        gSchoolSearch.setResultSetSize(GSearch.LARGE_RESULTSET);
        gSchoolSearch.setCenterPoint(gMap);
        gSchoolSearch.setSearchCompleteCallback(null, OnSchoolSearchCompleted);
        gSchoolSearch.setUserDefinedClassSuffix("S");
        gSchoolSearch.execute("school");
        
        gAirportSearch = new GlocalSearch();
        gAirportSearch.setResultSetSize(GSearch.LARGE_RESULTSET);
        gAirportSearch.setCenterPoint(gMap);
        gAirportSearch.setSearchCompleteCallback(null, OnAirportSearchCompleted);
        gAirportSearch.setUserDefinedClassSuffix("S");
        gAirportSearch.execute("airport");
        
        gRailSearch = new GlocalSearch();
        gRailSearch.setResultSetSize(GSearch.LARGE_RESULTSET);
        gRailSearch.setCenterPoint(gMap);
        gRailSearch.setSearchCompleteCallback(null, OnRailSearchCompleted);
        gRailSearch.setUserDefinedClassSuffix("S");
        gRailSearch.execute("railway station");
        
        gLibrary = new GlocalSearch();
        gLibrary.setResultSetSize(GSearch.LARGE_RESULTSET);
        gLibrary.setCenterPoint(gMap);
        gLibrary.setSearchCompleteCallback(null, OnLibrarySearchCompleted);
        gLibrary.setUserDefinedClassSuffix("S");
        gLibrary.execute("library");
    }
}

function checkDrawCheckBox()
{
    var chkDraw = document.getElementById("chkDraw");
    chkDraw.checked = true;
}

function clearDrawing()
{
    alert("Existing Properties on the map will be cleared.");
        
    //clear everything.
    gMap.clearOverlays();
        
    GMarkers = [];
        
    polygonPoints = [];
}

function TimeOutClearMap()
{
   alert("Your search took too long to complete. Please narrow down your criteria.");
        
    //clear everything.
    gMap.clearOverlays();
        
    GMarkers = [];
        
    polygonPoints = [];
}

function OnHospitalSearchCompleted()
{
    if(!gHospitalSearch.results) return;

    for(var i=0; i<gHospitalSearch.results.length; i++)
        gLocalSearchMarkers.push(new LocalSearch(gHospitalSearch.results[i], HospitalIcon));
}

function OnSchoolSearchCompleted()
{
   if(!gSchoolSearch.results) return;
    
    for(var i=0; i<gSchoolSearch.results.length; i++)
        gLocalSearchMarkers.push(new LocalSearch(gSchoolSearch.results[i], SchoolIcon));
}

function OnAirportSearchCompleted()
{
    if(!gAirportSearch.results) return;
    
    for(var i=0; i<gAirportSearch.results.length; i++)
        gLocalSearchMarkers.push(new LocalSearch(gAirportSearch.results[i], AirportIcon));
}

function OnRailSearchCompleted()
{
    if(!gRailSearch.results) return;
    
    for(var i=0; i<gRailSearch.results.length; i++)
        gLocalSearchMarkers.push(new LocalSearch(gRailSearch.results[i], RailIcon));
}

function OnLibrarySearchCompleted()
{
    if(!gLibrary.results) return;
    
    for(var i=0; i<gLibrary.results.length; i++)
        gLocalSearchMarkers.push(new LocalSearch(gLibrary.results[i], LibIcon));
}

function LocalSearch(result, icon)
{

    var s = result.title + "<br/>" + result.streetAddress + ",<br/>" + result.city;
    var html = "<span class='propertyBlueStyle'>" + s + "</span>";
    var marker = new GMarker(new GLatLng(result.lat, result.lng), icon);
    GEvent.addListener(marker, "mouseover", function() { marker.openInfoWindowHtml(html); }); 
    gMap.addOverlay(marker);
    return marker;
}

function ClearPointOfInterests()
{
    for(var i=0; i<gLocalSearchMarkers.length; i++)
        gMap.removeOverlay(gLocalSearchMarkers[i]);

    gLocalSearchMarkers = [];
}

function ClearResultsOnMap()
{
    var canIDraw = document.getElementById("checkbox_sherpa");
    if(canIDraw.checked == true)
    {
        toggleTownSearch("off");
        if(GMarkers.length > 0)
        {
            var answer = confirm("Results on the map will be cleared.");
            if(answer)
                gMap.clearOverlays();
            else
                canIDraw.checked = false;
        }
    }
    else
        toggleTownSearch("on");
}



function drawPolygonOnMap()
{
      var canIDraw = document.getElementById("checkbox_sherpa");
      var mapElement = document.getElementById("map");
      
      
           
      //Array to hold all the points.
      var linePoints = new Array(0);
          
      GEvent.addListener(gMap, "click", function (PMarker, clickLatLng)
      { 
        if (canIDraw.checked == true)   //If I can draw.
          {
            if(clickLatLng)  //If the map is clicked and not a marker.
            { 
              //Push the next latlng into the array.
              polygonPoints.push(clickLatLng);
              
              //Remove all the markers on the map.
              //gMap.clearOverlays();
              if(polyShape != null)
                gMap.removeOverlay(polyShape);
              
              if(polygonPoints.length == 2)
              {
                var polyline = new GPolyline(polygonPoints, lineColor, lineWeight, opacity);
                gMap.addOverlay(polyline);
              }
              else if (polygonPoints.length > 2)
              {
                polyShape = new GPolygon(polygonPoints, lineColor,lineWeight,opacity,fillColor);
                gMap.addOverlay(polyShape);
              }
              
              //Always display the first marker. This is the marker which will be used to close the polygon.
              PMarker = new GMarker(polygonPoints[0]);
              
              GEvent.addListener(PMarker, "mouseover", function() { PMarker.openInfoWindowHtml("<span class='txt_10B'>Double click this marker<br/>to close the shape.</span>"); });
              
              //Add the marker and the polygon.
              gMap.addOverlay(PMarker);
              
              //The polygon can only be closed if there are more then two points on the map.
              if (polygonPoints.length > 2)
              {               
                GEvent.addListener(PMarker, "dblclick", closePolygon);
              }
            }
          }
      });
      
      //Used to change the style of the map element (div element). 
      //Changes the cursor.
      GEvent.addDomListener(canIDraw, "click", function ()
      {
        if(canIDraw.checked == true)
        {
          mapElement.className = mapElement.className.replace("view", "edit");
        }
        else
          mapElement.className = mapElement.className.replace("edit", "view");
      });
}

function closePolygon()
{
      var canIDraw = document.getElementById("chkDraw");
      if(canIDraw != null)
      {
        canIDraw.checked = false;
        
        var mapElement = document.getElementById("map");
        mapElement.className = mapElement.className.replace("edit", "view");
      }
      
      //push the first point in the points array.
      polygonPoints.push(polygonPoints[0]);
      
      //clear everything.
      gMap.clearOverlays();
      
      //Draw the polygon again.
      polyShape = new GPolygon(polygonPoints, lineColor,lineWeight,opacity,fillColor,opacity);
      
      gMap.addOverlay(polyShape);      
      
      var bounds = polyShape.getBounds();
      
      gMap.panTo(bounds.getCenter());
      var center = bounds.getCenter();
      var FirstLatLng = polygonPoints[0];
      
      var middleMarker = new GMarker(bounds.getCenter());
      gMap.addOverlay(middleMarker);

      GEvent.addListener(middleMarker, "click", function (JMarker, latlng)
      {
          middleMarker.showMapBlowup(); 
      });
      
      //Set the coordiantes
      SetCoordinates();
          
      //Clear the polygon points array.
      polygonPoints = [];
      
      //Do a post back.
      var btnMarkerClick = document.getElementById("btnMarkerClick");
      btnMarkerClick.click();
}

function SetCoordinates()
{
    var hPolygonArea = document.getElementById('hPolygonArea');
    hPolygonArea.value = '';
    
    for(var i = 0; i < polygonPoints.length; i++)
    {
        if( i == polygonPoints.length - 1)
            hPolygonArea.value = hPolygonArea.value + polygonPoints[i];
        else
            hPolygonArea.value = hPolygonArea.value + polygonPoints[i] + ';';
    }
}



function showGMarker(i)
{
    if(i == -1)
    {
        alert("Google Error. Unable to show listing on the map.");
        return;
    }

    var marker = GMarkers[i];

    if(marker != null)
    {
        showMapView();
        
        GEvent.trigger(marker, "mouseover");
        toggle_POI("on");
    }
}

function showGMarkerFromList(i)
{
    mapType = null;
    mapControl = null;
    mapZoom = null;

    showGMarker(i);
}

function outlineCT()
    {

	var BPoints = new Array();
    BPoints.push(new GLatLng('41.012520','-73.654152'));
    BPoints.push(new GLatLng('41.100700','-73.727700'));
    BPoints.push(new GLatLng('41.212750','-73.481954'));
    BPoints.push(new GLatLng('41.295100','-73.551360'));
    BPoints.push(new GLatLng('41.365204','-73.543460'));
    BPoints.push(new GLatLng('41.522652','-73.531150')); 
    BPoints.push(new GLatLng('41.522652','-73.530823')); 
    BPoints.push(new GLatLng('41.665592','-73.517578'));
    BPoints.push(new GLatLng('42.047337','-73.484665'));
	BPoints.push(new GLatLng('42.036217','-73.046082')); 
    BPoints.push(new GLatLng('42.035915','-73.006546'));
    BPoints.push(new GLatLng('42.033413','-72.816910')); 
    BPoints.push(new GLatLng('41.997089','-72.818138'));
    BPoints.push(new GLatLng('42.002071','-72.768036'));
    BPoints.push(new GLatLng('42.033752','-72.756355')); 
    BPoints.push(new GLatLng('42.030441','-72.609993')); 
    BPoints.push(new GLatLng('42.022705','-72.608292'));
    BPoints.push(new GLatLng('42.021511','-72.582375'));
    BPoints.push(new GLatLng('42.030029','-72.571693'));
    BPoints.push(new GLatLng('42.030670','-72.508041'));
    BPoints.push(new GLatLng('42.026306','-72.136826'));
    BPoints.push(new GLatLng('42.025703','-72.095451'));
    BPoints.push(new GLatLng('42.023500','-71.800617')); 
    BPoints.push(new GLatLng('42.008000','-71.799117')); 
    BPoints.push(new GLatLng('41.721504','-71.788734'));	
    BPoints.push(new GLatLng('41.641659','-71.793091'));
    BPoints.push(new GLatLng('41.601208','-71.790680'));
    BPoints.push(new GLatLng('41.415730','-71.803230'));
	BPoints.push(new GLatLng('41.403755','-71.846481'));
	BPoints.push(new GLatLng('41.341862','-71.837357'));
	BPoints.push(new GLatLng('41.325249','-71.848259')); 
   
   
    var BShape = new GPolyline(BPoints, lineColor,lineWeight,opacity,fillColor,opacity);
    
    gMap.addOverlay(BShape);    
      
      
    }
    
    
        var compareSelected = 0;
    function CanCompare(chk)
    {
        if(chk.checked == false)
        {
            compareSelected = compareSelected - 1;
            return;
        }
            
        if(compareSelected >= 5)
        {
            chk.checked = false;
            alert("Only five listings can be selected for comparision.");
        }
        else
            compareSelected = compareSelected + 1;
    }

function showDetailView(btn)
{
    var MLSSystemID = document.getElementById("MLSSystemID");
    MLSSystemID.value = btn.name;
    
    var btnDetailClick = document.getElementById("btnDetailClick");
    btnDetailClick.click();
}