From 567772177eba640db59e9845394af750928ba4b6 Mon Sep 17 00:00:00 2001
From: Aaron Ge <aaronge13@icloud.com>
Date: Wed, 28 Feb 2024 09:50:31 -0500
Subject: [PATCH] Added functionality to use template button

---
 app.js     | 55 +++++++++++++++++++++++++++++-------------------------
 index.html |  9 ++++-----
 main2.js   |  1 -
 3 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/app.js b/app.js
index bd94299..acfe2fe 100644
--- a/app.js
+++ b/app.js
@@ -48,38 +48,43 @@ advancedSettingsCheckbox.addEventListener("change", function () {
   }
 });
 
-// Handling the '.btn-proceed' buttons to navigate through steps
-document.querySelectorAll(".btn-proceed").forEach((button) => {
-  button.addEventListener("click", function () {
+function nextSection() {
 
-    if (!window.loadedImg) {
+  if (!window.loadedImg) {
 
-      // If no image is loaded, show an error message
-      const imageLoadStatus = document.getElementById("imageLoadStatus");
-      imageLoadStatus.classList = "load-status error-message";
-      imageLoadStatus.textContent = "No image loaded";
-      return;
-    }
+    // If no image is loaded, show an error message
+    const imageLoadStatus = document.getElementById("imageLoadStatus");
+    imageLoadStatus.classList = "load-status error-message";
+    imageLoadStatus.textContent = "No image loaded";
+    return;
+  }
 
 
-    // Move to the next step
-    let nextStep = currentStep + 1;
+  // Move to the next step
+  let nextStep = currentStep + 1;
 
-    const sections = [
-      uploadSection,
-      segmentationSection,
-      griddingSection,
-      virtualGridSection,
-    ];
-    const nextSection = sections[nextStep];
-    if (nextSection) {
-      currentStep = nextStep;
-      updateCurrentStep(nextStep + 1);
-      navigateToSection(sections[nextStep - 1], nextSection);
-    }
-  });
+  const sections = [
+    uploadSection,
+    segmentationSection,
+    griddingSection,
+    virtualGridSection,
+  ];
+  const nextSection = sections[nextStep];
+  if (nextSection) {
+    currentStep = nextStep;
+    updateCurrentStep(nextStep + 1);
+    navigateToSection(sections[nextStep - 1], nextSection);
+  }
+}
+
+// Handling the '.btn-proceed' buttons to navigate through steps
+document.querySelectorAll(".btn-proceed").forEach((button) => {
+  button.addEventListener("click", nextSection);
 });
 
+document.getElementById("useTemplate").addEventListener("click", nextSection);
+
+
 // Handling the '.btn-proceed' buttons to navigate through steps
 document.querySelectorAll(".btn-back").forEach((button) => {
   button.addEventListener("click", function () {
diff --git a/index.html b/index.html
index c2daee7..fdc9854 100644
--- a/index.html
+++ b/index.html
@@ -164,12 +164,11 @@ <h2 class="text-xl font-semibold">Uploading an Image</h2>
                     <div class="mt-6 width-90-middle">
                         <label class="block text-sm font-semibold text-gray-700">Optional Metadata File:</label>
                         <div class="file-upload-wrapper">
-                            <input type="file" id="metadataFile" class="file-input" accept=".csv,.json,.xlsx, .xls"
-                                onchange="displayFileInfo(this)">
-                            <label class="file-upload-button" for="metadataFile">Choose files to upload</label>
-                            <button class="skip-button" for="metadataFile">Use Template Metadata</label>
+                            <input type="file" id="metadataFile" class="file-input" accept=".csv,.json,.xlsx, .xls" onchange="displayFileInfo(this)">
+                            <label for="metadataFile" class="file-upload-button">Choose files</label>
+                            <button class="skip-button" id="useTemplate" onclick="">Use Template</button>
                         </div>
-
+                        
                         <div id="metadata-file-info" class="hidden width-90-middle"
                             style="width: 100%; margin-top: 20px;">
                             <img src="./icons/image-file-icon.svg" alt="File icon" id="file-icon" class="file-icon">
diff --git a/main2.js b/main2.js
index 2b37898..21d3e7d 100644
--- a/main2.js
+++ b/main2.js
@@ -955,7 +955,6 @@ function bindEventListeners() {
 // Initialize and bind events
 const initSegmentation = async () => {
 
-  debugger;
   const state = await loadDependencies();
   window.state = state;