$(document).ready(function() {

  $('#generate_button').on('click', function(e) {
    e.preventDefault();

    $.ajax({
      method: 'POST',
      url: '/reports',
      data: {
        type: $('#report_type').val(),
        choice: $('#report_choice').val(),
        compare: $('#report_compare').val(),
      }
    }).done(function(data) {
      benchChart.options.title.text = data.choice;
      benchChart.data.labels = data.names;
      benchChart.data.datasets[0].data = data.avg_results;
      benchChart.data.datasets[1].data = data.min_results;
      benchChart.update();
    });
  });

});

var benchChart = new Chart(document.getElementById('chart_canvas').getContext('2d'), {
  type: 'horizontalBar',
  data: {
    labels: [],
    datasets: [
      {
        label: 'Average FPS',
        data: [],
        backgroundColor: 'hotpink',
        borderColor: '#212121',
        borderWidth: 1,
      },
      {
        label: 'Minimum FPS',
        data: [],
        backgroundColor: 'cornflowerblue',
        borderColor: '#212121',
        borderWidth: 1,
      }
    ]
  },
  options: {
    title: {
      display: true,
      text: 'N/a'
    },
    scales: {
      xAxes: [{
        display: true,
        ticks: {
          beginAtZero: true
        }
      }]
    },
    animation: {
      onComplete: function() {
        var dwnbtn = $('#download_button');
        dwnbtn.attr('href', benchChart.toBase64Image());
        dwnbtn.attr('download', 'benchmark_chart.png');
        dwnbtn.attr('disabled', false);
      },
    }
  }
});