// JavaScript Document
/**
 * Data for the markers consisting of a name, a LatLng and a zIndex for
 * the order in which these markers should display on top of each
 * other.
 */
var properties = [

  ['<h3 style="min-width:200px;">Land</h3>' + '<img src="http://www.devreit.com/wp-content/uploads/land300.jpg" style=" width: 150px; height: 62px; padding-bottom: 10px;" ><br>'+
'<a class="btn btn-default" href="http://www.devreit.com/wp-content/uploads/20201217_WatervilleLanding_LandDataSheet.pdf">View Data Sheet</a>'+
'<a href="mailto:?Subject=Land&body=Here is a Devonshire REIT Property ' + 
'http://www.devreit.com/wp-content/uploads/20201217_WatervilleLanding_LandDataSheet.pdf" target="_top"><button type="button" class="btn btn-default"><span class="glyphicon glyphicon-share"></span></button></a>', 
41.507114, -83.747319, 1],
  

];

function setMarkers(map, locations) {
var image = {
    url: 'assets/DRmapLOGO.png',
    // This marker is 30 pixels wide by 22 pixels tall.
    size: new google.maps.Size(40, 34),
    // The origin for this image is 0,0.
    origin: new google.maps.Point(-7,0),
    // The anchor for this image is the base of the DR Point at 15,22.
    anchor: new google.maps.Point(13, 19),
    scaledSize: new google.maps.Size(25, 19)
  };
    // Clickable Area of the image
    var shape = {
      coord: [10,0,39,19],
      type: 'rect'
  };
    // declare the infowindow outside of the loop (only one opens at a time)
    var infowindow = new google.maps.InfoWindow({
    	maxWidth: 220
    	});
    // Add markers to the map 
    // (property[0] = info, this is all the information before Latitude)
    // (property[1] = Latitude, property[2] = Longitude, property[3] = zIndex)
    for (var i = 0; i < locations.length; i++) {
    var property = locations[i];
    var myLatLng = new google.maps.LatLng(property[1], property[2]);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon: image,
        shape: shape,
        optimized: false,
        zIndex: property[3],
        info: property[0]
        
    });
    // This is how you set multiple info windows
      
      google.maps.event.addListener(marker, 'click', function() {
      infowindow.setContent(this.info);
      infowindow.open(map, this);
	  });
    } 
	
	/*  // new code begin
	  var amberwood = locations[24];
    var newLatLng = new google.maps.LatLng(amberwood[1], amberwood[2]);
    var Hmarker = new google.maps.Marker({
        position: newLatLng,
        map: map,
        icon: image,
        shape: shape,
        optimized: false,
        zIndex: amberwood[3],
        info: amberwood[0]
	});
	var amber = document.getElementById('0140');
	
	google.maps.event.addDomListener(amber, 'mouseover', function() {
		infowindow.setContent(Hmarker.info);
		map.setZoom(8);
    	infowindow.open(map, Hmarker);
	});
	
	//new code end
	*/
}
  
  

  	  
  google.maps.event.addDomListener(window, 'load', initialize);
	  
// Separate JQuery for sidebar
var main = function(){
	$('.filterBar').click(function(){
		$('.sidebar').animate({left: "-35px"},700);
		$('.filterBar').fadeOut(500);
		$('.middlebar').animate({left: "-25px"}, 700);
	});
	
	$('.closeBox').click(function(){
		$('.sidebar').animate({left: "-220px"},600);
		$('.filterBar').fadeIn(500);
		$('.middlebar').animate({left: "-100px"}, 500);
	});
}	
$(document).ready(main);