﻿    // JScript File

    // This function adds the point to the map
    var geocoder;
    var map;
    var i=0;
    var J=0;
    var arrProperty;
    var arrPropertyAddress;
    var arrPropertyURL;
    
     var gmarkers = [];

      var htmls = [];
 
      var to_htmls = [];
  
      var from_htmls = [];
 
      var k=0;

       
 
      function tohere(k) {
 
      gmarkers[k].openInfoWindowHtml(to_htmls[k]);
  
      }
 
       
  
      function fromhere(k) {
  
      gmarkers[k].openInfoWindowHtml(from_htmls[k]);
  
      }
  
   
    
    function showMap(address,htmlProperty,htmlAddress,htmlURL)
    { 
    //alert('aa');
    try
    {
    // Create new map object
    gmap = new GMap2(document.getElementById("ctl00_c_map"));

    //create mapextension class to be used to add/remove results from the map.
    mapExtension = new esri.arcgis.gmaps.MapExtension(gmap);

    //create mapOptions to specify opacity, minResolution, maxResolution when adding to the map.
    var mapOptions = {opacity: 0.75, minResolution:0, maxResolution: 19};

    //create custom tile layer
    var tiledmap = new esri.arcgis.gmaps.TiledMapServiceLayer("http://maps.dcgis.dc.gov/DCGIS/rest/services/Basemap-WebMercator/MapServer", mapOptions, addTiledMap);

    var arrAddress=address.split("|")
    arrProperty=htmlProperty.split("|");
    arrPropertyAddress=htmlAddress.split("|");
    arrPropertyURL=htmlURL.split("|");
    
    for (i=0;i<=arrAddress.length;i++)
    {
       // J =i;
   // alert(J);
        geocoder = new GClientGeocoder();

        geocoder.getLocations(arrPropertyAddress[i]+','+arrAddress[i], addToMap);
        }
    }
    catch(err)
    {
        //alert(err);
    }
    }
    function addToMap(response)
    {
    try
    {
    // Retrieve the object
    place = response.Placemark[0];
    //var t = response.
    // Retrieve the latitude and longitude
    point = new GLatLng(place.Point.coordinates[1],
    
    place.Point.coordinates[0]);
    //alert(place.Point.coordinates[1]);
    //alert(place.Point.coordinates[0]);
    // Center the map on this point
    gmap.setCenter(point, 10);
    gmap.addOverlay(createMarker(point,place));
    }
    catch(err)
    {
    }
    }

    function createMarker(point,place) 
    {
    
    try
    {
     var marker = new GMarker(point);
     var html ='';
     var plG ='';
      var plU='';
      var match =0;
     for(m=0;m<arrPropertyAddress.length;m++)
     {
        plG=place.address;
       plG=plG.substring(0,plG.indexOf(',')).toLowerCase().replace(" ","");
      plU=arrPropertyAddress[m]
          plU=plU.substring(0,plU.indexOf('<br')).toLowerCase().replace(" ","");
          
          if(plG==plU)
          {
             html = "<div><font face='Arial' style='font-size: 9pt'><b>" + arrProperty[m] + "</b></font></div>\n<div><font face='Arial' style='font-size: 9pt'>" + arrPropertyAddress[m] + "</font><br><font face='Arial' style='font-size: 9pt'><a href='" + arrPropertyURL[m] + "'>View property details</a></font></div>";
             match =1;
            break;
          }
     }
     if(match ==0)
     {
     for(m=0;m<arrPropertyAddress.length;m++)
     {
     plG=place.address;
       plG=plG.substring(0,plG.indexOf(',')).toLowerCase().replace(" ","");
      plU=arrPropertyAddress[m]
          plU=plU.substring(0,plU.indexOf('<br')).toLowerCase().replace(" ","");
        
         if(plG.substring(0,4)==plU.substring(0,4))
          {            
             html = "<div><font face='Arial' style='font-size: 9pt'><b>" + arrProperty[m] + "</b></font></div>\n<div><font face='Arial' style='font-size: 9pt'>" + arrPropertyAddress[m] + "</font><br><font face='Arial' style='font-size: 9pt'><a href='" + arrPropertyURL[m] + "'>View property details</a></font></div>";           
            break;
          }
     }
     }
        
     to_htmls[k] = html + '<br>Directions: <b>To here</b> - <a href="javascript:fromhere(' + k + ')">From here</a>' +
  
      '<br>Start address:<form action="http://maps.google.com/maps" method="get" target="_blank">' +
  
      '<input type="text" SIZE=30 MAXLENGTH=40 name="saddr" id="saddr" value="" class="textbox" /><br/>' +
  
      '<INPUT class="getdirection-button" value="Submit" TYPE="SUBMIT"><br/><a href="javascript: zoomInHere()">Zoom Here</a>' +
  
      '<input type="hidden" name="daddr" value="' +
  
      place.Point.coordinates[1] + ',' + place.Point.coordinates[0] + "(" + place.address + ")" + '"/>';
  
       
  
      // The info window version with the "to here" form open
  
      from_htmls[k] = html + '<br>Directions: <a href="javascript:tohere(' + k + ')">To here</a> - <b>From here</b>' +
 
      '<br>End address:<form action="http://maps.google.com/maps" method="get"" target="_blank"> ' +
  
      '<input type="text" SIZE=30 MAXLENGTH=40 name="daddr" id="daddr" value="" class="textbox" /> <br/> ' +
  
      '<INPUT class="getdirection-button" value="Submit" TYPE="SUBMIT"> <br/><a href="javascript: zoomInHere()">Zoom Here</a>' +
 
      '<input type="hidden" name="saddr" value="' + place.Point.coordinates[1] + ',' + place.Point.coordinates[0] + "(" + place.address + ")" + '"/> ';
      
 
       
  
      // The inactive version of the direction info
  
      html = html + '<br> Directions: <a href="javascript:tohere('+k+')"> To here</a> - <a href="javascript:fromhere('+k+')"> From here</a> ';
       html = html + '<br><a href="javascript: zoomInHere()">Zoom Here</a>';
       
    
    J++;
    
    gmarkers[k] = marker;
  
      htmls[k] = html;
 
      k++;
    
   
    GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(html);
    });

    return marker;
    }
    catch(err)
    {
    return "";
    }
    }

    function addTiledMap(gTileLayer) 
    {
    try
    {
    //Add tile layer as a new GMapType
    var tilelayers = [G_SATELLITE_MAP.getTileLayers()[0],gTileLayer];

    gmap.addMapType(G_NORMAL_MAP);
    gmap.addMapType(G_HYBRID_MAP);
    gmap.addMapType(G_SATELLITE_MAP);
    gmap.addMapType(G_NORMAL_MAP);

    gmap.addControl(new GLargeMapControl());
    gmap.addControl(new GMapTypeControl());

    gmap.enableScrollWheelZoom();
    }catch(err)
    {
    }
    }
    
    function zoomInHere() 
    {
    gmap.zoomIn();
    gmap.zoomIn();
    gmap.zoomIn();
    gmap.zoomIn();
    gmap.zoomIn(); 
    gmap.zoomIn();
    gmap.closeInfoWindow() 
    }
    
    
    
    
    
    
    
    
    var PropertyDetails;
    var PropertyAddress;
    
    
    
    function showMapPropertyDetails(address,htmlProperty,htmlAddress)
    { 
    try
    {

    gmap = new GMap2(document.getElementById("map"));
    mapExtension = new esri.arcgis.gmaps.MapExtension(gmap);
    var mapOptions = {opacity: 0.75, minResolution:0, maxResolution: 19};
    var tiledmap = new esri.arcgis.gmaps.TiledMapServiceLayer("http://maps.dcgis.dc.gov/DCGIS/rest/services/Basemap-WebMercator/MapServer", mapOptions, addTiledMap);

    PropertyDetails=htmlProperty;
    PropertyAddress=htmlAddress;

    geocoder = new GClientGeocoder();

    geocoder.getLocations(htmlAddress+','+address, addToMapPropertyDetails);
    }
    catch(err)
    {
    }
    }
    
    
    
    
    
    function addToMapPropertyDetails(response)
    {
    try
    {
    // Retrieve the object
    place = response.Placemark[0];

    // Retrieve the latitude and longitude
    point = new GLatLng(place.Point.coordinates[1],
    place.Point.coordinates[0]);

    // Center the map on this point
    gmap.setCenter(point, 10);
    gmap.addOverlay(createMarkerPropertyDetails(point,place));
    }
    catch(err)
    {
    }
    }
    
    
    
    
    
    function createMarkerPropertyDetails(point,place) 
    {
    
    try
    {
     var marker = new GMarker(point);
     var html = "<div><font face='Arial' style='font-size: 9pt'><b>" + PropertyDetails + "</b></font></div>\n<div><font face='Arial' style='font-size: 9pt'>" + PropertyAddress + "</font><br></div>";
    
     to_htmls[0] = html + '<br>Directions: <b>To here</b> - <a href="javascript:fromhere(0)">From here</a>' +
  
      '<br>Start address:<form action="http://maps.google.com/maps" method="get" target="_blank">' +
  
      '<input type="text" SIZE=30 MAXLENGTH=40 name="saddr" id="saddr" value="" class="textbox" /><br/>' +
  
      '<INPUT class="getdirection-button" value="Submit" TYPE="SUBMIT"><br/><a href="javascript: zoomInHere()">Zoom Here</a>' +
  
      '<input type="hidden" name="daddr" value="' +
  
      place.Point.coordinates[1] + ',' + place.Point.coordinates[0] + "(" + place.address + ")" + '"/>';
  
       
  
      // The info window version with the "to here" form open
  
      from_htmls[0]= html + '<br>Directions: <a href="javascript:tohere(0)">To here</a> - <b>From here</b>' +
 
      '<br>End address:<form action="http://maps.google.com/maps" method="get"" target="_blank"> ' +
  
      '<input type="text" SIZE=30 MAXLENGTH=40 name="daddr" id="daddr" value="" class="textbox" /> <br/> ' +
  
      '<INPUT class="getdirection-button" value="Submit" TYPE="SUBMIT"> <br/><a href="javascript: zoomInHere()">Zoom Here</a>' +
 
      '<input type="hidden" name="saddr" value="' + place.Point.coordinates[1] + ',' + place.Point.coordinates[0] + "(" + place.address + ")" + '"/> ';
      
 
       
  
      // The inactive version of the direction info
  
       html = html + '<br> Directions: <a href="javascript:tohere(0)"> To here</a> - <a href="javascript:fromhere(0)"> From here</a> ';
       html = html + '<br><a href="javascript: zoomInHere()">Zoom Here</a>';
       
    
    
    
     gmarkers[0] = marker;
      
      htmls[0] = html;
 
   
    marker.openInfoWindowHtml(html);
  


    return marker;
    }
    catch(err)
    {
    return "";
    }
    }    


