/**

 * @fileoverview This demo is used for MarkerClusterer. It will show 100 markers

 * using MarkerClusterer and count the time to show the difference between using

 * MarkerClusterer and without MarkerClusterer.

 * @author Luke Mahe (v2 author: Xiaoxi Wu)

 */



function $(element) {

  return document.getElementById(element);

}



var speedTest = {};



speedTest.pics = null;

speedTest.map = null;

speedTest.markerClusterer = null;

speedTest.markers = [];

speedTest.infoWindow = null;



speedTest.init = function() {

  var latlng = new google.maps.LatLng(48.8, 31.12);

  var options = {

    'zoom': 6,

    'center': latlng,

    'mapTypeId': google.maps.MapTypeId.ROADMAP

  };


  speedTest.map = new google.maps.Map($('map'), options);

  speedTest.pics = data.salons;

  

  var useGmm = document.getElementById('usegmm');

  google.maps.event.addDomListener(useGmm, 'click', speedTest.change);

  

  var numMarkers = document.getElementById('nummarkers');

  google.maps.event.addDomListener(numMarkers, 'change', speedTest.change);



  speedTest.infoWindow = new google.maps.InfoWindow();



  speedTest.showMarkers();

};



speedTest.showMarkers = function() {

  speedTest.markers = [];



  var type = 1;

  if ($('usegmm').checked) {

    type = 0;

  }



  if (speedTest.markerClusterer) {

    speedTest.markerClusterer.clearMarkers();

  }



  var panel = $('markerlist');

  panel.innerHTML = '';

  var numMarkers = $('nummarkers').value;

  for (var i = 0; i < numMarkers; i++) {

    var titleText = speedTest.pics[i].city + " - " + speedTest.pics[i].adress;
      if (titleText == '') {

      titleText = 'No title';

    }

    var item = document.createElement('DIV');

    var title = document.createElement('A');

    title.href = '#';

    title.className = 'title';

    title.innerHTML = titleText;



    item.appendChild(title);

    panel.appendChild(item);

    var latLng = new google.maps.LatLng(speedTest.pics[i].latitude,

        speedTest.pics[i].longitude);
     
   var icon = "http://okoshko.ua/contacts/ajax/map-fs-icon.png";

   var marker = new google.maps.Marker({

      'position': latLng,

      'icon': icon ,

      'flat': false

    });



    var fn = speedTest.markerClickFunction(speedTest.pics[i], latLng);

    google.maps.event.addListener(marker, 'click', fn);

    google.maps.event.addDomListener(title, 'click', fn);

    speedTest.markers.push(marker);

  }



  window.setTimeout(speedTest.time, 0);

};



speedTest.markerClickFunction = function(pic, latlng) {

  return function(e) {

    e.cancelBubble = true;

    e.returnValue = false;

    if (e.stopPropagation) {

      e.stopPropagation();

      e.preventDefault();

    }

    var title = pic.city;

    var url = pic.monfri;

    var fileurl = pic.photo_file_url;

	var tel = pic.telefon;

	var mob = pic.mobil;

	var sub = pic.sut;

	var vos = pic.sun;



    var infoHtml = '<div class="info"><img src="' + fileurl + '" class="info-img" hspace="10"/>Город: ' + title + '<br/>Адрес: ' + pic.adress 

	+ '<br/>Телефон: ' + tel + '<br/>Мобильный: ' + mob +

      '<br/>Время работы:<br/>ПН-ПТ&nbsp;&nbsp;&nbsp;' + url + '<br/>СБ&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;' + sub + '<br/>ВС&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;' + vos + '</div>';



    speedTest.infoWindow.setContent(infoHtml);

    speedTest.infoWindow.setPosition(latlng);

    speedTest.infoWindow.open(speedTest.map);

  };

};



speedTest.clear = function() {

  $('timetaken').innerHTML = 'cleaning...';

  for (var i = 0, marker; marker = speedTest.markers[i]; i++) {

    marker.setMap(null);

  }

};



speedTest.change = function() {

  speedTest.clear();

  speedTest.showMarkers();

};



speedTest.time = function() {

  $('timetaken').innerHTML = 'timing...';

  var start = new Date();

  if ($('usegmm').checked) {

    speedTest.markerClusterer = new MarkerClusterer(speedTest.map, speedTest.markers);



  } else {

    for (var i = 0, marker; marker = speedTest.markers[i]; i++) {

      marker.setMap(speedTest.map);

    }

  }



  var end = new Date();

  $('timetaken').innerHTML = end - start;

};