Preserve progress value when setting total value in progress bar

Changes:
- Preserve the progress value when setting the total in the progress bar.
    Previously, when setting the total value in the progress bar, the progress value was reset to 0.
    It could be a bit inconvenient, so this commit fixes it by preserving the progress value while setting the total.
    Reseting the progress value to 0 can be done in the context menu.
- Added a missing semicolon for consistency.

progressbar.js

@@ -1,11 +1,11 @@
 const totalKey = "total";
 const progressKey = "progress";
-const barColorKey = "barColor"
+const barColorKey = "barColor";
 
 document.addEventListener("DOMContentLoaded", function () {
     let total = parseInt(localStorage.getItem(totalKey)) || 1;
     let progress = parseInt(localStorage.getItem(progressKey)) || 0;
-    let barColor = localStorage.getItem(barColorKey) || "#4CAF50"
+    let barColor = localStorage.getItem(barColorKey) || "#4CAF50";
     const progressContainer = document.getElementById("progress-container");
     const progressBar = document.getElementById("progress-bar");
     const countDisplay = document.getElementById("count-display");
@@ -16,53 +16,51 @@ document.addEventListener("DOMContentLoaded", function () {
     const updateProgressBar = () => {
         const progressPercentage = (progress / total) * 100;
         progressBar.style.width = progressPercentage + "%";
-    }
+    };
 
     const updateCountDisplay = () => {
         countDisplay.textContent = progress + " / " + total;
-    }
+    };
 
     const updateBarColor = () => progressBar.style.backgroundColor = barColor;
 
     const resetProgress = () => {
-        const userInput = totalInput.value.trim();
-        const newTotal = parseInt(userInput);
+        updateProgressBar();
+        updateCountDisplay();
+    };
+
+    const setTotal = () => {
+        const newTotal = parseInt(totalInput.value.trim());
 
-        // Initialize only when user modified input value
         if (!isNaN(newTotal) && newTotal > 0 && newTotal !== total) {
             total = newTotal;
             localStorage.setItem(totalKey, total);
-            progress = 0;
-            localStorage.setItem(progressKey, progress);
             totalInput.value = total;
-            updateProgressBar();
-            updateCountDisplay();
+            resetProgress();
         }
-    }
+    };
 
     const resetBarColor = () => {
         barColor = barColorPicker.value = "#4CAF50";
         localStorage.setItem(barColorKey, barColor);
         updateBarColor();
-    }
+    };
 
     const decreaseProgress = () => {
         if (progress > 0) {
             progress--;
             localStorage.setItem(progressKey, progress);
-            updateProgressBar();
-            updateCountDisplay();
+            resetProgress();
         }
-    }
+    };
 
     const increaseProgress = () => {
         if (progress < total) {
             progress++;
             localStorage.setItem(progressKey, progress);
-            updateProgressBar();
-            updateCountDisplay();
+            resetProgress();
         }
-    }
+    };
 
     const handleClick = (event) => {
         const clickPosition = event.clientX - progressContainer.offsetLeft;
@@ -79,41 +77,39 @@ document.addEventListener("DOMContentLoaded", function () {
             totalInput.style.display = "block";
             totalInput.focus();
         }
-    }
+    };
 
     const handleRightClick = (event) => {
         event.preventDefault(); // prevent default right click menu
         contextMenu.style.display = "block";
         contextMenu.style.left = event.pageX + "px";
         contextMenu.style.top = event.pageY + "px";
-    }
+    };
 
     const handlBarColor = () => {
         barColor = barColorPicker.value;
         localStorage.setItem(barColorKey, barColor);
         updateBarColor();
-    }
+    };
 
     // Attach event listeners
     progressContainer.addEventListener("click", handleClick);
     progressContainer.addEventListener("contextmenu", handleRightClick);
     document.addEventListener("click", (event) => contextMenu.style.display = "none");
     totalInput.addEventListener("blur", function () {
-        resetProgress();
+        setTotal();
         this.style.display = "none";
     });
     document.getElementById("reset-progress").addEventListener("click", () => {
         progress = 0;
         localStorage.setItem(progressKey, progress);
-        updateProgressBar();
-        updateCountDisplay();
-    })
+        resetProgress();
+    });
     barColorPicker.addEventListener("change", handlBarColor);
-    document.getElementById("bar-color-reset-btn").addEventListener("click", resetBarColor)
+    document.getElementById("bar-color-reset-btn").addEventListener("click", resetBarColor);
 
     // Initialize display
-    updateProgressBar();
-    updateCountDisplay();
+    resetProgress();
     updateBarColor();
     barColorPicker.value = barColor;
 });