UI improvements

Team334 · Feb 27, 2025 · 03de96f · 03de96f
1 parent f476e93
commit 03de96f
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 2 deletions.
diff --git a/app/static/js/scout/add.js b/app/static/js/scout/add.js
@@ -255,6 +255,14 @@ document.addEventListener('DOMContentLoaded', function() {
         loadFile.click();
     });
 
+    // Reset view button
+    document.getElementById('goHome').addEventListener('click', (e) => {
+        e.preventDefault();
+        CanvasField.resetView();
+        CanvasField.redrawCanvas();
+        CanvasField.showStatus('View reset to origin');
+    });
+
     loadFile.addEventListener('change', (e) => {
         if (e.target.files.length === 0) return;
 

diff --git a/app/static/js/scout/edit.js b/app/static/js/scout/edit.js
@@ -299,6 +299,14 @@ document.addEventListener('DOMContentLoaded', function() {
         loadFile.click();
     });
 
+    // Reset view button
+    document.getElementById('goHome').addEventListener('click', (e) => {
+        e.preventDefault();
+        CanvasField.resetView();
+        CanvasField.redrawCanvas();
+        CanvasField.showStatus('View reset to origin');
+    });
+
     loadFile.addEventListener('change', (e) => {
         if (e.target.files.length === 0) return;
 

diff --git a/app/templates/scouting/add.html b/app/templates/scouting/add.html
@@ -313,7 +313,7 @@ <h3 class="text-lg font-semibold text-gray-900 mb-6">Auto Path</h3>
                     </div>
 
                     <!-- Controls -->
-                    <div class="controls space-y-4">
+                    <div class="controls space-y-4 flex flex-col items-center text-center">
                         <!-- Color and Thickness Controls -->
                         <div class="flex items-center space-x-4 rounded-xl">
                             <div class="color-picker-container">
@@ -398,6 +398,11 @@ <h3 class="text-lg font-semibold text-gray-900 mb-6">Auto Path</h3>
                                         <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
                                     </svg>
                                 </button>
+                                <button id="goHome" type="button" class="tool-btn bg-blue-50 text-blue-700 hover:bg-blue-100 border-blue-300 rounded-xl" title="Reset View">
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15" />
+                                    </svg>
+                                </button>
                                 <input type="file" id="loadFile" class="hidden" accept=".json">
                             </div>
                         </div>

diff --git a/app/templates/scouting/edit.html b/app/templates/scouting/edit.html
@@ -306,7 +306,7 @@ <h3 class="text-lg font-semibold text-gray-900 mb-6">Auto Path</h3>
                     </div>
 
                     <!-- Controls -->
-                    <div class="controls space-y-4">
+                    <div class="controls space-y-4 flex flex-col items-center text-center">
                         <!-- Color and Thickness Controls -->
                         <div class="flex items-center space-x-4 rounded-xl">
                             <div class="color-picker-container">
@@ -391,6 +391,11 @@ <h3 class="text-lg font-semibold text-gray-900 mb-6">Auto Path</h3>
                                         <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
                                     </svg>
                                 </button>
+                                <button id="goHome" type="button" class="tool-btn bg-blue-50 text-blue-700 hover:bg-blue-100 border-blue-300 rounded-xl" title="Reset View">
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15" />
+                                    </svg>
+                                </button>
                                 <input type="file" id="loadFile" class="hidden" accept=".json">
                             </div>
                         </div>