var link = thisUrlParams.link;

prefixes = queryManager['prefixes']['all'];

queryURL = prefixes + (queryManager['queryTimeSpace']['queryTimeLetters']);
doJsonQuery(queryURL).done(function(data) { manageJson(data); });

//console.log(luoghi);
var latitude = 43.8777049;
var longitude = 11.102228;

var mapIcon = "<div id='map_icon' class='no_info_icon'> \
<svg xmlns='http://www.w3.org/2000/svg' width='30' viewBox='0 0 576 512'> \
  <path d='M408 120C408 174.6 334.9 271.9 302.8 311.1C295.1 321.6 280.9 321.6 273.2 311.1C241.1 271.9 168 174.6 168 120C168 53.73 221.7 0 288 0C354.3 0 408 53.73 408 120zM288 152C310.1 152 328 134.1 328 112C328 89.91 310.1 72 288 72C265.9 72 248 89.91 248 112C248 134.1 265.9 152 288 152zM425.6 179.8C426.1 178.6 426.6 177.4 427.1 176.1L543.1 129.7C558.9 123.4 576 135 576 152V422.8C576 432.6 570 441.4 560.9 445.1L416 503V200.4C419.5 193.5 422.7 186.7 425.6 179.8zM150.4 179.8C153.3 186.7 156.5 193.5 160 200.4V451.8L32.91 502.7C17.15 508.1 0 497.4 0 480.4V209.6C0 199.8 5.975 190.1 15.09 187.3L137.6 138.3C140 152.5 144.9 166.6 150.4 179.8H150.4zM327.8 331.1C341.7 314.6 363.5 286.3 384 255V504.3L192 449.4V255C212.5 286.3 234.3 314.6 248.2 331.1C268.7 357.6 307.3 357.6 327.8 331.1L327.8 331.1z'/> \
</svg> \
<p>Nessun luogo trovato</p> \
</div>";


var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
      cloudmadeAttribution = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade, Points &copy 2012 LINZ',
      cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 17, attribution: cloudmadeAttribution}),
      latlng = new L.LatLng(latitude, longitude);

  
var map = new L.Map('map', {center: latlng, zoom: 5, layers: [cloudmade]});
mapLink = '<a href="https://openstreetmap.org">OpenStreetMap</a>';

//var markers = new L.MarkerClusterGroup();
//var markerList = [];

var geo = new L.tileLayer(
  'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; ' + mapLink + ' Contributors',
    maxZoom: 18,
  }).addTo(map);

var markerList = [];
var markers = new L.MarkerClusterGroup();
let anni = [];
let eventi = {};


function manageJson(json) {

  var i=0;

  $.each(
    json['results']['bindings'],
    function (index, value) {
      var uri = value['uri_place']['value'];
      var label = value['place']['value'];
      var coord = value['coords']['value'];
      var year = "";
      var month = "";
      var day = "";
      var uri_soggetto = value['uri_subject']['value'];
      var soggetto = value['subject']['value'];
      //var evento = value['event']['value'];
      var evento = "Invio"
      var data = value['time_span']['value'];
      
      if (value.hasOwnProperty('year')) {
        year = value['year']['value'];
        if (!anni.includes(year)) {
          anni.push(year);
        }
      }
      if (value.hasOwnProperty('month')) {
        month = value['month']['value'];
      }
      if (value.hasOwnProperty('day')) {
        day = value['day']['value'];
      }
      
      eventi[i] = {"uri_soggetto": uri_soggetto, "soggetto": soggetto, "uri_luogo": uri, "luogo": label, "coordinate": coord, "evento": evento, "data": data, "anno": year, "mese": month, "giorno": day};

      i++;

    });

    handle_map(eventi);
    manageYears(anni);

    manageEvents(eventi)

}

function handle_map(myArray) {
  //console.log(json);

  const locations = [];
  const place_names = [];
  const luoghi = [];
  

  for (i in myArray) {
    
        const loc = []
        var uri = myArray[i]['uri_luogo'];
        var label = myArray[i]['luogo'];
        var coord = myArray[i]['coordinate'];
        var year = myArray[i]['anno'];
        var month = myArray[i]['mese'];
        var day = myArray[i]['giorno'];
        var uri_soggetto = myArray[i]['uri_soggetto'];
        var soggetto = myArray[i]['soggetto'];
        //var evento = value['event']['value'];
        var evento = myArray[i]['evento']
        var data = myArray[i]['data'];
        
        if (!place_names.includes(uri)) {
          place_names.push(uri);
          const coordinates = coord.split(", ");
          loc.push(uri);
          label = titleCase(label);
          loc.push(label);
          loc.push(coordinates[0]);
          //lat += parseInt(coordinates[0]);
          loc.push(coordinates[1]);
          //long += parseInt(coordinates[1].replace(/^(\.)/,"0.").replace("-.", "-0."));
          locations.push(loc);
          
        }
        

  }


  for (var k=0; k<locations.length; k++) {
    const tempArray = [];
    var nomeLuogo = locations[k][1];
    var lt = locations[k][2];
    var lg = locations[k][3];
    tempArray.push(nomeLuogo);
    tempArray.push(lt);
    tempArray.push(lg);
    luoghi.push(tempArray);
  }

  function populate() {
    for (var i = 0; i < luoghi.length; i++) {
      var a = luoghi[i];
      
      var title = "<p>" + titleCase(a[0]) + "</p>";
      var marker = new L.Marker(new L.LatLng(a[1], a[2]), { title: title });
      //marker.bindPopup(title);
      //marker.on('click', markerOnClick);
      //$(marker._icon).addClass('selectedMarker');
      marker.on('click', function(){
        var name_place = $(this)[0].options.title;
        var markerLat = $(this)[0]._latlng['lat'];
        var markerLng = $(this)[0]._latlng['lng'];
        managePlace(name_place);
        });
      markers.addLayer(marker);
      markerList.push(marker);
    }
  }

  populate();
  //manageYears(anni);

  map.addLayer(markers);
  //manageEvents(eventi)

}

function markerOnClick(e)
{
  alert("hi. you clicked the marker at " + e.LatLng);
  console.log(e);
  
}


let time_span = [];

/*
function handle_map2(json) {
  
  cleanMap();

  const locations = [];
  const place_names = [];
  const luoghi = [];

  time_span = [];
  
  var lat = 0;
  var long = 0;
  var i=0;

  $.each(
      json['results']['bindings'],
      function (index, value) {
        const loc = []
        var uri = value['uri_place']['value'];
        var label = value['place']['value'];
        var coord = value['coords']['value'];
        
        
        if (!place_names.includes(uri)) {
          place_names.push(uri);
          const coordinates = coord.split(", ");
          loc.push(uri);
          label = titleCase(label);
          loc.push(label);
          loc.push(coordinates[0]);
          lat += parseInt(coordinates[0]);
          loc.push(coordinates[1]);
          long += parseInt(coordinates[1].replace(/^(\.)/,"0.").replace("-.", "-0."));
          locations.push(loc);
          i++;
        }

        if (value.hasOwnProperty('time_span')) {
          data = value['time_span']['value'];
          if (!time_span.includes(data)) {
            time_span.push(data);
          }
        }
        
      });


  for (var k=0; k<locations.length; k++) {
    const tempArray = [];
    var nomeLuogo = locations[k][1];
    var lt = locations[k][2];
    var lg = locations[k][3];
    tempArray.push(nomeLuogo);
    tempArray.push(lt);
    tempArray.push(lg);
    luoghi.push(tempArray);
  }
    
  function populate() {
    for (var i = 0; i < luoghi.length; i++) {
      var a = luoghi[i];
      
      var title = "<p>" + titleCase(a[0]) + "</p>";
      var marker = new L.Marker(new L.LatLng(a[1], a[2]), { title: title });
      marker.bindPopup(title);
      markers.addLayer(marker);
      markerList.push(marker);
    }
  }

  populate();
  manageDates(time_span);
  
}
*/

/*
function handle_map3(json) {
  
  cleanMap();

  const locations = [];
  const place_names = [];
  const luoghi = [];

  let eventi = [];
  
  var lat = 0;
  var long = 0;
  var i=0;

  $.each(
      json['results']['bindings'],
      function (index, value) {
        const loc = []
        var uri = value['uri_place']['value'];
        var label = value['place']['value'];
        var coord = value['coords']['value'];
        
        
        if (!place_names.includes(uri)) {
          place_names.push(uri);
          const coordinates = coord.split(", ");
          loc.push(uri);
          label = titleCase(label);
          loc.push(label);
          loc.push(coordinates[0]);
          lat += parseInt(coordinates[0]);
          loc.push(coordinates[1]);
          long += parseInt(coordinates[1].replace(/^(\.)/,"0.").replace("-.", "-0."));
          locations.push(loc);
          i++;
        }

        var uri_person = "";
        var person = "";
        var ev = "";

        if (value.hasOwnProperty('uri_person')) {
          uri_person = value['uri_person']['value'];
        }
        if (value.hasOwnProperty('person')) {
          person = value['person']['value'];
        }
        if (value.hasOwnProperty('event')) {
          ev = value['event']['value'];
        }

        eventi.push([ev, person, uri_person, coord]);
        
      });


  for (var k=0; k<locations.length; k++) {
    const tempArray = [];
    var nomeLuogo = locations[k][1];
    var lt = locations[k][2];
    var lg = locations[k][3];
    tempArray.push(nomeLuogo);
    tempArray.push(lt);
    tempArray.push(lg);
    luoghi.push(tempArray);
  }
    
  function populate() {
    for (var i = 0; i < luoghi.length; i++) {
      var a = luoghi[i];
      
      var title = "<p>" + titleCase(a[0]) + "</p>";
      var marker = new L.Marker(new L.LatLng(a[1], a[2]), { title: title });
      marker.bindPopup(title);
      markers.addLayer(marker);
      markerList.push(marker);
    }
  }

  populate();
  manageEvents(eventi);
  
}
*/

function managePlace(namePlace) {
  let eventPlace = {};
  var j=0;
  var place = namePlace.replace('<p>', '').replace('</p>', '');
  for (i in eventi) {
    if (eventi[i]['luogo'] == place) {
      eventPlace[j] = eventi[i];
      j++;
    } 
  }

  console.log(eventPlace);
  document.getElementById('timeline').innerHTML = "";
  manageEvents(eventPlace);

}

function manageYears(anni) {

  var Anni = "";

  anni.sort();
  
  for (i in anni) {
    var anno = anni[i];
    if (anno.length == 4) {
      Anni += '<div id="'+ anno + '" class="year">' + anno + '</div>';
    }
  }

  document.getElementById("anni").innerHTML = Anni;

}

let uniqueDates = [];

function manageDates(date) {

  uniqueDates = [];

  let evDates = {};

  var Date = "";

  for (i in date) {
    if (!uniqueDates.includes(date[i])) {
      uniqueDates.push(date[i]);
      var data = date[i];
      Date += '<div id="'+ data + '" class="date">' + data + '</div>';
    }
    for (j in eventi) {
      if (date[i] == eventi[j]['data']) {
        evDates[i] = eventi[j];
      }
    }
  }

  document.getElementById("anni").innerHTML = Date;

}

function manageEvents(events) {

  var Eventi = "";
  var anni = [];
  var days = [];
  var simpleDate = "";
  
  for (i in events) {
    var ev = events[i]['evento'];
    var soggetto = events[i]['soggetto'];
    var uri_soggetto = events[i]['uri_soggetto'];
    var uri_luogo = events[i]['uri_luogo'];
    var luogo = events[i]['place'];
    var coordinates = events[i]['coordinate'];
    var date = events[i]['data'];
    var anno = events[i]['anno'];
    var mese = events[i]['mese'];
    var giorno = events[i]['giorno'];

    if (anno.length == 4) {
      if (!anni.includes(anno)) {
        createYearSeed(anno);
        anni.push(anno);
      }
    }

    if (!days.includes(date)) {
        days.push(date);
        simpleDate = date;
        createDateSeed(simpleDate);
    } else {
        simpleDate = "";
    }

    Eventi = '<div data-point="' + coordinates + '" class="row event">' + 
    '<div class="col-1"></div><div class="col">' + ev + ' di ' + soggetto + '</div></div>';
  
    $('#timeline').append(Eventi);
  }

 
}

function createYearSeed(year) {

  var Anno = "<div id='" + year + "'><h2>" + year + "</h2></div>";

  $('#timeline').append(Anno);
}

function cleanMap() {
  markers.clearLayers();
}

function createDateSeed(date) {

  var Data = "<div class='row' id='" + date + "'><div class='col'>" + date + "</div>";

  $('#timeline').append(Data);
}

function cleanMap() {
  markers.clearLayers();
}


$(document).on("click", ".year", function (ev) {
  let eventYear = {};
  let date = [];
  var zoom = 5;
  var j=0;
  map.setView([latitude, longitude], zoom);
  anno = parseInt(this.id);
  for (i in eventi) {
    if (eventi[i]['anno'] == anno) {
      var data = eventi[i]['data'];
      date.push(data);
      eventYear[j] = eventi[i];
      j++;
    } 
  }

  document.getElementById('timeline').innerHTML = "";
  manageDates(date);
  manageEvents(eventYear);
  cleanMap();
  handle_map(eventYear);
  
  //queryAnno = prefixes + (queryManager['queryTimeSpace']['queryTime1']).replace('{YEAR}', anno);
  //doJsonQuery(queryAnno).done(function(data) { handle_map2(data); }); 

}); 

$(document).on("click", ".date", function (ev) {
  var date = this.id;
  let eventDay = {};
  var zoom = 5;
  var j=0;
  map.setView([latitude, longitude], zoom);
  var data = parseInt(this.id);
  for (i in eventi) {
    if (eventi[i]['data'] == date) {
      eventDay[j] = eventi[i];
      j++;
    } 
  }

  console.log(eventDay);
  document.getElementById('timeline').innerHTML = "";
  manageEvents(eventDay);
  cleanMap();
  handle_map(eventDay);

  //queryAnno = prefixes + (queryManager['queryTimeSpace']['queryTime2']).replace('{DATE}', date);
  //doJsonQuery(queryAnno).done(function(data) { handle_map3(data); }); 

}); 

$(document).on("mouseover", ".event", function(){
  // parse lat and lng from the divs data attribute
  var latlng = $(this).data().point.split(', ');
  var lat = latlng[0];
  var lng = latlng[1];
  var zoom = 10;

  map.setView([lat, lng], zoom);
});

$(document).on("click", ".event", function(){
  // parse lat and lng from the divs data attribute
  var latlng = $(this).data().point.split(', ');
  var lat = latlng[0];
  var lng = latlng[1];
  var zoom = 14;

  map.setView([lat, lng], zoom);
});



$(document).on("click", "#backToAnni", function (ev) {
  manageYears(anni);   

});  

$(document).on("click", "#backToDate", function (ev) {
  manageDates(time_span);   

});