/*****************************************
** Projet Picto 2.0 made by CLP - 2010 **
** Copyright LPG 2010                  **
****************************************/

$path = "http://www.lpgitalia.com/centers/";

/*code init*/

var api;

/*event champs de recherche*/
 $(function(){ 
     

     // initialize scrollable with mousewheel support
    var root = $(".scrollable").scrollable({ 
    vertical: true, 
    items: '#sidebar',
    mousewheel: true           
    });  
    
    window.api = root.data("scrollable");
    
    
     $("#addressInput").click(function() {
             $(this).val("");
             $(this).unbind("click");               
             });
      
   
      $(".tootTipTarget").tooltip({   
                tip: '.tooltip',    
                effect: 'fade',  
                fadeOutSpeed: 100,
                predelay: 0,  
                position: "bottom right",
                offset: [-60, -80]
      });



                
});//fin du onLoad      


 function loadToolTip()
 {
       $(".tootTipTarget").live("mouseover", function() {    
            $(this).tooltip({   
                tip: '.tooltip',    
                effect: 'fade',  
                fadeOutSpeed: 100,
                predelay: 0,  
                position: "bottom right",
                offset: [-60, -80]
            }).show();  
        });
 
 
 }

 function seek(id)
 {
      api.seekTo(id); 
 } 

  function replaceNuageTag()
  {
        $("#blockNuage").insertAfter("#blockLegend");
  } 
 

 /*event champs des pays*/
 function changeCountry() {    
    if(document.getElementById('country').value == 'france')
    {
        distinctKine = true;
        document.getElementById('divSelectType').style.visibility = "visible";
        document.getElementById('CertifiedQuality').innerHTML = "Formation Pro";
    } else {
        distinctKine = false;
        document.getElementById('divSelectType').style.visibility = "hidden";
        document.getElementById('CertifiedQuality').innerHTML = "Certified Quality";
    }
      document.getElementById('map').style.visibility = "hidden";
      document.getElementById('Legend').style.visibility = "hidden";
      document.getElementById('sidebar').innerHTML = ''; 
   } 
 
/*event selection picto*/
 function checkPicto(idChkbox,idDiv)
 {
    if(document.getElementById(idChkbox).checked)  {
        document.getElementById(idChkbox).checked = false;
        document.getElementById(idDiv).className = "picto";  
    } else {
        document.getElementById(idChkbox).checked = true;
        document.getElementById(idDiv).className = "picto-select";
    }
 }
 
/* recuperation valeur radius*/
function getRadius() {
    var val = 0;

    for( i = 0; i < document.myForm.radRadius.length; i++ )
    {
    if( document.myForm.radRadius[i].checked == true )
        val = document.myForm.radRadius[i].value;
    }
    return val; 
} 
 
 /*event cliquet type de centre*/
 function selectType() {
        if(document.myForm.chkKine.checked) 
        {
            document.getElementById('imgCliquet').src = $path+"img/cliquet-right.png";
            document.myForm.chkKine.checked = false;
            document.getElementById('Institut').style.fontWeight = "bold";
            document.getElementById('kine').style.fontWeight = "normal";
            document.getElementById('divSpineforce').style.display = "none";
            document.getElementById('divFace').style.width = "235px";
            document.getElementById('divBody').style.width = "235px";
            document.getElementById('divWellbox').style.width = "235px";
            document.getElementById('divCosmetic').style.width = "235px";
            document.getElementById('chkSpineforce').checked = false;
            document.getElementById('divSpineforce').className = "picto";
        } else {
            document.getElementById('imgCliquet').src = $path+"img/cliquet-left.png";
            document.myForm.chkKine.checked = true;  
            document.getElementById('Institut').style.fontWeight = "normal";
            document.getElementById('kine').style.fontWeight = "bold";
            document.getElementById('divSpineforce').style.display = "block";
            document.getElementById('divFace').style.width = "188px";
            document.getElementById('divBody').style.width = "188px";
            document.getElementById('divWellbox').style.width = "188px";
            document.getElementById('divCosmetic').style.width = "188px";  
        }        
   }
 
/* code google maps*/
 
/* code maps */
//<![CDATA[
    var map;
    var geocoder;
    var iconLpg;
    var distinctKine = true;
    var bSel = false;

/*  google maps V3

function initialize() {    
    var myOptions = {
      zoom: 8,
      ScrollWheelZoom: false,           
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };             
    map = new google.maps.Map(document.getElementById("map"),myOptions);
    geocoder = new google.maps.Geocoder();
  }*/
    
    
    
    function load() {
      if (GBrowserIsCompatible()) {
        var baseIcon = new GIcon();
         baseIcon.iconSize=new GSize(32,32);
         baseIcon.iconAnchor=new GPoint(16,16);
         baseIcon.infoWindowAnchor=new GPoint(16,16);
         iconLpg = new GIcon(baseIcon, $path+'img/picto-lpg.png', null, '');       
          
        geocoder = new GClientGeocoder();
        map = new GMap2(document.getElementById('map'));       
        var customUI = map.getDefaultUI();
        customUI.maptypes.hybrid = false;
        map.setUI(customUI);
         map.disableScrollWheelZoom();    
      }
    }       

   function searchLocations() {             
      var address = document.getElementById('addressInput').value + ',' + document.getElementById('country').value;
     
      if(document.getElementById('addressInput').value == YOUR_ADDRESS) {
          alert(EMPTY_ADDRESS);          
      } else {
          if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75009") != -1) {
              var latlng = new GLatLng(parseFloat(48.87700),parseFloat(2.33734));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75012") != -1) {
              var latlng = new GLatLng(parseFloat(48.84163),parseFloat(2.3879)); 
              searchLocationsNear(latlng);    
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75013") != -1) {
              var latlng = new GLatLng(parseFloat(48.82960),parseFloat(2.3596));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75014") != -1) {
              var latlng = new GLatLng(parseFloat(48.38152),parseFloat(2.3273));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75015") != -1) {
              var latlng = new GLatLng(parseFloat(48.84225),parseFloat(2.2954));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75016") != -1) {
              var latlng = new GLatLng(parseFloat(48.85965),parseFloat(2.2770));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75017") != -1) {
              var latlng = new GLatLng(parseFloat(48.88742),parseFloat(2.30445));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75018") != -1) {
              var latlng = new GLatLng(parseFloat(48.89233),parseFloat(2.34926));  
              searchLocationsNear(latlng);                
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75019") != -1) {
              var latlng = new GLatLng(parseFloat(48.88613),parseFloat(2.38316));  
              searchLocationsNear(latlng);
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75020") != -1) {
              var latlng = new GLatLng(parseFloat(48.86445),parseFloat(2.39887));  
              searchLocationsNear(latlng); 
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value.search("75020") != -1) {
              var latlng = new GLatLng(parseFloat(48.87326),parseFloat(2.3113));  
              searchLocationsNear(latlng);    
          } else if(document.getElementById('country').value == 'france' && document.getElementById('addressInput').value == "ville") {
              var latlng = new GLatLng(parseFloat(48.342968),parseFloat(7.30149));  
              searchLocationsNear(latlng);                
          } else {
              geocoder.getLatLng(address, function(latlng) {        
               if (!latlng) {
                 alert(address + NOT_FOUND);
               } else {
                 searchLocationsNear(latlng);
                 replaceNuageTag();
               }
             });
          }
      
      
     }    
     
        loadToolTip();   
   }      
   

  /*function searchLocations() {
    var address = $('#addressInput').val() + ',' +  $('#country').val();    
    $("#map").css('visibility', 'visible');    
    if (geocoder) {
      geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          map.setCenter(results[0].geometry.location);
          var marker = new google.maps.Marker({
              map: map, 
              position: results[0].geometry.location
          });
        } else {
          alert("Geocode was not successful for the following reason: " + status);
        }
      });
    }
  }
  
  function searchLocationsNear(center) { 
    $("#wait").show();  
    var radius = getRadius();
    var searchUrl = 'data/center.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius + '&body=' + document.myForm.chkBody.checked + '&distinctKine=' + distinctKine;
    searchUrl += '&face=' + document.myForm.chkFace.checked + '&spineforce=' +  document.myForm.chkSpineforce.checked + '&kine=' + document.myForm.chkKine.checked;       
    searchUrl += '&cosmetic=' + document.myForm.chkCosmetic.checked + '&wellbox=' + document.myForm.chkWellbox.checked;
     
     
     
  }      */

   
   

   function searchLocationsNear(center){
     $("#wait").show();
     $("#actions").fadeOut();
     var radius = getRadius();    
     var searchUrl = ''+$path+'data/center.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius + '&body=' + document.myForm.chkBody.checked + '&distinctKine=' + distinctKine;
     searchUrl += '&face=' + document.myForm.chkFace.checked + '&spineforce=' +  document.myForm.chkSpineforce.checked + '&kine=' + document.myForm.chkKine.checked;       
     searchUrl += '&cosmetic=' + document.myForm.chkCosmetic.checked + '&wellbox=' + document.myForm.chkWellbox.checked+ '&certified=' + document.myForm.chkCertified.checked+ '&address=' +  document.myForm.addressInput.value + '&country=' + document.getElementById('country').value;
     
     GDownloadUrl(searchUrl, function(data){
       var xml = GXml.parse(data);             
       var markers = xml.documentElement.getElementsByTagName('marker');
       map.clearOverlays();

       var sidebar = document.getElementById('sidebar');
       sidebar.innerHTML = '';
       if (markers.length == 0) {
         sidebar.innerHTML = 'Aucun centre LPG ne correspond aux termes de recherche spécifiés';
         document.getElementById('map').style.visibility = "hidden";               
         $("#wait").hide();
         return;
       }
       var bounds = new GLatLngBounds();
       for (var i = 0; i < markers.length; i++) {
         var name = markers[i].getAttribute('name');
         var address = markers[i].getAttribute('address');
         var zip = markers[i].getAttribute('zip');
         var city = markers[i].getAttribute('city');
         var tel = markers[i].getAttribute('tel');
         var website = markers[i].getAttribute('website');  
         var gen_cellu = markers[i].getAttribute('gen_cellu');
         var spineforce = markers[i].getAttribute('spineforce');
         var lipomassage = markers[i].getAttribute('lipomassage');
         var endermolift = markers[i].getAttribute('endermolift');
         var wellbox = markers[i].getAttribute('wellbox');
         var cosmetic = markers[i].getAttribute('cosmetic');
         var mvf = markers[i].getAttribute('mvf');
         var cornerspa = markers[i].getAttribute('cornerspa');
         var fullspa = markers[i].getAttribute('fullspa');
         var quality = markers[i].getAttribute('quality');
         var quality_2011 = markers[i].getAttribute('quality_2011');
         var distance = parseFloat(markers[i].getAttribute('distance'));         
         var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
                                 parseFloat(markers[i].getAttribute('lng')));
         
         var marker = createMarker(point, name, address, zip, city, tel, gen_cellu, spineforce, lipomassage, endermolift, wellbox, cosmetic, mvf, cornerspa, fullspa, quality, quality_2011, i );
         map.addOverlay(marker);
         var sidebarEntry = createSidebarEntry(marker, name, address, zip, city, tel, website, distance, gen_cellu, spineforce, lipomassage, endermolift, wellbox, cosmetic, mvf, cornerspa, fullspa, quality, quality_2011, i);
         sidebar.appendChild(sidebarEntry);         
         bounds.extend(point);         
       }
       $(".lpg-center").addClass("item"); 
       map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));       
       document.getElementById('map').style.visibility = "visible";
       document.getElementById('Legend').style.visibility = "visible";
       $("#actions").fadeIn();
       $("#wait").hide();    
     });
   }   

    function createMarker(point, name, address, zip, city, tel, gen_cellu, spineforce, lipomassage, endermolift, wellbox, cosmetic, mvf, cornerspa, fullspa, quality, quality_2011, id) {
      var marker = new GMarker(point, {icon:iconLpg});
      var html = '<div style="height:129px;width:350px;font-size: 13px;"><b>' + name + '</b> <br/>' + address + '<br />' + zip + ' ' + city + '<br /><b>Tél. : ' + tel + '</b><br /><br />'; 
     if(gen_cellu == 1)
        html += '<img class="tootTipTarget" title="Ancienne G&eacute;n&eacute;ration cellu M6" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 2)
        html += '<img class="tootTipTarget" title="Cellu M6 Keymodule" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 3)
        html += '<img class="tootTipTarget" title="Cellu M6 Keymodule[2]" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 4)
        html += '<img class="tootTipTarget" title="Cellu M6 Integral / Endermolab" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';                  
      if(endermolift == 1)
        html += '<img class="tootTipTarget" title="Soin visage / Endermolift" src="'+$path+'img/picto-face-over.png" style="margin-left:3px;">';  
      if(lipomassage == 1)
        html += '<img class="tootTipTarget" title="Soin corps / Lipomassage" src="'+$path+'img/picto-body-over.png" style="margin-left:3px;">';
      if(spineforce == 1)
        html += '<img class="tootTipTarget" title="Soin du dos / Huber spineforce" src="'+$path+'img/picto-spineforce-over.png" style="margin-left:3px;">';     
      if(wellbox == 1)
        html += '<img class="tootTipTarget" title="Revendeur wellbox" src="'+$path+'img/picto-wellbox-over.png" style="margin-left:3px;">';  
      if(cosmetic == 1)
        html += '<img class="tootTipTarget" title="Revendeur cosm&eacute;tiques LPG" src="'+$path+'img/picto-cosmetique-over.png" style="margin-left:3px;">';     
      if(mvf == 1)
        html += '<img class="tootTipTarget" title="Espace MVF" src="'+$path+'img/picto-mvf.png" style="margin-left:3px;">';
      if(cornerspa == 1)
        html += '<img class="tootTipTarget" title="Corner Endermospa" src="'+$path+'img/picto-cornerspa.png" style="margin-left:3px;">';
      if(fullspa == 1)
        html += '<img class="tootTipTarget" title="Full Endermospa" src="'+$path+'img/picto-endermospa-full.png" style="margin-left:3px;">';
     /* if(quality == 1)
        html += '<img class="tootTipTarget"  title="Certified Quality" src="'+$path+'img/picto-quality.png" style="margin-left:3px;">';*/
      if(quality_2011 == 1)
        html += '<img class="tootTipTarget"  title="Certified Quality 2011" src="'+$path+'img/picto-certified-2011.png" style="margin-left:3px;">';                   
      html += "</div>";
      /*GEvent.addListener(marker, 'mouseover', function() {
        marker.openInfoWindowHtml(html);        
        document.getElementById('sidebar').scrollTop=document.getElementById(id).offsetTop;
      });
      GEvent.addListener(marker, 'mouseout', function() {
        if(!bSel)
            marker.closeInfoWindow();                
      });  */
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
        seek(id);        
        map.setCenter(point,15);        
        document.getElementById('sidebar').scrollTop=document.getElementById(id).offsetTop;
        $("#sidebar div").addClass("lpg-center");             
        $("#sidebar div").removeClass("lpg-center-select");
        document.getElementById(id).className = 'lpg-center-select';
        bSel = true;
      });
      return marker;
    }

    function createSidebarEntry(marker, name, address, zip, city, tel, website, distance, gen_cellu, spineforce, lipomassage, endermolift, wellbox, cosmetic, mvf, cornerspa, fullspa, quality, quality_2011, id) {
      var div = document.createElement('div');
      div.id = id;
      var html = '<div class="lpg-center-text"><b>' + name + '-&gt; <font color="#aa0001">' + distance.toFixed(1) + ' km</font></b><br/>' + address + '<br/>' + zip + ' ' + city + '<br /><b>Tél. : ' + tel + '</b><br />' + website + '</div>&nbsp;';
     if(gen_cellu == 1)
        html += '<img class="tootTipTarget" title="Prima generazione cellu M6" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 2)
        html += '<img class="tootTipTarget" title="Cellu M6 Keymodule" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 3)
        html += '<img class="tootTipTarget" title="Cellu M6 Keymodule[2]" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
     if(gen_cellu == 4)
        html += '<img class="tootTipTarget" title="Cellu M6 Integral / Endermolab" src="'+$path+'img/picto-cellu-gen' + gen_cellu + '.png" style="margin-left:3px;">';
      if(endermolift == 1)
        html += '<img class="tootTipTarget" title="Trattamento viso LPG" src="'+$path+'img/picto-face-over.png" alt ="Soin du visage">';
      if(lipomassage == 1)
        html += '<img class="tootTipTarget" title="Trattamento corpo LPG" src="'+$path+'img/picto-body-over.png" alt="Soin du corps">';
      if(spineforce == 1)
        html += '<img class="tootTipTarget" title="Machine du dos LPG" src="'+$path+'img/picto-spineforce-over.png" alt="Soin du dos / Spineforce">';  
      if(wellbox == 1)
        html += '<img class="tootTipTarget" title="Revendeur wellbox" src="'+$path+'img/picto-wellbox-over.png" alt="Wellbox">';
      if(cosmetic == 1)
        html += '<img class="tootTipTarget" title="Cosmetici LPG" src="'+$path+'img/picto-cosmetique-over.png" alt="Cosmetique">';         
      if(mvf == 1)
        html += '<img class="tootTipTarget" title="" src="'+$path+'img/picto-mvf.png">'; 
      if(cornerspa == 1)
        html += '<img class="tootTipTarget" title="Corner Endermospa" src="'+$path+'img/picto-cornerspa.png">';              
      if(fullspa == 1)
        html += '<img class="tootTipTarget" title="Full Endermospa" src="'+$path+'img/picto-endermospa-full.png">';              
     /* if(quality == 1)
        html += '<img class="tootTipTarget" title="Certified Quality LPG" src="'+$path+'img/picto-quality.png">';*/
      if(quality_2011 == 1)
        html += '<img class="tootTipTarget"  title="Certified Quality 2011" src="'+$path+'img/picto-certified-2011.png" >';              
      div.innerHTML = html;
      div.style.cursor = 'pointer';
      div.className = 'lpg-center';
      
      GEvent.addDomListener(div, 'click', function() {
        GEvent.trigger(marker, 'click');
/*        map.setCenter(marker,15); */
        bSel = true;
      });
      return div;
    }   
    //]]>