Left Right buttons

aceberg · Dec 24, 2023 · 258758a · 258758a
1 parent 4f1b00d
commit 258758a
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 46 deletions.
diff --git a/README.md b/README.md
@@ -15,7 +15,7 @@ Light and easy workout diary
 - [Thanks](https://github.com/aceberg/exercisediary#thanks)
 
 
-![Screenshot](https://raw.githubusercontent.com/aceberg/exercisediary/main/assets/Screenshot%202023-04-02%20at%2022-27-40%20Resource%20Diary.png)
+![Screenshot](https://raw.githubusercontent.com/aceberg/ExerciseDiary/main/assets/Screenshot%202023-12-23%20at%2022-32-42%20Exercise%20Diary.png)
 
 ## Quick start
 
@@ -26,7 +26,7 @@ docker run --name exercisediary \
 -p 8851:8851 \
 aceberg/exercisediary
 ```
-<!-- Or use [docker-compose.yml](docker-compose.yml) -->
+Or use [docker-compose.yml](docker-compose.yml)
 
 
 ## Config

diff --git a/internal/web/config.go b/internal/web/config.go
@@ -37,12 +37,3 @@ func saveConfigHandler(c *gin.Context) {
 
 	c.Redirect(http.StatusFound, "/config")
 }
-
-// func clearHandler(w http.ResponseWriter, r *http.Request) {
-
-// 	log.Println("INFO: delting all hosts from DB")
-
-// 	db.Clear(appConfig.DbPath)
-
-// 	http.Redirect(w, r, r.Header.Get("Referer"), 302)
-// }
diff --git a/internal/web/const-var.go b/internal/web/const-var.go
@@ -10,7 +10,7 @@ var (
 	// appConfig - config for Web Gui
 	appConfig models.Conf
 
-	//
+	// Exercise data
 	exData models.AllExData
 )
 

diff --git a/internal/web/public/js/heatmap.js b/internal/web/public/js/heatmap.js
@@ -11,11 +11,11 @@ function lowerData(heat) {
             v: val.V
         });
     }
-    console.log('LDATA =', ldata);
+    // console.log('LDATA =', ldata);
     return ldata;
 };
 
-function makeChart(heat, hcolor) {
+function makeChart(heat, hcolor, sets) {
     let ldata = lowerData(heat);
     var ctx = document.getElementById('matrix-chart').getContext('2d');
     window.myMatrix = new Chart(ctx, {
@@ -49,8 +49,9 @@ function makeChart(heat, hcolor) {
             onClick: (e) => {
                 const res = window.myMatrix.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true);
                 let clickDate = res[0].element.$context.raw.d;
-                console.log('CLICK DATE =', clickDate);
-                document.getElementById("formDate").value = clickDate;
+                // console.log('CLICK DATE =', clickDate);
+
+                setFormContent(sets, clickDate); // index.js
             },
             plugins: {
                 legend: false,

diff --git a/internal/web/public/js/index.js b/internal/web/public/js/index.js
@@ -10,40 +10,50 @@ function addExercise(name, weight, reps) {
     document.getElementById('todayEx').insertAdjacentHTML('beforeend', html_to_insert);
 };
 
-function setToday() {
+function setFormContent(sets, date) {
+    window.sessionStorage.setItem("today", date);
+    document.getElementById('todayEx').innerHTML = "";
+    document.getElementById("formDate").value = date;
+    document.getElementById("realDate").value = date;
+
+    let len = sets.length;
+    for (let i = 0 ; i < len; i++) {
+        if (sets[i].Date == date) {
+            addExercise(sets[i].Name, sets[i].Weight, sets[i].Reps);
+        }
+    }
+};
+
+function setFormDate(sets) {
+    today = document.getElementById("realDate").value;
     if (!today) {
         today = window.sessionStorage.getItem("today");
-        // console.log('TODAY FROM STOR =', today);
-        if (today === null) {
+
+        if (!today) {
             today = new Date().toJSON().slice(0, 10);
-            window.sessionStorage.setItem("today", today);
         }
-        document.getElementById("formDate").value = today;
     }
 
-    // console.log('TODAY =', today);
+    setFormContent(sets, today);
 };
 
-function setFormDateSets(sets) {
-    today = document.getElementById("formDate").value;
-    setToday();
-    window.sessionStorage.setItem("today", today);
+function delExercise(exID) {
 
-    // console.log('DAY =', today);
-    // console.log('SETS =', sets);
+    document.getElementById(exID).remove();
+};
 
-    document.getElementById('todayEx').innerHTML = "";
+function moveDayLeftRight(where, sets) {
+    dateStr = document.getElementById("realDate").value;
 
-    let len = sets.length;
-    for (let i = 0 ; i < len; i++) {
-        if (sets[i].Date == today) {
-            addExercise(sets[i].Name, sets[i].Weight, sets[i].Reps);
-        }
-    }
-};
+    let year  = dateStr.substring(0,4);
+    let month = dateStr.substring(5,7);
+    let day   = dateStr.substring(8,10);
+    var date  = new Date(year, month-1, day);
 
-function delExercise(exID) {
-    // console.log('DEL ID =', exID);
+    date.setDate(date.getDate() + parseInt(where));
+    let left = date.toLocaleDateString('en-CA');
 
-    document.getElementById(exID).remove();
+    // console.log('LEFT =', left);
+
+    setFormContent(sets, left);
 };
diff --git a/internal/web/templates/config.html b/internal/web/templates/config.html
@@ -53,6 +53,8 @@
             <div class="card border-primary">
                 <div class="card-header">About</div>
             <div class="card-body">
+                <a href="https://github.com/aceberg/ExerciseDiary">Github</a>
+                <p>If you consider this app helpful, please donate</p>
             </div>
             </div>
         </div>

diff --git a/internal/web/templates/header.html b/internal/web/templates/header.html
@@ -39,7 +39,7 @@
                     <li><a class="dropdown-item" href="/config/">Config</a></li>
                     <li><hr class="dropdown-divider"></li>
                     <li><a class="dropdown-item" href="/exercise/?id=new">Add Exercise</a></li>
-                    <li><a class="dropdown-item" href="/stats/">Stats</a></li>
+                    <!-- <li><a class="dropdown-item" href="/stats/">Stats</a></li> -->
                     <li><hr class="dropdown-divider"></li>
                     <li><a class="dropdown-item" target="_blank" href="https://github.com/aceberg/ExerciseDiary">About</a></li>
                 </ul>

diff --git a/internal/web/templates/index.html b/internal/web/templates/index.html
@@ -46,7 +46,7 @@ <h2 class="accordion-header">
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-        <h5 class="modal-title">Exercise details</h5>
+        <h5 class="modal-title">{{ .Name }}</h5>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
           <span aria-hidden="true"></span>
         </button>
@@ -58,7 +58,7 @@ <h5 class="modal-title">Exercise details</h5>
           <p>Reps (default): {{ .Reps }}</p>
         </div>
         <div class="col">
-          <img src="{{ .Image }}" style="max-width: 100%;max-height: 100%;"></img>
+          <img src="{{ .Image }}" style="max-width: 100%;max-height: 100%;" alt="Exercise Image"></img>
         </div>
       </div>
     </div>
@@ -81,8 +81,13 @@ <h5 class="modal-title">Exercise details</h5>
             <div class="card border-primary">
                 <!-- <div class="card-header">Today</div> -->
                 <div class="card-body">
-                  <form action="/set/" method="post" name="sets">
-                    <input name="date" type="date" class="m-auto form-control" onchange='setFormDateSets({{ .ExData.Sets }})' id="formDate" style="width: 40%;">
+                  <div class="gap-3 hstack">
+                    <button onclick='moveDayLeftRight(-1, {{ .ExData.Sets }})' class="btn del-set-button"><i class="bi bi-arrow-left-square"></i></button>
+                    <input type="date" class="m-auto form-control" onchange='setFormDate({{ .ExData.Sets }})' id="realDate" style="width: 40%;">
+                    <button onclick='moveDayLeftRight(+1, {{ .ExData.Sets }})' class="btn del-set-button"><i class="bi bi-arrow-right-square"></i></button>
+                  </div>
+                <form action="/set/" method="post" name="sets">
+                  <input name="date" type="hidden" id="formDate">
                   <table class="table table-borderless">
                     <thead>
                         <th style="width: 60%;">Name</th>
@@ -101,8 +106,8 @@ <h5 class="modal-title">Exercise details</h5>
 </div>
 
 <script>
-  setFormDateSets({{ .ExData.Sets }});
-  makeChart({{ .HeatMap }}, {{ .Config.HeatColor }});
+  setFormDate({{ .ExData.Sets }});
+  makeChart({{ .HeatMap }}, {{ .Config.HeatColor }}, {{ .ExData.Sets }});
 </script>
 {{ template "footer.html" }}
 {{ end }}