Show Image

aceberg · Dec 18, 2023 · 6f251f7 · 6f251f7
1 parent 0afdd32
commit 6f251f7
Show file tree

Hide file tree

Showing 6 changed files with 49 additions and 16 deletions.
diff --git a/internal/web/exercise.go b/internal/web/exercise.go
@@ -1,7 +1,7 @@
 package web
 
 import (
-	"log"
+	// "log"
 	"net/http"
 	"strconv"
 
@@ -22,7 +22,7 @@ func exerciseHandler(c *gin.Context) {
 	guiData.GroupMap = createGroupMap()
 
 	idStr, ok := c.GetQuery("id")
-	log.Println("ID =", idStr)
+	// log.Println("ID =", idStr)
 
 	if ok && (idStr != "new") {
 		id, _ = strconv.Atoi(idStr)
@@ -46,6 +46,7 @@ func saveExerciseHandler(c *gin.Context) {
 	oneEx.Place = c.PostForm("place")
 	oneEx.Name = c.PostForm("name")
 	oneEx.Descr = c.PostForm("descr")
+	oneEx.Image = c.PostForm("image")
 
 	id := c.PostForm("id")
 	weight := c.PostForm("weight")
@@ -55,7 +56,7 @@ func saveExerciseHandler(c *gin.Context) {
 	oneEx.Weight, _ = strconv.Atoi(weight)
 	oneEx.Reps, _ = strconv.Atoi(reps)
 
-	log.Println("ONEEX =", oneEx)
+	// log.Println("ONEEX =", oneEx)
 
 	if oneEx.ID != 0 {
 		db.DeleteEx(appConfig.DBPath, oneEx.ID)

diff --git a/internal/web/public/css/index.css b/internal/web/public/css/index.css
@@ -9,7 +9,7 @@
 }
 
 .add-exercise-button {
-    width: 14%;
+    width: 9%;
     height: 100%;
     background-color: #00000000;
     color: var(--bs-primary);

diff --git a/internal/web/public/js/index.js b/internal/web/public/js/index.js
@@ -13,23 +13,23 @@ function addExercise(name, weight, reps) {
 function setToday() {
     if (!today) {
         today = window.sessionStorage.getItem("today");
-        console.log('TODAY FROM STOR =', today);
+        // console.log('TODAY FROM STOR =', today);
         if (today === null) {
             today = new Date().toJSON().slice(0, 10);
             window.sessionStorage.setItem("today", today);
         }
         document.getElementById("formDate").value = today;
     }
 
-    console.log('TODAY =', today);
+    // console.log('TODAY =', today);
 };
 
 function setFormDateSets(sets) {
     today = document.getElementById("formDate").value;
     setToday();
     window.sessionStorage.setItem("today", today);
 
-    console.log('DAY =', today);
+    // console.log('DAY =', today);
     // console.log('SETS =', sets);
 
     document.getElementById('todayEx').innerHTML = "";

diff --git a/internal/web/templates/config.html b/internal/web/templates/config.html
@@ -44,11 +44,10 @@
         </div>
         </div>
         <div class="col">
-            <div class="alert alert-info" role="alert">
-                <p>● After changing <b>Host</b> or <b>Port</b> you need to restart the app</p>
-                <p>● <b>Button Width</b> can be set in <b>px</b> or <b>em</b> to adjust buttons to theme. Example: 180px</p>
-                <p>● <b>On color</b> and <b>Off color</b> - online and offline host colors</p>
-                <p>● <b>Webpage refresh</b> - refresh interval for Tabs and Uptime (seconds). Default: 60. To disable refresh, put in this field something, that is not number (Example: off)</p>
+            <div class="card border-primary">
+                <div class="card-header">About</div>
+            <div class="card-body">
+            </div>
             </div>
         </div>
     </div>

diff --git a/internal/web/templates/exercise.html b/internal/web/templates/exercise.html
@@ -26,6 +26,10 @@
                     <td>Description</td>
                     <td><textarea name="descr" rows="3" class="form-control" value="{{ .OneEx.Descr }}"></textarea></td>
                 </tr>
+                <tr>
+                    <td>Image link</td>
+                    <td><input name="image" type="text" class="form-control" value="{{ .OneEx.Image }}"></td>
+                </tr>
                 <tr>
                     <td>Weight (default)</td>
                     <td><input name="weight" type="number" class="form-control" value="{{ .OneEx.Weight }}"></td>
@@ -51,7 +55,9 @@
         <div class="col">
             <div class="card border-primary">
                 <div class="card-header">Image</div>
-                <div class="card-body"></div>
+                <div class="card-body">
+                    <img src="{{ .OneEx.Image }}" style="max-width: 100%;max-height: 100%;"></img>
+                </div>
             </div>
         </div>
     </div>

diff --git a/internal/web/templates/index.html b/internal/web/templates/index.html
@@ -23,7 +23,34 @@ <h2 class="accordion-header">
                             <a href="/exercise/?id={{ .ID }}"><button class="btn add-exercise-button" title="Edit">
                               <i class="bi bi-pencil-square"></i>
                             </button></a>
-                            <button class="btn exercise-button" onclick='addExercise("{{ .Name }}", "{{ .Weight }}", "{{ .Reps }}")' title="Add">{{ .Name }}</button>
+                            <!-- Button trigger modal -->
+                            <button class="btn add-exercise-button" title="Show details" data-bs-toggle="modal" data-bs-target="#modal{{ .ID }}">
+                              <i class="bi bi-window-desktop"></i>
+                            </button>
+<!-- Modal -->
+<div class="modal" id="modal{{ .ID }}">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">Exercise details</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true"></span>
+        </button>
+      </div>
+      <div class="modal-body">
+        <div class="col">
+          <p>Description: {{ .Descr }}</p>
+          <p>Weight (default): {{ .Weight }}</p>
+          <p>Reps (default): {{ .Reps }}</p>
+        </div>
+        <div class="col">
+          <img src="{{ .Image }}" style="max-width: 100%;max-height: 100%;"></img>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+                            <button class="btn exercise-button" onclick='addExercise("{{ .Name }}", "{{ .Weight }}", "{{ .Reps }}")' title="Weight: {{ .Weight }}; Reps (default): {{ .Reps }};">{{ .Name }}</button>
                             <button class="btn add-exercise-button" onclick='addExercise("{{ .Name }}", "{{ .Weight }}", "{{ .Reps }}")' title="Add">
                                 <i class="bi bi-arrow-right-square"></i>
                             </button>
@@ -41,7 +68,7 @@ <h2 class="accordion-header">
                 <!-- <div class="card-header">Today</div> -->
                 <div class="card-body">
                   <form action="/set/" method="post" name="sets">
-                      <input name="date" type="date" class="form-control m-auto" onchange='setFormDateSets({{ .ExData.Sets }})' id="formDate" style="width: 50%;">
+                    <input name="date" type="date" class="m-auto form-control" onchange='setFormDateSets({{ .ExData.Sets }})' id="formDate" style="width: 40%;">
                   <table class="table table-borderless">
                     <thead>
                         <th style="width: 60%;">Name</th>
@@ -51,7 +78,7 @@ <h2 class="accordion-header">
                     </thead>
                     <tbody id="todayEx"></tbody>
                   </table>
-                  <button type="submit" class="btn btn-primary text-center">Save</button>
+                  <button type="submit" class="btn btn-primary">Save</button>
                 </form>
                 </div>
             </div>