From 3b694ff75110fcf7f63564115848d56a23eef86d Mon Sep 17 00:00:00 2001
From: arussac <antoninrussac1@gmail.com>
Date: Tue, 11 Feb 2025 11:23:33 +0100
Subject: [PATCH] anto

---
 js/projet_detail.js      | 58 ++++++++++++++++++++++------------------
 js/utilities/populate.js | 26 +++++++++---------
 js/utilities/routes.js   |  2 +-
 3 files changed, 47 insertions(+), 39 deletions(-)

diff --git a/js/projet_detail.js b/js/projet_detail.js
index 3d1f079..4e06a2d 100644
--- a/js/projet_detail.js
+++ b/js/projet_detail.js
@@ -6,7 +6,6 @@ document.addEventListener("DOMContentLoaded", async () => {
   const DataMetrics = await getDataMetrics(projectId);
 
   document.getElementById("name_project").innerHTML = data[projectId].name;
-
   const videoSelector = document.getElementById("video_selector");
   const numberPicker = document.getElementById('number-picker');
   const resultContainer = document.getElementById('result-container');
@@ -16,7 +15,6 @@ document.addEventListener("DOMContentLoaded", async () => {
   const addNumberButton = document.getElementById('add-number-button');
   const formContainer = document.getElementById('form-container');
   const durationInput = document.getElementById('duration');
-  const tableBody = document.getElementById("imageSource");
   const tableImage = document.getElementById("content1");
   const numberBoard = document.getElementById('number-board');
 
@@ -142,25 +140,6 @@ document.addEventListener("DOMContentLoaded", async () => {
     }
   }
 
-  function populateImageTable(DataMetrics) {
-    let row = document.createElement("tr");
-    let i = 0;
-    DataMetrics.forEach((measure) => {
-      let imageTD = document.createElement("td");
-      imageTD.innerHTML = `<img id="${i}" src="${measure.image_path}" />`;
-      row.appendChild(imageTD);
-
-      if ((i + 1) % 3 === 0 && i !== 0) {
-        tableBody.appendChild(row);
-        row = document.createElement("tr");
-      }
-      if (row.childNodes.length > 0) {
-        tableBody.appendChild(row);
-      }
-      i++;
-    });
-  }
-
   function populateNumberBoard(length) {
     numberBoard.innerHTML = '';
     for (let i = 1; i <= length; i++) {
@@ -171,12 +150,34 @@ document.addEventListener("DOMContentLoaded", async () => {
       numberBoard.appendChild(numberButton);
     }
   }
-
   function highlightNumber(button) {
     button.classList.toggle('highlight');
   }
 });
 
+function populateImageTable(DataMetrics) {
+  const tableBody = document.getElementById("imageSource");
+  while (tableBody.rows.length > 0) {
+    tableBody.deleteRow(0);
+}
+  let row = document.createElement("tr");
+  let i = 0;
+  DataMetrics.forEach((measure) => {
+    let imageTD = document.createElement("td");
+    imageTD.innerHTML = `<img id="${i}" src="${api_url}/image/${measure.image_path}"/>`;
+    row.appendChild(imageTD);
+
+    if ((i + 1) % 3 === 0 && i !== 0) {
+      tableBody.appendChild(row);
+      row = document.createElement("tr");
+    }
+    if (row.childNodes.length > 0) {
+      tableBody.appendChild(row);
+    }
+    i++;
+  });
+}
+
 async function generateViewMetric(projectId) {
   const ctx = document.getElementById("metric_viewer").getContext("2d");
   let Hygrometrie = [];
@@ -196,17 +197,22 @@ async function generateViewMetric(projectId) {
   });
 
   const videoId = document.getElementById("video_selector").value;
-
   measurements = await getDataMetrics(projectId);
-  currentVideoDatas = await getDataVideoFromApi(videoId);
-
-  let samples = convertStringToArray(currentVideoDatas[0]["measurement_ids"]);
+  let samples;
+  if(videoId!=-1){
+    currentVideoDatas = await getDataVideoFromApi(videoId);
+    samples = convertStringToArray(currentVideoDatas[0]["measurement_ids"]);
+  } else {
+    samples=measurements.map(measurements => measurements.id);
+  }
+  
   tempoMeasure = filterAndSortMeasurementsByIds(measurements, samples);
   tempoMeasure.forEach((measure) => {
     datesMeasurement.push(measure.timestamp);
     Temperature.push(measure.temperature);
     Hygrometrie.push(measure.humidity);
   });
+  populateImageTable(tempoMeasure)
 
   if (myChart) {
     myChart.destroy();
diff --git a/js/utilities/populate.js b/js/utilities/populate.js
index 3baebf2..fbd8541 100644
--- a/js/utilities/populate.js
+++ b/js/utilities/populate.js
@@ -1,14 +1,16 @@
-async function PopulateSelect(mySelect,id){
-    let data=[]
-    if(mySelect.name=="videos" && id!=null){
-        data=await getDataProjectVideosFromApi(id);
-        for(let i = 0 ; i < data.length ; i++){
-            const selectObj=document.createElement("option")
-            selectObj.value=data[i].id
-            selectObj.innerHTML=data[i].name
-            mySelect.appendChild(selectObj)
-        }
+async function PopulateSelect(mySelect, id) {
+  let data = [];
+  if (mySelect.name == "videos" && id != null) {
+    data = await getDataProjectVideosFromApi(id);
+    const selectObjDefault = document.createElement("option");
+    selectObjDefault.value = -1;
+    selectObjDefault.innerHTML = "Default";
+    mySelect.appendChild(selectObjDefault);
+    for (let i = 0; i < data.length; i++) {
+      const selectObj = document.createElement("option");
+      selectObj.value = data[i].id;
+      selectObj.innerHTML = data[i].name;
+      mySelect.appendChild(selectObj);
     }
+  }
 }
-  
-  
\ No newline at end of file
diff --git a/js/utilities/routes.js b/js/utilities/routes.js
index 2a528d3..247fbdc 100644
--- a/js/utilities/routes.js
+++ b/js/utilities/routes.js
@@ -32,7 +32,7 @@ function getAllProject() {
 
 function getDataMetrics(projectId){
   return $.ajax({
-    url: api_url.concat("/projects/"+projectId+"/measurements"),
+    url: api_url.concat(`/projects/${projectId}/measurements`),
     method: "GET",
     dataType: "json",
   }).then((data) => {