Completata gestione del peso

MarioTurco · Sep 1, 2020 · 2ad6bee · 2ad6bee
1 parent f7444c2
commit 2ad6bee
Show file tree

Hide file tree

Showing 5 changed files with 145 additions and 17 deletions.
diff --git a/src/edit.html b/src/edit.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="it">
   <head>
     <meta charset="UTF-8">
     <title>Gym Utils</title>
@@ -23,7 +23,9 @@
         </ul>
       </div>
 
-      Edit
+      <div class="has-text-centered">
+        <p>Seleziona una riga e compila i campi per modificarlo</p>
+      </div>
       <div class="table-container " >
         <table class="table is-bordered is-striped is-narrow is-hoverable is-fullwidth" id="visualizeTable">
           <thread >
@@ -34,10 +36,38 @@
           </tbody>
         </table>
       </div>
-
-      <canvas id="chart" ></canvas>
-
-      </canva>
+      <div class="field is-horizontal">
+        <div class="field-label is-normal">
+          <label class="label">Data</label>
+        </div>
+        <div class="field-body">
+          <div class="field">
+            <p class="control">
+              <input class="input" type="date" placeholder="Data" id="dataText">
+            </p>
+          </div>
+        </div>
+      </div>
+      <div class="field is-horizontal">
+        <div class="field-label is-normal">
+          <label class="label">Peso</label>
+        </div>
+        <div class="field-body">
+          <div class="field">
+            <p class="control">
+              <input class="input" type="text" placeholder="Peso" id="pesoText">
+            </p>
+          </div>
+        </div>
+      </div>
+      <div class="has-text-centered">
+        <button class="button is-warning is-outlined" id="editRowBtn">
+          <span>Conferma</span>
+          <span class="icon is-small">
+          <i class="fas fa-times"></i>
+          </span>
+        </button>
+      </div>
     </div>
   </body>
 </html>
diff --git a/src/edit.js b/src/edit.js
@@ -2,13 +2,23 @@ const db = require('electron-db');
 const { app, BrowserWindow } = require('electron');
 const { ipcRenderer } = require('electron')
 
-
+//Buttons
+const editRowBtn = document.getElementById("editRowBtn");
 //Tabs
 const visualizeTab = document.getElementById('visualizeTab');
 const settingsTab = document.getElementById('settingsTab')
 const addTab = document.getElementById('addTab');
 const deleteTab = document.getElementById('deleteTab');
 
+//Table
+const table = document.getElementById('visualizeTable');
+
+//Fields
+const pesoText = document.getElementById('pesoText');
+const dataText = document.getElementById('dataText');
+
+var lastSelectedRow = null;
+
 //Tabs listeners
 visualizeTab.onclick = () =>{
     ipcRenderer.sendSync('synchronous-message', 'visualize');
@@ -22,4 +32,87 @@ addTab.onclick = () =>{
 }
 deleteTab.onclick = () =>{
     ipcRenderer.sendSync('synchronous-message', 'delete');
-}
+}
+function dataError(){
+    document.getElementById("dataText").classList.add('is-danger');
+}
+function pesoError(){
+    document.getElementById("pesoText").classList.add('is-danger');
+}
+//Button Listener
+editRowBtn.onclick = () =>{
+    deselectEffect(lastSelectedRow);
+    var oldData = lastSelectedRow.getElementsByTagName('td')[0].textContent;
+    var newPeso = pesoText.value;
+    var newData = dataText.value;
+    console.log("old data" , oldData);
+    console.log("new data" , newData);
+    console.log("new peso", newPeso);
+    if(newPeso.length == 0 || newData.length != 10){
+        if(newPeso.length == 0)
+            pesoError();
+        if(newData.length != 10)
+            dataError();
+        return;
+    }
+    let where = {
+        "data" : oldData
+    };
+    let set = {
+        "data" : newData,
+        "peso" : newPeso
+    };
+    db.updateRow('peso', where, set, (succ, msg) => {
+        // succ - boolean, tells if the call is successful
+        console.log("Success: " + succ);
+        console.log("Message: " + msg);
+      });
+
+    location.reload();
+
+}
+function selectEffect(row){
+    if(row != null)
+        row.classList.add('is-selected');
+}
+function deselectEffect(row){
+    if(row != null)
+        if ( row.classList.contains('is-selected') )
+            row.classList.remove('is-selected');
+
+}
+function fillTable(){
+    db.getAll('peso',(succ, data) => {
+        console.log(data);
+        let index = 1;
+        //create row
+        for(elems in data){
+            var row = table.insertRow(index);
+            var dataCell = row.insertCell(0);
+            var pesoCell = row.insertCell(1);
+            dataCell.innerHTML =  data[elems].data;
+            pesoCell.innerHTML = data[elems].peso;
+            index+=1;
+        }
+        return data;
+      })
+}
+function addRowsListeners(){
+    var rows = table.getElementsByTagName("tr");
+    for(i=0; i<rows.length;i++){
+        var currentRow = table.rows[i];
+        var createClickListener = function(row){
+            return function(){
+                deselectEffect(lastSelectedRow);
+                selectEffect(row);
+                lastSelectedRow = row;
+                pesoText.value = lastSelectedRow.getElementsByTagName('td')[1].textContent;
+                dataText.value = lastSelectedRow.getElementsByTagName('td')[0].textContent;
+                console.log(tmp);
+            }
+            }
+            currentRow.onclick = createClickListener(currentRow);
+    }
+}
+fillTable();
+addRowsListeners();
diff --git a/src/index.html b/src/index.html
@@ -19,13 +19,17 @@
           <li id="settingsTab"><a>Impostazioni</a></li>
         </ul>
       </div>
-      <div class="field">
-        <label class="label has-text-left">Peso</label>
-        <input class="input" id="pesoText" type="number" placeholder="75">
+      <div class="field is-horizontal">
+      <div class="field-label is-normal">
+        <label class="label">Peso</label>
+      </div>
+      <input class="input" id="pesoText" type="number" placeholder="75">
       </div>
 
-      <div class="field">
-        <label class="label has-text-left">Data</label>
+      <div class="field is-horizontal">
+        <div class="field-label is-normal">
+          <label class="label ">Data</label>
+        </div>
         <input class="input" id="dataText" type="date" placeholder="gg/mm/aaaa">
       </div>
         <div class="field is-centered">

diff --git a/src/logic.js b/src/logic.js
@@ -53,9 +53,7 @@ function pesoError(){
 
 addBtn.onclick = () => {
     let record = new Object();
-    tmp = document.getElementById('dataText').value;
-
-    record.data = tmp.substring(8,11) + '-' + tmp.substring(5,7) + '-' + tmp.substring(0,4);
+    record.data = document.getElementById('dataText').value;
     console.log("Data:" , record.data);
     record.peso = document.getElementById('pesoText').value;
     if(record.data == '' || record.peso == ''){

diff --git a/src/visualizeLogic.js b/src/visualizeLogic.js
@@ -33,6 +33,9 @@ var ctx = document.getElementById('chart').getContext('2d');
 function sortDataByDate(data){
     return( data.sort((a,b) => a.data < b.data ? -1 : 1));
 }
+function revereSortDataByDate(data){
+    return( data.sort((a,b) => a.data < b.data ? 1 : -1));
+}
 function createChart(data){
     sortDataByDate(data);
     let peso = []
@@ -41,7 +44,6 @@ function createChart(data){
         peso.push(data[elems].peso);
         date.push(data[elems].data);
     }
-    console.log(data);
     var chart = new Chart(ctx, {
         // The type of chart we want to create
         type: 'line',
@@ -66,6 +68,7 @@ function fillTable(){
     db.getAll('peso',(succ, data) => {
         console.log(data);
         createChart(data);
+        revereSortDataByDate(data);
         let index = 1;
         for(elems in data){
             var row = table.insertRow(index);