function display_metrics(metrics_datas) {
  // Get data from API and then generate HTML code to display the data in a table
  const table = document.getElementById("table-metrics");
  let datas = `<tr>
                <th>Date</th>
                <th>Température</th>
                <th>Hygrométrie</th>
                </tr> `;
  for (let i = 0; i < metrics_datas.length; i++) {
    datas += `<tr>
              <th>${formatDate(metrics_datas[i].date_metrique)}</th>
                <th>${metrics_datas[i].temperature}</th>
                <th>${metrics_datas[i].hygrometrie}</th>
                </tr>`;
  }
  table.innerHTML = datas;
}

// function display_metrics(images_datas) {
//   // Get data from API and then generate HTML code to display the data in a table
//   const table_image = document.getElementById("table-image");
//   let datas = `<tr>
//                 <th>Images</th>

//                 </tr> `;
//   for (let i = 0; i < images_datas.length; i+=3) {
//     if(i+2<images_datas.length)
//     datas += `<tr>
//                 <th>${images_datas[i]}</th>
//                 <th>${images_datas[i+1]}</th>
//                 <th>${images_datas[i+2]}</th>
//                 </tr>`;
//   }
//   table_image.innerHTML = datas;
// }

document.addEventListener("DOMContentLoaded", () => {
    const urlParams = new URLSearchParams(window.location.search);
    const projectId = urlParams.get("id");
    getDataProjectMetricsFromApi(projectId)
    .then(project_metrics => {
      display_metrics(project_metrics);
    })
    .catch(error => {
      console.error(error);
    });
    document.getElementById("projets").addEventListener("click", () => {
      window.location.href = "../index.html";
      current_project="";
    });
    global_project_list=JSON.parse(localStorage.getItem("project_list"));
    document.getElementById("name_project").innerHTML=global_project_list[projectId-1].titre;

    fetch("https://timelapse.kerboul.me/api/smile")
  .then(response => response.blob())
  .then(blob => {
    const url = URL.createObjectURL(blob);
    const imageElement = document.getElementById("my-image");
    imageElement.src = url;
  });
});