window.onload = function() {
  googlemap();
}

function googlemap() {

  var realisations = [
    ['Gingsheim', 48.717139, 7.588961, 'Gingsheim', '005'],    ['Alteckendorf', 48.792513, 7.594836, 'Alteckendorf', '007'],    ['Uberach', 48.849027, 7.629575, 'Uberach', '014'],    ['Menchhoffen', 48.858849, 7.497087, 'Menchhoffen', '005'],    ['Uhrwiller', 48.878889, 7.578481, 'Uhrwiller', '007'],    ['Obermodern1', 48.8453, 7.5411, 'Obermodern', '003'],    ['Gresswiller', 48.534858, 7.430653, 'Gresswiller', '004'],    ['Hochfelden', 48.75853, 7.570056, 'Hochfelden', '008'],    ['Bitche', 49.050415, 7.427276, 'Bitche', '010'],    ['Schillersdorf', 48.8704877, 7.5240898, 'Schillersdorf', '007'],    ['Walck', 48.847732, 7.609476, 'La Walck', '009'],    ['Offwiller', 48.909951, 7.540975, 'Offwiller', '004'],    ['Bischholtz', 48.893172, 7.539507, 'Bischholtz', '008'],    ['Neuwiller', 48.824218, 7.405563, 'Neuwiller les Saverne', '005'],    ['Mindversheim', 48.786079, 7.622469, 'Mindversheim', '007'],    ['Griesbach', 48.889937, 7.679028, 'Griesbach', '004'],    ['Kurtzenhouse', 48.739546, 7.806454, 'Kurtzenhouse', '006'],    ['Schweighouse', 48.821196, 7.736116, 'Schweighouse sur Moder', '003'],    ['Obermodern2', 48.844308, 7.53932, 'Obermodern', '002'],    ['Pfaffenhoffen', 48.8444857031, 7.610435485839844, 'Pfaffenhoffen', '007']  ];
  
  var palmay = new google.maps.LatLng(48.8705618, 7.5267398);
  // var camera = new google.maps.LatLng(48.8705, 7.5267);

  var palmayOptions = {
    scrollwheel: true,
    zoom: 16,
    center: palmay,
    mapTypeId: google.maps.MapTypeId.HYBRID,
    streetViewControl: false
  };

  var realisationsOptions = {
    scrollwheel: true,
    mapTypeId: google.maps.MapTypeId.HYBRID,
    streetViewControl: false
  };

  /*
  var panoramaOptions = {
    position: camera,
    pov: {
      heading: 140,
      pitch: 5,
      zoom: 1
    }
  };
  */

  var palmay_map = new google.maps.Map(document.getElementById("map"), palmayOptions);

  var realisations_map = new google.maps.Map(document.getElementById("realisations"),realisationsOptions);

  // var panorama = new  google.maps.StreetViewPanorama(document.getElementById("pano"),panoramaOptions);
  // palmay_map.setStreetView(panorama);

  var image = 'https://paysage-palmay.fr/puce';

  var palmay_marker = new google.maps.Marker({
    position: palmay, 
    map: palmay_map,
    icon: image,
    title:"Palmay SARL"
  });

  var contentString = '<div><font color="black"><img src="https://paysage-palmay.fr/logo_palmay" alt="Palmay SARL" title="Palmay SARL" height="22" width="151" align="top" /><div align="left">6, rue des Puits<br />67340 Schillersdorf<br />France</div></font></div>';

  var palmay_infowindow = new google.maps.InfoWindow({
    content: contentString
  });
    
  google.maps.event.addListener(palmay_marker, 'click', function() {
    palmay_infowindow.open(palmay_map,palmay_marker);
  });

  var infowindow = new google.maps.InfoWindow();
  var marker, i;
  var bounds = new google.maps.LatLngBounds();

  for (i = 0; i < realisations.length; i++) {
    var pos = new google.maps.LatLng(realisations[i][1], realisations[i][2]);
    bounds.extend(pos);

    marker = new google.maps.Marker({
      position: pos,
      map: realisations_map,
      icon: image,
      title: realisations[i][0]
    });

    google.maps.event.addListener(marker, 'click', (function(marker, i) {
      return function() {
        infowindow.setContent(
          '<a href="http://www.paysage-palmay.fr/paysagiste/realisations#' + 
          realisations[i][0] +
          '_ancre">' +
          realisations[i][3] +
          '</a>\n<br/><a href="http://www.paysage-palmay.fr/paysagiste/realisations#' +
          realisations[i][0] +
          '_ancre"><img src="http://www.paysage-palmay.fr/paysagiste/realisations/' +
          realisations[i][0] +
          '-' +
          realisations[i][4] +
          '-picto.jpg" width="100" height="75"></a>');
        infowindow.open(realisations_map, marker);
      }
    })(marker, i));
  }
  realisations_map.fitBounds(bounds);

}