Empty chart fix

.version

@@ -0,0 +1 @@
+VERSION=0.1.0

CHANGELOG.md

@@ -2,6 +2,10 @@
 # Change Log
 All notable changes to this project will be documented in this file.
 
+## [0.1.1] - 2023-12-23
+### Added
+- Local JS and Themes
+- Weight chart
 
 ## [0.1.0] - 2023-12-23
 ### Added

Makefile

@@ -9,7 +9,7 @@ mod:
 
 run:
 	cd cmd/$(PKG_NAME)/ && \
-	go run . -n "http://192.168.2.3:8850"
+	go run .
 
 fmt:
 	go fmt ./...

README.md

@@ -12,6 +12,7 @@ Light and easy workout diary
 - [Quick start](https://github.com/aceberg/exercisediary#quick-start)
 - [Config](https://github.com/aceberg/exercisediary#config)
 - [Options](https://github.com/aceberg/exercisediary#options)
+- [Local network only](https://github.com/aceberg/exercisediary#local-network-only)
 - [Roadmap](https://github.com/aceberg/exercisediary#roadmap)
 - [Thanks](https://github.com/aceberg/exercisediary#thanks)
 
@@ -48,7 +49,24 @@ Configuration can be done through config file or environment variables
 
 | Key  | Description | Default | 
 | --------  | ----------- | ------- | 
-| -c | Path to config dir | /data/ExerciseDiary | 
+| -d | Path to config dir | /data/ExerciseDiary | 
+| -n | Path to local JS and Themes ([node-bootstrap](https://github.com/aceberg/my-dockerfiles/tree/main/node-bootstrap)) | "" | 
+
+## Local network only
+By default, this app pulls themes, icons and fonts from the internet. But, in some cases, it may be useful to have an independent from global network setup. I created a separate [image](https://github.com/aceberg/my-dockerfiles/tree/main/node-bootstrap) with all necessary modules and fonts.    
+```sh
+docker run --name node-bootstrap       \
+    -v ~/.dockerdata/icons:/app/icons  \ # For local images
+    -p 8850:8850                       \
+    aceberg/node-bootstrap
+```
+```sh
+docker run --name exdiary \
+    -v ~/.dockerdata/ExerciseDiary:/data/ExerciseDiary \
+    -p 8849:8849 \
+    aceberg/exercisediary -n "http://$YOUR_IP:8850"
+```
+Or use [docker-compose](docker-compose-local.yml)
 
 ## Roadmap
 - [x] HeatMap

docker-compose-local.yml

@@ -0,0 +1,25 @@
+version: "3"
+services:
+  node-bootstrap:
+    image: aceberg/node-bootstrap
+    restart: unless-stopped
+    ports:
+    - 8850:8850
+    volumes:
+    - ~/.dockerdata/icons:/app/icons  # For local icons
+  exdiary:
+    image: aceberg/exercisediary
+    restart: unless-stopped
+    ports:
+    - 8851:8851
+    command: "-n http://YOUR_IP:8850" # Put your server IP or DNS name here
+    depends_on:
+      - node-bootstrap
+    volumes:
+    - ~/.dockerdata/ExerciseDiary:/data/ExerciseDiary       # app data (set your own path instead of dockerdata)
+    environment:
+      TZ: Asia/Novosibirsk    # required for uptime monitor, default ""
+      HOST: "0.0.0.0"         # optional, default: 0.0.0.0
+      PORT: "8851"            # optional, default: 8851
+      THEME: "grass"          # optional, default: grass
+      COLOR: "light"          # optional, default: light

docker-compose.yml

@@ -1,8 +1,10 @@
 version: "3"
 services:
-  ExerciseDiary:
+  exdiary:
     image: aceberg/exercisediary
     restart: unless-stopped
+    ports:
+    - 8851:8851
     volumes:
     - ~/.dockerdata/ExerciseDiary:/data/ExerciseDiary
     environment:

internal/web/public/js/heatmap.js

@@ -50,7 +50,7 @@ function makeChart(heat, hcolor, sets) {
                 const res = window.myMatrix.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true);
                 let clickDate = res[0].element.$context.raw.d;
                 // console.log('CLICK DATE =', clickDate);
-
+                
                 setFormContent(sets, clickDate); // index.js
             },
             plugins: {

internal/web/public/js/index.js

@@ -16,10 +16,12 @@ function setFormContent(sets, date) {
     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);
+    if (sets) {
+        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);
+            }
         }
     }
 };
@@ -37,6 +39,11 @@ function setFormDate(sets) {
     setFormContent(sets, today);
 };
 
+function setWeightDate() {
+    let date = document.getElementById("realDate").value;
+    document.getElementById("weightDate").value = date;
+};
+
 function delExercise(exID) {
 
     document.getElementById(exID).remove();

internal/web/public/js/weight.js

@@ -16,6 +16,7 @@ function splitWeight(weight) {
 
 function weightChart(weight, wcolor) {
 
+  if (weight) {
     splitWeight(weight);
     // console.log('FDATA =', dates, ws);
 
@@ -49,5 +50,5 @@ function weightChart(weight, wcolor) {
         }
       }
     });
-
+  }
 };

internal/web/templates/index.html

@@ -21,7 +21,7 @@ <h5 class="modal-title">Add weight</h5>
           <table class="table table-borderless">
             <tr>
               <td>Date</td>
-              <td><input name="date" type="date" class="form-control"></td>
+              <td><input name="date" type="date" class="form-control" id="weightDate"></td>
             </tr>
             <tr>
               <td>Weight</td>
@@ -46,13 +46,13 @@ <h5 class="modal-title">Add weight</h5>
           <div class="card-body">
           <div class="hstack gap-2">
             <div class="chart-container m-auto">
-                <canvas id="matrix-chart" style="max-height: 100px; width: 820px;">
+                <canvas id="matrix-chart" style="max-height: 100px; width: 820px;"></canvas>
             </div>
             <div class="chart-container m-auto">
-                <canvas id="weight-chart" style="max-height: 100px;">
+                <canvas id="weight-chart" style="max-height: 100px;"></canvas>
             </div>
             <div class="m-auto">
-              <button class="btn del-set-button" title="Add weight" data-bs-toggle="modal" data-bs-target="#mWeight">
+              <button class="btn del-set-button" title="Add weight" data-bs-toggle="modal" data-bs-target="#mWeight" onclick='setWeightDate()'>
                 <h4><i class="bi bi-window-plus"></i></h4>
               </button>
             </div>
@@ -77,7 +77,7 @@ <h2 class="accordion-header">
                         {{ range $.ExData.Exs }}
                         {{ if eq .Group $gr }}
                         <div class="hstack gap-2">
-                            <a href="/exercise/?id={{ .ID }}"><button class="btn add-exercise-button" title="Edit">
+                            <a href="/exercise/?id={{ .ID }}"><button class="btn del-set-button" title="Edit">
                               <i class="bi bi-pencil-square"></i>
                             </button></a>
                             <!-- Button trigger modal -->
@@ -107,6 +107,7 @@ <h5 class="modal-title">{{ .Name }}</h5>
     </div>
   </div>
 </div>
+<!-- End Modal -->
                             <button class="btn exercise-button" onclick='addExercise("{{ .Name }}", "{{ .Weight }}", "{{ .Reps }}")' title="Weight: {{ .Weight }}; Reps: {{ .Reps }};">{{ .Name }}</button>
                             <button class="btn add-exercise-button" onclick='addExercise("{{ .Name }}", "{{ .Weight }}", "{{ .Reps }}")' title="Add">
                                 <i class="bi bi-arrow-right-square"></i>