changed date format in frontend, added name for location requested data

src/modules/class_api.py

@@ -133,6 +133,11 @@ def isvalidRequest(self, data:dict) -> (dict|str):
                         return f'Invalid location value: {value}'
                     result_data['location'] = value
 
+                case 'name':
+                    if(not isinstance(value, str)):
+                        return f'Invalid location name value: {value}'
+                    result_data['name'] = value
+
                 case 'source':
                     if(not isinstance(value, str)):
                         return f'Invalid source value: {value}'
@@ -168,6 +173,7 @@ def createJSON(self, userKey, fireData, **kwargs):
                     "source":kwargs.get('source'),
                     "delimiter":kwargs.get('delimiter'),
                     "location":kwargs.get('location'),
+                    "name":kwargs.get('name'),
                     "dayrange":kwargs.get('dayrange'),
                     "firedata":fireData}
                     ]

src/static/js/main.js

@@ -3,7 +3,7 @@ import { CSS2DRenderer, CSS2DObject } from 'three/addons/renderers/CSS2DRenderer
 import { setOption, requestedData, allowRequest, putData, getData, exportData } from './scripts/requests/functions.js';
 import { processFireData, displayFireData, coordToCartesian } from './scripts/fires/functions.js';
 import { setCheckbox, setNewDate, resetDefault, filteredOptions, setMultipleDates } from './scripts/UX/filter.js';
-import { setInspectData } from './scripts/UX/inspect.js'
+// import { setInspectData } from './scripts/UX/plotly_functions.js'
 import { userInterface } from './scripts/UX/user.js'
 import { notificationHandler } from './scripts/UX/notifications.js'
 import { moveToPoint } from './scripts/UX/globe.js'
@@ -145,7 +145,7 @@ async function main(){
                 meshPointers = processFireData(user_key, user_data, earth_radius);
                 addObject(scene, meshPointers);
                 setNewDate(selectedOptions['date'], 'availableDate', 'filterDate');
-                // setInspectData(user_key, user_data, 'summary-section', 'table-section');
+                // here goes the calculation of kpi's
                 markerElement.ariaHidden = "true";
                 markerInformation.ariaHidden = "true";
                 const coordinatesArr = selectedOptions['coordinates'].split(" ");
@@ -179,6 +179,10 @@ async function main(){
     layersApply.addEventListener("click", _ =>{
         textureVisible(texturesProperties, earth, stars);
     });
+    const datitos = document.getElementById("contenidoDatos");
+    datitos.addEventListener("click", () =>{
+        console.log(user_data)
+    })
 
     //Download file data
     const getFiles = document.getElementsByClassName('file-request');
@@ -189,7 +193,6 @@ async function main(){
         });
     }
 
-
     // Intersect point with raycast
     let pointer = new THREE.Vector2();
     let raycaster = new THREE.Raycaster();

src/static/js/scripts/fires/functions.js

@@ -171,7 +171,6 @@ function displayFireData(dataObject, identifier, markerElement, markerInformatio
                 const attrLink = attrObject.link;
                 const attrName = attrObject.name;
                 if(attrLink != null){
-                    // const satelliteRef = `<a target="_blank" href="${attrLink}" class="link-url d-flex centered" style="display: inherit;gap: 0.5em; align-items: center;">Spot attributes ${questionSVG}</a>`;
                     attributesLink = attrLink;
                 }
                 if(attrName != null){
@@ -184,6 +183,9 @@ function displayFireData(dataObject, identifier, markerElement, markerInformatio
             else if(key == "frp"){
                 htmlElm.innerHTML = `${value} MW`;
             }
+            else if(key == "acq_date"){
+                htmlElm.innerHTML = value.split("-").toReversed().join("-");
+            }
             else{
                 htmlElm.innerHTML = value;
             }

src/static/js/scripts/requests/functions.js

@@ -33,12 +33,14 @@ const setOption = (optKey, optValue) => {
             if('area' in currOpt){
                 newOpt.value = currOpt['area'];
                 newOpt.text = currOpt['name'];
-                newOpt.setAttribute("data-coordinates", currOpt['coordinates'])
+                newOpt.setAttribute("data-coordinates", currOpt['coordinates']);
+                newOpt.setAttribute("data-name", currOpt['name']);
             }
             else if('country' in currOpt){
                 newOpt.value = currOpt['country'];
                 newOpt.text = currOpt['name'];
-                newOpt.setAttribute("data-coordinates", currOpt['coordinates'])
+                newOpt.setAttribute("data-coordinates", currOpt['coordinates']);
+                newOpt.setAttribute("data-name", currOpt['name']);
             }
             else if('delimiter' in currOpt){
                 newOpt.value = currOpt['delimiter'];
@@ -69,6 +71,7 @@ const requestedData = (selectors) => {
             if(property === "location"){
                 const options = selection.options[selection.selectedIndex];
                 result['coordinates'] = options.dataset.coordinates;
+                result['name'] = options.dataset.name;
             }
         }
     }

src/templates/index.html

@@ -204,11 +204,10 @@ <h2 class="main-title">Draw</h2>
               </button>
             </div>
             <div class="area-window-content">
-              contenido
+              <button id="contenidoDatos">Contenido</button>
             </div>
           </div>
         </div>
-
         <div class="container container-right d-grid" id="markerInformation" aria-hidden="true" data-content = "Marker-Information">
           <div class="header-2 area-window-header d-flex" style="justify-content: space-between; height: 2.5em;">
             <span class="area-window-header-title">SPOT ATTRIBUTES</span>
@@ -261,7 +260,7 @@ <h2 class="main-title">Draw</h2>
               </div>
               <div class="window-item item-2">
                 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-calendar-event window-item-icon selector box-shad-strong" viewBox="0 0 17 17"
-                data-title-2="Date (yyyy-mm-dd format), time (UTC format) and period (day/night) acquisition.">
+                data-title-2="Date (dd-mm-yyyy format), time (UTC format) and period (day/night) acquisition.">
                   <path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5z"></path>
                   <path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z"></path>
                 </svg>