let chart = null;
window.onload = init;

async function init() {
  let start = new Date();
  start.setDate(start.getDate() - 7);
  const end = new Date();

  document.getElementById("date-start").valueAsDate = start;
  document.getElementById("date-end").valueAsDate = end;
  document.getElementById("btn-refresh").addEventListener("click", loadData);

  loadData();
}

async function loadData() {
  const start = document.getElementById("date-start").value;
  const end = document.getElementById("date-end").value;
  const granularity = document.getElementById("granularity").value;

  const points = await fetchConsumption({
    start: start,
    end: end,
    granularity: granularity,
  });

  if (chart) {
    chart.destroy();
  }
  chart = renderChart(points);
}