radiodraws
10/23/2017 - 9:14 AM

mapa fsmcv musica i poble leaflet

mapa fsmcv musica i poble leaflet

(function($, window, document) {

  var $eventArray = new Array(); // save events in array to change og:title metatags id url patrameter

  var evt_id = evtid !== '' ? evtid : 0;

  /*-------------------------------*/
  //////////////////////////LEAFLET
  var mymap = L.map('mapid', {
    scrollWheelZoom: false,
  }).setView([39.203343, -0.311333], 6.5);

  //--MARKERS
  var markers = L.markerClusterGroup({
    spiderfyOnMaxZoom: true,
    showCoverageOnHover: false,
    zoomToBoundsOnClick: true,
    iconCreateFunction: function(cluster) {
      return L.divIcon({ html: '<div class="marker-cluster">' + cluster.getChildCount() + '</div>' });
    },
    maxClusterRadius: 40
  });
  var markerList = {};
  var geoMarker;

  //--TILES
  var retina = isRetina() ? '@2x' : '';
  console.log(retina);

  var mapLayer = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/256/{z}/{x}/{y}' + '' + '?access_token=pk.eyJ1IjoiY2Fyb2xpbmF2YWxsZWpvIiwiYSI6ImNqNGZuendsZDFmbmwycXA0eGFpejA5azUifQ._a5sIBQuS72Kw24eZgrEFw', {
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
    maxZoom: 15,
    id: 'mapbox.streets',
    accessToken: 'pk.eyJ1IjoiY2Fyb2xpbmF2YWxsZWpvIiwiYSI6ImNqNGZuendsZDFmbmwycXA0eGFpejA5azUifQ._a5sIBQuS72Kw24eZgrEFw'
  }).addTo(mymap);

  //--ICOS
  var icon_w = 38;
  var LeafIcon = L.Icon.extend({
    options: {
      iconSize: [icon_w, icon_w],
      shadowSize: [50, 64],
      iconAnchor: [(icon_w / 2), (icon_w)],
      popupAnchor: [0, ((icon_w) * -1)]
    }
  });

  var localIcon = new LeafIcon({ iconUrl: 'assets/marker-ico.svg' }),
    geoIcon = new LeafIcon({ iconUrl: 'assets/geoIcon.svg' });

  //--ADD LAYER MARKERS
  mymap.addLayer(markers);

  /*-------------------------------*/
  //////////////////////////LOAD JSON DATA
  var spreadsheetID = "1G5zNQaTUMchwrFmv6iS99JaGh_uns3WNF_Z2vfZAVKY";
  var url = "https://spreadsheets.google.com/feeds/list/" + spreadsheetID + "/1/public/values?alt=json";
  var url_ = 'data/data.json';

  var mobile = 768;

  ///////////////// ON READY!
  $(function() {

    var $htlm = $('html,body');
    $htlm.animate({ scrollTop: 0 }, 500);

    //---CHECK LOAD
    var $loader1 = $('#loader'),
      $loader2 = $('#loader2');
    mapLayer.on('load', function() {
      $loader1.addClass('stoploader');
      $loader2.css('display', 'block');
    });

    //----CLOSE BTNS
    var $filterNav = $('#filter-nav'),
      $filterToggle = $('#filter-toggle');

    $('.close-btn').on('click', function(e) {
      e.preventDefault();
      $(this).parents('.box-event').addClass('minimize');
      $(geoMarker._icon).hide();
    });
    $('#tag-geo').on('click', function(e) {
      e.preventDefault();
      if ($(this).parents('.box-event').hasClass('minimize')) {
        $htlm.animate({ scrollTop: 0 }, 500);
        $(this).parents('.box-event').removeClass('minimize');
        $(geoMarker._icon).show();
      }
    });

    $filterToggle.on('click', function() {

      $filterNav.toggle();
      $(this).toggleClass('show');

    });

    $('#ver-semana').on('click', function(e){
      e.preventDefault();
      
      var boxSlider = $('#wrap-evts').offset();
      $htlm.animate({ scrollTop: boxSlider.top - 100 }, 500);
    });

    $('#switch-map').on('click', function(e){
      e.preventDefault();
      $(this).toggleClass('is-on');
    });

    //---COLLAPSABLES
    $('.checkbox label').on('click', function(){
      $(this).toggleClass('toggle').next('ul').slideToggle();

    });

    //---LOAD DATA
    d3.json(url, function(error, data) {

      //--get evt by location
      getLocation();

      //---PROCESS RANGE IN DATA
      data.feed.entry.forEach(function(d) {
        var fecha_final = d.gsx$fechafinal.$t !== '' ? d.gsx$fechafinal.$t : d.gsx$fecha.$t;
        d.gsx$fecha.$range = [d.gsx$fecha.$t, fecha_final];
      });

      window.globalData = data.feed.entry;

      var dataByMunicipio = d3.nest()
        .key(function(d) {
          return d['gsx$ubicacion-evento-municipio'].$t.toLowerCase().trim();
        }).sortKeys(d3.ascending)
        .entries(data.feed.entry);

      var dataByComarca = d3.nest()
        .key(function(d) {
          return d.gsx$comarca.$t.toLowerCase().trim();
        }).sortKeys(d3.ascending)
        .entries(data.feed.entry);

      var dataByProvincia = d3.nest()
        .key(function(d) {
          return d.gsx$provincia.$t.toLowerCase().trim();
        }).sortKeys(d3.ascending)
        .entries(data.feed.entry);

      var dataByFederacion = d3.nest()
        .key(function(d) {
          return d.gsx$federacion.$t;
        }).sortKeys(d3.ascending)
        .entries(data.feed.entry);

      var dataByCampanya = d3.nest()
        .key(function(d) {
          return d.gsx$campanya.$t;
        }).sortKeys(d3.ascending)
        .entries(data.feed.entry);

      //---DRAW FIRST MARKERS
      drawMarkers(data.feed.entry, true);
      $('#loader2').addClass('stoploader');

      /*-------------------------------*/
      //////////////////////////UI GENERATOR

      window.objFilter = {};

      //---SELECTORES
      selectsBuilder('ubicacion-evento-municipio', dataByMunicipio);
      selectsBuilder('comarca', dataByComarca);
      selectsBuilder('provincia', dataByProvincia);

      //---CHECKBOXES
      checkboxesBuilder('federacion', dataByFederacion);
      checkboxesBuilder('campanya', dataByCampanya);

      //----DATE PICKER

      var $dateRange = $('#date-range');
      window['moment-range'].extendMoment(moment);
      moment.locale('ca');
      $dateRange.dateRangePicker({
        separator: ' fins a ',
        format: 'DD/MM/YYYY',
        autoClose: true,
        showShortcuts: false,
        language: 'es',
        startOfWeek: 'monday', // or monday
      }).bind('datepicker-change', function(event, obj) {
        var range = moment.range(obj.date1, obj.date2);
        var arrRange = [];
        for (var month of range.by('day')) {
          arrRange.push(month.format('YYYY-MM-DD'));
        }
        if (arrRange.length !== 0) {
          objFilter.date = arrRange;
        }

      });

      $('#date-range').click(function(e){
            e.preventDefault();
        });
     



      //----FILTER ACTION
      $('#filtrar-btn').on('click', function() {

        //---CHECK DATE
        if ($('#date-range').val().trim() === '') {
          delete objFilter.date;
        }

        //---GET OPTIONS SELECTED
        $('select').each(function() {
          var $this = $(this);
          var id = $this.attr('id').replace('-select', '');
          delete objFilter[id];
          if ($this.find('option:selected').val() !== 'all') {
            objFilter[id] = $this.find('option:selected').text();
          }
        });

        //---GET FEDERACION
        var arrFederacionChecked = [];
        $('#federacion-checkbox .checkbox-input').each(function() {
          var $this = $(this);
          var id = $this.attr('id').replace('checkbox-', '');
          if ($(this).hasClass('checked')) {
            arrFederacionChecked.push(id);
          }
        });
        delete objFilter.federacion;
        if (arrFederacionChecked.length > 0) {
          objFilter.federacion = arrFederacionChecked;
        }

        //---GET CAMPAÑA
        var arrCampanyaChecked = [];
        $('#campanya-checkbox .checkbox-input').each(function() {
          var $this = $(this);
          var id_ = $this.attr('id').replace('checkbox-', '');
          var id = $this.next().text().toLowerCase().trim();
          if ($(this).hasClass('checked')) {
            arrCampanyaChecked.push(id);
          }
        });
        delete objFilter.campanya;
        if (arrCampanyaChecked.length > 0) {
          objFilter.campanya = arrCampanyaChecked;
        }

        ///////////////////////////
        //----GET NEW DATA
        drawMarkers(getFilterData(data.feed.entry), false);

        $filterNav.fadeOut('fast', function() {
          $filterToggle.addClass('show');
        });
        $htlm.animate({ scrollTop: 0 }, 500);

      }); //----END CLICK FILTER

      //----UPDATE SELECT OPTIONS
      var $municipio_select = $('#ubicacion-evento-municipio-select');
      var $comarca_select = $('#comarca-select');
      var $provincia_select = $('#provincia-select');

      $provincia_select.on('change', function() {
o

        //---MODIFY NEXT SELECTION
        $comarca_select.find('option').show();
        $comarca_select.find('option').prop("selected", false);

        $comarca_select.find('.default-option').prop("selected", true);
        $municipio_select.find('.default-option').prop("selected", true);

        if ($(this).val() !== 'all') {
          $comarca_select.find('option:not(' + '.option-' + $(this).val() + ')').hide();

        }
      });

      $comarca_select.on('change', function() {
        //---MODIFY NEXT SELECTION
        $municipio_select.find('option').show();

        if ($(this).val() !== 'all') {
          $municipio_select.find('option:not(' + '.option-' + $(this).val() + ')').hide();
        }

      });

      //---LIMPIAR FECHAS
      $('#limpiar-fechas').on('click', function(e) {
        e.preventDefault();
        console.log($dateRange);
        $dateRange.data('dateRangePicker').clear();
        delete objFilter.date;
      });

      //---BTN LIMPIAR FILTROS
      $('#limpiar-btn').on('click', function() {
        objFilter = {};

        $dateRange.data('dateRangePicker').clear();
        $("option:selected").prop("selected", false);
        $('.checkbox-input').removeClass('checked');

        $municipio_select.find('option')
          .show()
          .prop("selected", false);
        $comarca_select.find('option')
          .show()
          .prop("selected", false);
        $provincia_select.find('option')
          .show()
          .prop("selected", false);

        $municipio_select.find('.default-option').prop('selected', true);

        //---DRAW AGAIN ALL MARKERS
        drawMarkers(data.feed.entry, false);

      });

      //-----SLIDER EVTS
      function drawSliderEvent() {

        //draw events of today
        /*
        var now = moment().format('YYYY-MM-DD');
        var arrDataSliderToday = getDataByDate([now], data.feed.entry);
        */

        //draw events of next 7 days:
        var weekArr = [];
        for (var i = 1; i < 8; i++) {
          weekArr.push(moment().add(i, 'days').format('YYYY-MM-DD'));
        }

        var arrDataSliderWeek = getDataByDate(weekArr, data.feed.entry);

        var $htmlTemplate = $('#template-evt-slider');
        var $htmlContainer = $('#slider-evts-semana').empty();
        var $staticticsWrap = $('#statistics-wrap');


        var sliderDataByCampanya = d3.nest()
          .key(function(d) {
            return d.gsx$campanya.$t;
          }).sortKeys(d3.ascending)
          .entries(arrDataSliderWeek);

        arrDataSliderWeek.forEach(function(d) {
          constructHtmlEvent(getEventData(d), $htmlTemplate);
          $htmlContainer.append($htmlTemplate.html());
        });

        //---DATA STATISTICS:
        var htmlStatistics = '';
        sliderDataByCampanya.forEach(function(d, i) {

          htmlStatistics += '<span class="actividad"><span class="num">' + d.values.length +
            ' </span><span class="name">' + d.key + '</span></span>' + (i === sliderDataByCampanya.length - 1 ? '' : '<span class="plus">+</span>');

        });
        htmlStatistics += '';

        $staticticsWrap.empty().append(htmlStatistics);

        var owl = $('#slider-evts-semana');
        owl.owlCarousel({
          dots: true,
          loop: true,
          margin: 50,
          nav: true,
          responsive: {
            0: {
              items: 1
            },
            400: {
              items: 2
            },
            768: {
              items: 3
            }
          },
          onRefresh: function() {
            owl.find('div.owl-item').height('');
          },
          onRefreshed: function() {
            owl.find('div.owl-item').height(owl.height() - 30);
          }
        });
      }

      drawSliderEvent();

      //----SHARE BUTTONS


      //---OJO SOLO BUSCAR LOS QUE TIENEN DATA EVENT/excluir los templates
      init_share_socials($('.evt-slider a.facebook'));
      init_share_socials($('.evt-slider a.twitter'));

      mymap.on('popupopen', function(e) {
        init_share_socials($('.leaflet-popup-content .tooltip-marker a.facebook'));
        init_share_socials($('.leaflet-popup-content .tooltip-marker a.twitter'));
      });

      //--- RESPONSIVE CONFIGS
      var $near_box = $('#near-to-you').find('.box-event');
      matchMobile(function() {
        $near_box.addClass('minimize');
      }, function() {
        $near_box.removeClass('minimize');
      });

    }); //----GET JSON

  }); //---END: READY

  //////////////////////////////////
  /*/////////- FUNCTIONS -////////*/


  function matchMobile(function1, function2) {
    function match() {
      if (window.matchMedia('(max-width: ' + mobile + 'px)').matches) {
        function1();
      } else {
        function2();
      }
    }
    match();
    $(window).resize(function() {
      match();
    });
  }

  function init_share_socials($elm) {


    $elm.each(function() {

      var $this = $(this);
      var $thisParent = $this.parents('.box-event');
      var attr = $thisParent.attr('data-id');

      if (typeof attr !== 'undefined' && attr !== false) {
        switch ($this[0].className) {
          case 'facebook':
            click_share_facebook($this, attr);
            break;
          case 'twitter':
            click_share_twitter($this, attr);
            break;
          default:
            break;
        }

      }
    });
  }

  function click_share_facebook($elm, id) {
    $elm.on('click', function(e) {
      e.preventDefault();
      var facebookStr = 'https://www.facebook.com/sharer.php?u=';
      var url = 'https://fsmcv.org/musicaipoble/?evtid=' + id;
      window.open(facebookStr + url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
    });
  }

  function click_share_twitter($elm, id) {
    $elm.on('click', function(e) {
      e.preventDefault();
      var twitterUrl = 'http://twitter.com/share?hashtags=IntercambiosMusicales,MusicaiPoble&via=FSMCV&url=';
      var shareUrl = 'https://fsmcv.org/musicaipoble/?evtid=' + id;
      window.open(twitterUrl + shareUrl, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
    });
  }

  function drawDestacadoGeo(pos, noGeo) {
    //---FIND EVENT BY COORDINATE
    var geoJsonFscmv = {
      "type": "FeatureCollection",
      "features": [] //---array
    }
    var now = moment();
    var inAweek = moment().add(15, 'days');

    globalData.forEach(function(d, i) {

      if (d.gsx$latitud.$t !== '' && d.gsx$longitud.$t !== '') {
        //---filtrar por los eventos pasados

        if (d.gsx$fecha.$range[0] !== '') {

          if (moment(formatDate(d.gsx$fecha.$range[1])).isBetween(now, inAweek, null, '[]')) {
            geoJsonFscmv.features.push({
              "type": "Feature",
              "properties": {},
              "geometry": {
                "type": "Point",
                "coordinates": [parseFloat(d.gsx$longitud.$t), parseFloat(d.gsx$latitud.$t)]
              }
            });
          }
        } //---end if data exists
      }
    });

    //---GET NEAREST!
    var gj = L.geoJson(geoJsonFscmv);
    var nearest = leafletKnn(gj).nearest(L.latLng(pos[0], pos[1]), 1);
    var $near_box = $('#near-to-you');
    globalData.forEach(function(d, i) {

      //--filtrar el evento mas cercano
      if (parseFloat(d.gsx$latitud.$t) === nearest[0].lat) {
        constructHtmlEvent(getEventData(d), $near_box);

        var latlng = L.latLng(parseFloat(d.gsx$latitud.$t), parseFloat(d.gsx$longitud.$t));
        geoMarker = new L.Marker(latlng, { icon: geoIcon });
        mymap.addLayer(geoMarker);

        //---INSERT HTML IN GEO LOCATION TOOLTIP:
        $htmlTemplate = $('#template-tooltip');
        constructHtmlEvent(getEventData(d), $htmlTemplate);
        geoMarker.bindPopup($htmlTemplate.html());

        init_share_socials($near_box.find('a.facebook'));

      }
    });
  }

  function constructHtmlEvent(evtData, $elm, istooltip) {
    //---CLEAN EVERYTHING:
    $elm.find('.box-event').removeAttr('data-id');
    $elm.find('.big-title').empty();
    $elm.find('.tag').empty();
    $elm.find('.localization').empty();
    $elm.find('.time').empty();
    $elm.find('.date').empty();
    $elm.find('.event-body').empty();

    //---INSERT NEW DATA
    $elm.find('.box-event')
      .attr('data-id', evtData.id);

    if (evtData.campanya === 'Intercanvis musicals') {
      $elm.find('.box-event').addClass('intercambio');
    }

    $elm.find('.big-title').text(evtData.tituloUbicacion);
    $elm.find('.tag').text(evtData.campanya);

    $elm.find('.localization').text(evtData.direccion);

    var $timeDiv = $elm.find('.time');
    if (evtData.hora !== '') {
      $timeDiv.text(evtData.hora);
      $timeDiv.css('display', 'block');
    } else {
      $timeDiv.css('display', 'none');
    }

    if (evtData.dia !== '') {

      var htmlDate = '';

      evtData.dia.forEach(function(d) {
        var month = moment(formatDate(d)).format("MMMM[, ]");
        var year = moment(formatDate(d)).format("YYYY");
        var day = moment(formatDate(d)).format("D");

        htmlDate += '<div class="wrap-day"><span class="day">' + day +
          '</span><span class="month-year">' + month + '<br>' + year + '</span></div>';
      });

      $elm.find('.date').html(htmlDate);
    }

    if (Array.isArray(evtData.tituloEvento)) {
      var html = '';
      evtData.tituloEvento.forEach(function(d) {

        var municipio = typeof d[1] !== 'undefined' ? d[1] : '';
        var sociedad = typeof d[0] !== 'undefined' ? d[0] : '';

        var unidad = typeof d[2] !== 'undefined' ? (d[2] !== d[0] ? d[2] + ' - ' : '') : '';

        html += '<div class="content">';
        html += '<div class="title">' + unidad + sociedad + '</div>';
        html += '<div class="subtitle">' + municipio + '</div>';
        html += '</div>';

      });

      $elm.find('.event-body').html(html);
    } else {

      var html = '';
      html += '<div class="content">';
      html += '<div class="title titulo-evt">' + evtData.tituloEvento + '</div>';
      html += '</div>';

      $elm.find('.event-body').html(html);

    }

    if (!istooltip) {
      $elm.find('.hide').removeClass('hide');
    }
  }

  function getEventData(d) {


    // save all events in array to change og tags
    $eventArray[d.gsx$id.$t] = d;

    var objPrint = {
      //---ID EVENTO
      'id': d.gsx$id.$t,
      //--ROJO HEAD
      'tituloUbicacion': (function() {
        if (d.gsx$campanya.$t === 'Concerts al Templete' || d.gsx$campanya.$t === 'Les Bandes al Palau de Peníscola' || d.gsx$campanya.$t === 'V Cicle Bandes a l\'ADDA') {
          return d.gsx$direccion.$t;
        } else {
          return d['gsx$ubicacion-evento-municipio'].$t;
        }
      })(),
      // BIG - BODY
      'tituloEvento': (function() {
        var result = '';
        if (d.gsx$campanya.$t === 'Intercanvis musicals' || d.gsx$campanya.$t === 'Concerts al Templete' || d.gsx$campanya.$t === 'V Cicle Bandes a l\'ADDA' || d.gsx$campanya.$t === 'Les Bandes al Palau de Peníscola' || d.gsx$campanya.$t === 'Música als Pobles') {

          var arrDatosSociedad = [];
          var cadaSociedad = d.gsx$participantes.$t.concat(';').split("001:");

          cadaSociedad.forEach(function(d, i) {

            if (d.length !== 0) {

              d = '001:' + d;
              d = d.substring(0, d.length - 1);
              var cadaDatoSociedad = d.split(";");
              var cadaDatoSociedadLimpio = cadaDatoSociedad.map(function(dat) {
                return dat.substring(4, d.length);
              });
              arrDatosSociedad.push(cadaDatoSociedadLimpio);
            }
          });
          result = d.gsx$participantes.$t;
          return arrDatosSociedad;

        } else {
          return d.gsx$titulo.$t;;
        }


      })(),
      'campanya': d.gsx$campanya.$t,
      'dia': (function() {
        var result = '';
        if (d.gsx$fecha.$range[0] !== '') {

          if (moment(formatDate(d.gsx$fecha.$range[0])).isSame(formatDate(d.gsx$fecha.$range[1]))) {
            result = [d.gsx$fecha.$range[0]];
          } else {

            result = [d.gsx$fecha.$range[0], d.gsx$fecha.$range[1]];
          }
        } else {
          result = '';
        }
        return result;
      })(),
      'hora': d.gsx$hora.$t,
      'direccion': (function() {

        var dir = '';
        if (d.gsx$direccion.$t !== '') {
          dir = d.gsx$direccion.$t + ', ';
        }

        return dir + d['gsx$ubicacion-evento-municipio'].$t + ', ' + d.gsx$comarca.$t + ' - ' + d.gsx$provincia.$t;

      })(),
      'municipio': d['gsx$ubicacion-evento-municipio'].$t,
      'comarca': d.gsx$comarca.$t,
      'provincia': d.gsx$provincia.$t
    };
    return objPrint;
  }

  function getLocation() {
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showPosition, showError);

    } else {
      console.log("Geolocation is not supported by this browser.");
    }
  }

  function showPosition(position) {


    var userLocalization = [position.coords.latitude, position.coords.longitude];
    drawDestacadoGeo(userLocalization, false);
  }

  function showError(error) {
    var $near_box = $('#near-to-you');
    switch (error.code) {
      case error.PERMISSION_DENIED:
        $near_box.hide();
        console.log("User denied the request for Geolocation.");
        break;
      case error.POSITION_UNAVAILABLE:
        $near_box.hide();
        console.log("Location information is unavailable.");
        break;
      case error.TIMEOUT:
        $near_box.hide();
        console.log("The request to get user location timed out.");
        break;
      case error.UNKNOWN_ERROR:
        $near_box.hide();
        console.log("An unknown error occurred.");
        break;
    }
  }

  function getFilterData(data) {
    var counterLocal = 1;
    var arrFiltering = [data];
    var arrCheckeds = [];
    var arrInRangeDates = [];
    var resultArr = [];
    //--ITERATION FOR P/C/M
    for (var item in objFilter) {
      if (!Array.isArray(objFilter[item])) {
        arrFiltering[counterLocal] = arrFiltering[counterLocal - 1].filter(function(d) {
          return d['gsx$' + item].$t.toLowerCase().trim() === objFilter[item];
        });
        //console.log(item + '  ' + objFilter[item]);
        counterLocal++;
      }
    }
    resultArr = arrFiltering[arrFiltering.length - 1];
    //--ITERATION FOR CHECKBOXES
    for (var item in objFilter) {
      if (Array.isArray(objFilter[item])) {
        if (item !== 'date') {
          //--iterar por cada seccion de checkboxes
          objFilter[item].forEach(function(dato, i) {
            resultArr.filter(function(d) {
              if (d['gsx$' + item].$t.toLowerCase().trim() === dato) {
                arrCheckeds.push(d);
              }
            });
          }); //---end for
          resultArr = arrCheckeds;
          arrCheckeds = [];
        }
      }
    }
    //--ITERATION FOR DATES
    if (objFilter.hasOwnProperty('date')) {
      //--iterar por las fechas seleccionadas

      var filterDateArr = getDataByDate(objFilter['date'], resultArr);

      resultArr = filterDateArr;

    } //---if has date property

    //---RETURN DATA ARRAY
    console.log('------resultArr----->' + resultArr.length);
    return resultArr;
  }

  function getDataByDate(data, prevArr) {
    var arrIdEvts = {};
    var arr = [];

    data.forEach(function(dateSelected, i) {
      //--iterar por el data filtrada
      prevArr.filter(function(d) {
        if (d.gsx$fecha.$range[0] !== '') {
          var isInRange = moment(dateSelected).isBetween(formatDate(d.gsx$fecha.$range[0]), formatDate(d.gsx$fecha.$range[1]), null, '[]');

          if (isInRange) {

            //only get one event if is in the range
            if (!arrIdEvts.hasOwnProperty('id-' + d.gsx$id.$t)) {
              arr.push(d);
            }
            arrIdEvts['id-' + d.gsx$id.$t] = d.gsx$id.$t;
          }
        }
      });
    }); //---end for

    return arr;
  }

  //-------------------------------
  //---DRAW MARKERS
  var arrLngs = [];

  function drawMarkers(data, init) {
    var $htmlTemplate;


    $htmlTemplate = $('#template-tooltip');

    //---clean MARKERS:
    arrLngs = [];
    markers.clearLayers();

    //-----get data
    data.forEach(function(d) {
      //console.log(d)

      if (init) {
        var today = moment();
        //console.log(today.format('YYYY-MM-DD'))

        if (d.gsx$fecha.$range[0] !== '') {
          if (moment(formatDate(d.gsx$fecha.$range[1])).isSameOrAfter(today.format('YYYY-MM-DD'))) {
            addMarker(d);
          }
        }
      } else {
        addMarker(d);
      }



    });

    function addMarker(d) {
      if (d.gsx$latitud.$t !== '' && d.gsx$longitud.$t !== '') {
        var latitud = parseFloat(d.gsx$latitud.$t),
          longitud = parseFloat(d.gsx$longitud.$t);

        var latlng = L.latLng(latitud, longitud);
        arrLngs.push(latlng);
        var m = new L.Marker(latlng, {
          icon: localIcon
        });


        markers.addLayer(m);
        //m.evtid = 'evtid' + d.gsx$id.$t;
        markerList['evtid-' + d.gsx$id.$t] = m;

        //---INSERT HTML IN TOOLTIP:
        constructHtmlEvent(getEventData(d), $htmlTemplate);
        m.bindPopup($htmlTemplate.html());
      }
    }

    rezoom();

    if (init) {
      //----MAKE ZOOM AND OPEN POPUP!
      if (evt_id !== 0) {

        // read event data pass in url
        var $eventDate = $eventArray[evt_id].gsx$fecha.$t;
        var $eventCity = $eventArray[evt_id].gsx$municipiosm.$t;
        var $content = "Música a " + $eventCity + " el " + $eventDate + ". Música i Poble";
        $("meta[name='og\\:title']").attr("content", $content);

        if (markerList.hasOwnProperty('evtid-' + evt_id)) {
          setTimeout(function() {

            var actMarker = markerList['evtid-' + evt_id];
            markers.zoomToShowLayer(actMarker, function() {
              actMarker.openPopup();
            });
            mymap.panTo(new L.LatLng(actMarker._latlng.lat, actMarker._latlng.lng));
          }, 1000);
        }
      }

    } //---INIT OPEN POPUP


  }

  function rezoom() {
    //console.log(arrLngs);
    var bounds = new L.LatLngBounds(arrLngs);
    //console.log(bounds);
    arrLngs.length !== 0 && mymap.fitBounds(bounds);
  }

  function formatDate(date) {
    var dayStr = date.substring(0, 2);
    var monthStr = date.substring(3, 5);
    var yearStr = date.substring(6, 10);
    return yearStr + '-' + monthStr + '-' + dayStr;
  }

  function checkboxesBuilder(place, arr) {
    var $elm = $('#' + place + '-checkbox');
    var html = '';
    arr.forEach(function(d) {
      //clean_characters(d.key)
      //d.key
      html += '<li><span class="checkbox-input" id="' + 'checkbox-' + clean_characters(d.key) + '">x</span><span>' + d.key + '</span></li>';
    });
    $elm.empty();
    $elm.append(html);
    //---INTERACTION
    $elm.find('.checkbox-input').on('click', function(e) {
      e.preventDefault();
      $(this).toggleClass('checked');
    });
  }

  function selectsBuilder(place, arr) {
    var $elm = $('#' + place + '-select');
    var html = '';
    arr.forEach(function(d) {
      var tag = '';
      if (place === 'comarca') {
        tag = clean_characters(d.values[0]['gsx$provincia'].$t);
      }
      if (place === 'ubicacion-evento-municipio') {
        tag = clean_characters(d.values[0]['gsx$comarca'].$t);
      }
      html += '<option class="' + 'option-' + tag + '" value="' + clean_characters(d.key) + '">' + d.key + '</option>';

    });
    $elm.append(html);
  }
  /////////////////////////////////////////////
  /*/////////- AUXILIARY FUNCTIONS -////////*/

  function isRetina() {
    return ((window.matchMedia && (window.matchMedia('only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx), only screen and (min-resolution: 75.6dpcm)').matches || window.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2)').matches)) || (window.devicePixelRatio && window.devicePixelRatio >= 2)) && /(iPad|iPhone|iPod)/g.test(navigator.userAgent);
  }

  function clean_characters(str) {
    //---regex \s = espacio, + = seguidos, g = match all (global), | = pipe(concatenar) 
    return str.toLowerCase().replace(/\s+|\.+|\,+|\'+|\&+|\(+|\)+|\:+|[\u00C0-\u00FF]+|\/+/g, '');
  }


}(window.jQuery, window, document));