var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var infowindow;
var map;

  function initialize() {
    directionsDisplay = new google.maps.DirectionsRenderer({preserveViewport: true});
    
    var latlng = new google.maps.LatLng(40.759, -73.97957);
    var myOptions = {
      zoom: 14,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    

    directionsDisplay.setMap(map);
    CalcDropRoute(directionsService, directionsDisplay, new google.maps.LatLng(40.74960,  -73.9917), "W 35th St & 7th Ave, New York, NY, USA", "distance",[
    {
      location: new google.maps.LatLng(40.750849, -73.99077), // 34th St & 7th Ave
      stopover:false
    },
    {
      location: "E 34th St & Park Ave, New York, NY, USA", // 34th St & Park Ave
      stopover:false
    },
    {
      location: "E 43th St & Vanderbilt Ave, New York, NY, USA",
      stopover:false
    },
    {
      location: "E 50th St & Park Ave, New York, NY, USA",
      stopover:false
    },
    {
      location: "E 50th St & 5th Ave, New York, NY, USA",
      stopover:false
    },
    {
      location: "Central Park S & 5th Ave, New York, NY, USA",
      stopover:false
    },
    {
      location: new google.maps.LatLng(40.767639, -73.97313), // Central Park
      stopover:false
    }
    ]
    );

    infowindow = new google.maps.InfoWindow({
        maxWidth: 300,
        content: ""
    });
    
    ////////////////////
    // Markers
    AddMarker({
        ll: new google.maps.LatLng(40.75061, -73.98944),
        title:"Шоу Цветов Macy's",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?macys+flower+empire><img src=/episodes/img/new-york/thumb/macys-flower-empire.jpg class=imageLeft width=80 height=80></a><h2>Macy's и Empire State Building</h2> В конце марта - начале апреля универмах Мэйсис проводит Шоу Цветов.</div>"
    });
    
    AddMarker({
        ll: new google.maps.LatLng(40.74706, -73.98120),
        title:"Здание Empire State и тюльпаны",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?empire+state+tulips><img src=/episodes/img/new-york/thumb/new-york-empire-state.jpg class=imageLeft width=80 height=80></a><h2>Здание Empire State</h2> Когда приходит весна, весь Нью-Йорк покрывается цветами</div>"
    });
    
    AddMarker({
        ll: new google.maps.LatLng(40.74875, -73.98000),
        title:"Здание MetLife и вишни",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?park+avenue+pink><img src=/episodes/img/new-york/thumb/park-ave-pink.jpg class=imageLeft width=80 height=80></a><h2>Парк Авеню</h2> К югу от здания MetLife и станции Гранд Централ Парк Авеню засажена вишневыми деревьями</div>"
    });
    
    AddMarker({
        ll: new google.maps.LatLng(40.75259, -73.97816),
        title:"Здание Крайслер и орлы станции Гранд Централ",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?chrysler+eagles><img src=/episodes/img/new-york/thumb/chrysler-eagles.jpg class=imageLeft width=80 height=80></a><h2>Орлы</h2>Орлы станции Гранд Централ охраняют здание Крайслера</div>"
    });
    
    AddMarker({
        ll: new google.maps.LatLng(40.75890, -73.97717),
        title:"Собор Св. Патрика и Атлант",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?rockefeller+atlas+and+st.patrick><img src=/episodes/img/new-york/thumb/rockefeller-patrick.jpg class=imageLeft width=80 height=80></a><h2>Атлант и собор</h2>Атлант Рокфеллер центра на фоне собора святого Патрика</div>"
    });
    
    AddMarker({
        ll: new google.maps.LatLng(40.768541, -73.97505),
        title:"Центральный Парк",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?central+park+pink><img src=/episodes/img/new-york/thumb/central-park-pink.jpg class=imageLeft width=80 height=80></a><h2>Центральный Парк</h2>Весной в Центральном Парке распускаются розовые и белые деревья</div>"
    });
    
    var activeMarker = AddMarker({
        ll: new google.maps.LatLng(40.759212, -73.98494),
        title: "Таймс-Сквер",
        infoText: "<div class=bigleftfield><a href=/episodes/new-york_img1.aspx?times+square+cars><img src=/episodes/img/new-york/thumb/times-square-cars.jpg class=imageLeft width=80 height=80></a><h2>Вечер на Таймс Сквер</h2>Таймс Сквер всегда красива и интересна для посещения: утром, днем, вечером и ночью. </div>"
        });
        
    // End of Markers
    ///////////////////
    infowindow.content = activeMarker.text;
    infowindow.open(map,activeMarker.mark);
    
  }
  
function AddMarker(obj) {
    var newMark =  {
        mark: new google.maps.Marker({
            position: obj.ll,
            map: map, 
            title:obj.title
        }),
        text: obj.infoText    
    };
    AddInfo(newMark);
    return newMark;
}  
  
function AddInfo(marker) {
    google.maps.event.addListener(marker.mark, 'click', function() {
        infowindow.content = marker.text;
        infowindow.open(map,this);
        //console.info("" + this.getPosition().lat() + ", " + this.getPosition().lng());        
    }); 
    
}
  
function CalcDropRoute(dirSvc, dirDisplay, start, end, distanceID, waypoints) {

  var request = {
    origin:start, 
    destination:end,
    travelMode: google.maps.DirectionsTravelMode.WALKING,
    waypoints: waypoints
  };
  dirSvc.route(request, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      dirDisplay.setDirections(result);
      
    } else {
        alert("Невозможно построить маршрут: \n" + status);
    }
  });

}