(function(){
  var tData = [
{ lat:48.9835, lon:2.2285, titre:'Barnab',  info:'<b>Barnab</b>'},{ lat:50.6207, lon:3.1315, titre:'Bertrand',  info:'<b>Bertrand</b>'},{ lat:46.6624, lon:-0.2396, titre:'Christophe',  info:'<b>Christophe</b>'},{ lat:43.6271, lon:3.4339, titre:'Framboise',  info:'<b>Framboise</b>'},{ lat:47.6958307, lon:-1.7015014, titre:'Francky',  info:'<b>Francky</b>'},{ lat:44.8108, lon:-0.7823, titre:'Gphil',  info:'<b>Gphil</b>'},{ lat:47.1243, lon:-0.2342, titre:'Jacques49',  info:'<b>Jacques49</b>'},{ lat:49.3867, lon:1.1992, titre:'Jean-Jacques',  info:'<b>Jean-Jacques</b>'},{ lat:43.3387, lon:5.9771, titre:'Jeanlouis 83',  info:'<b>Jeanlouis 83</b>'},{ lat:45.0043, lon:2.4844, titre:'Jeannot15',  info:'<b>Jeannot15</b>'},{ lat:45.6821, lon:4.6405, titre:'Jmm',  info:'<b>Jmm</b>'},{ lat:44.8317, lon:1.2254, titre:'Juanito',  info:'<b>Juanito</b>'},{ lat:47.3405, lon:0.6128, titre:'Manou',  info:'<b>Manou</b>'},{ lat:50.3923, lon:3.4832, titre:'Marcel',  info:'<b>Marcel</b>'},{ lat:44.5181, lon:3.4945, titre:'Michel48',  info:'<b>Michel48</b>'},{ lat:48.136, lon:5.085, titre:'Motoside52',  info:'<b>Motoside52</b>'},{ lat:44.518, lon:3.4985, titre:'Nemo',  info:'<b>Nemo</b>'},{ lat:46.3388, lon:2.6021, titre:'Pabo03',  info:'<b>Pabo03</b>'},{ lat:43.4274, lon:3.5995, titre:'Peps47 et Marie',  info:'<b>Peps47 et Marie</b>'},{ lat:48.8495, lon:2.6518, titre:'Petarade77',  info:'<b>Petarade77</b>'},{ lat:43.6473, lon:0.5846, titre:'Phil32',  info:'<b>Phil32</b>'},{ lat:45.7116, lon:3.2289, titre:'Polo63',  info:'<b>Polo63</b>'},{ lat:43.6268, lon:3.4338, titre:'Punisher',  info:'<b>Punisher</b>'},{ lat:43.627, lon:3.4338, titre:'Regis1934',  info:'<b>Regis1934</b>'},{ lat:43.8995, lon:4.7456, titre:'Theo13',  info:'<b>Theo13</b>'},  ];

  function initCarte(){
    var oListe, oLI,
        oMarker, oInfo, oMap, i, nb = tData.length;
    oListe = document.getElementById('liste_marker');
    // création de la carte
    oMap = new google.maps.Map(document.getElementById('div_carte'),{
        'backgroundColor': '#FFF',
        'mapTypeControl':  false,
        'streetViewControl': false,
        'zoom': 5,
        'center': new google.maps.LatLng( 46.80, 1.70),
        'mapTypeId': google.maps.MapTypeId.ROADMAP
      });
    google.maps.event.addListenerOnce( oMap, 'tilesloaded', function(){
        this.complete = true;
      });
    // création des marqueurs
    for( i = 0; i < nb; i++){
      // ajout d'une entrée dans la liste
      oLI = document.createElement('LI');
      oLI.innerHTML =tData[i].titre;
      oListe.appendChild( oLI);
      // création du marker
      oMarker = new google.maps.Marker({
          'position' : new google.maps.LatLng( tData[i].lat, tData[i].lon),
          'map' : oMap,
          'icon': 'http://maps.google.com/mapfiles/marker.png',
          'title' : tData[i].titre
        });
      // création infobulle
      oInfo = new google.maps.InfoWindow({
          'marqueur': oMarker,
          'content' : '<div class="bulle">' +tData[i].info +'<\/div>'
        });
      // gestion des liaisons
      oMarker.infoBulle = oInfo;
      oMarker.liste = oLI;
      // ajout evenement sur marker
      google.maps.event.addListener( oMarker, 'mouseover', function(){
          // récup. de l'objet carte
          var map = this.getMap();
          if( !map.complete) return;
          // change la class de la LI
          this.liste.className = 'liste_over';
          // save de l'image icone
          this.saveIcone = this.getIcon();
          // affectation icone qui va bien
          this.setIcon( 'http://maps.google.com/mapfiles/marker_green.png');
          // affichage infoBulle
          this.infoBulle.open( map, this);
        });
      google.maps.event.addListener( oMarker, 'mouseout', function(){
          // récup. de l'objet carte
          var map = this.getMap();
          if( !map.complete) return;

          this.liste.className = '';
          this.setIcon( this.saveIcone);
          this.infoBulle.setMap(null);
        });
      google.maps.event.addListener( oMarker, 'click', function(data){
          // récup. de l'objet carte
          var map = this.getMap();
          if( !map.complete) return;

          if( data.center){
            // recentrage de la carte
            this.getMap().panTo( this.getPosition());
          }
          if( data.zoom){
            // zoom de la carte
            this.getMap().setZoom( data.zoom);
          }
        });
      // gestion des liaisons
      oLI.marker = oMarker;
      // transfert des événements sur le marker
      oLI.onmouseover= function(){
          google.maps.event.trigger( this.marker, 'mouseover', null);
        };
      oLI.onmouseout = function(){
          google.maps.event.trigger( this.marker, 'mouseout', null);
        };
      oLI.onclick = function(){
          google.maps.event.trigger( this.marker, 'click', {'center':true});
        };
      oLI.ondblclick = function(){
          google.maps.event.trigger( this.marker, 'click', {'zoom':13});
        };
      oLI.onselectstart = function(){
          return false;
        };
    }
  }
  // init lorsque la page est chargée
  google.maps.event.addDomListener(window, 'load', initCarte);
})();

$(document).ready(function() {

	$('div.legende').hover(function(){
		$(this).css('cursor', 'pointer');
		$(this).css('background-color', '#07444d');
		$(this).css('color', '#fff');
	},function(){
		$(this).css('cursor', 'default');
		$(this).css('background-color', '#a6cc59');
		$(this).css('color', '#2d2d2d');
	});

	$('div.legende').click(function()
	{
		window.location="#positionner_liste";
	});
});