aswi2020sebela-gitlab/website/public/js/zcu-heatmap.js @ a48642fb

var mymap;
var heatmapLayer = null;

var startX = 49.7248;
var startY = 13.3521;
var startZoom = 17;

var dataSourceRoute;
var currentTime;
var name;
var date;

var timer;
var isAnimationRunning = false;
var data = [];



function initMap() {
  mymap = L.map('heatmap').setView([startX, startY], startZoom);

  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '',
    maxZoom: 19
  }).addTo(mymap);
}


function setMapView(latitude = startX, longitude = startY, zoom = startZoom) {
  mymap.setView([latitude, longitude], zoom);
}

function changeAnimationState() {

  isAnimationRunning = !isAnimationRunning
  if (isAnimationRunning) {
    $('#play-pause').attr('class', 'pause');
    timer = setInterval(
      function() {
        next();
      },
      800
    );
  }
  else {
    clearTimeout(timer);
    $('#play-pause').attr('class', 'play');
  }


}

function previous() {
  currentTime = (currentTime + 23) % 24;
  drawHeatmap(data[currentTime]);
  setTimeline();
}

function next() {
  currentTime = (currentTime + 1) % 24;
  drawHeatmap(data[currentTime]);
  setTimeline();
}

function setTimeline() {
  $('#timeline').text(currentTime + ":00");
  $('#timeline').attr('class', 'time hour-' + currentTime);
}

function loadCurrentTimeHeatmap(route) {

  dataSourceRoute = route;
  data = []

  name = $('#type').children("option:selected").text();
  var parts = $('#date').val().split('-');
  date = parts[2] + parts[1] + parts[0];
  currentTime = parseInt($('#time').children("option:selected").val());
  setTimeline();

  $.ajax({
    type: "POST",
    url: dataSourceRoute + '/' +  name + '/' + date + '/' + currentTime,
    success: function(result) {
      data[currentTime] = result;
      drawHeatmap(data[currentTime]);
    }
  });

  preload(currentTime, 1);
  preload(currentTime, -1);

}

function preload(time, change) {

  var ntime = time + change; 
  if (0 <=  ntime && ntime <= 23) {
      $.ajax({
        type: "POST",
        url: dataSourceRoute + '/' +  name + '/' + date + '/' + ntime,
        success: function(result) {
          data[ntime] = result;
          preload(ntime, change);
        }
      });
  }

}


function drawHeatmap(points) {

  // Todo still switched
  if (points != null) {
    points = points.map(function (p) { return [p['x'], p['y'], p['number']]; });
    if (heatmapLayer != null) {
      mymap.removeLayer(heatmapLayer);
    }
    heatmapLayer = L.heatLayer(points).addTo(mymap);
  }
  else {
    if (heatmapLayer != null) {
      mymap.removeLayer(heatmapLayer);
    }
  }

  // var heat_01 = ...
  // on background map.addLayer(heat_01) -> map.removeLayer(heat_01);
  // $(.leaflet-heatmap-layer).css('opacity', 'value');
}

function checkDataSetsAvailability(route) {

  var parts = $('#date').val().split('-');
  
  $.ajax({
    type: "POST",
    // Todo it might be good idea to change db collections format
    url: route + '/' + parts[2] + parts[1] + parts[0],
    success: function(result) {
      updateAvailableDataSets(result);
    }
  });
}

function updateAvailableDataSets(available) {
  
  var options = '';

  Object.entries(available).forEach(([key, value]) => {
    options += '<option value="' + value + '">' + key + '</option>\n'; 
  });

  $('#type').empty().append(options);
  
}