Move File List Javascript to seperate file

static/build/list.js

@@ -0,0 +1,77 @@
+    // Function to convert Unix timestamps to local time
+    function convertUnixTimeToLocalTime(unixTime, element) {
+        const date = new Date(unixTime * 1000);
+        element.textContent = date.toLocaleString();
+    }
+
+    // Call the function for each timestamp on page load
+    window.onload = function () {
+        const creationTimeElements = document.querySelectorAll('.creation-time');
+        const lastEditedTimeElements = document.querySelectorAll('.last-edited-time');
+
+        creationTimeElements.forEach(element => {
+            const unixTime = parseInt(element.getAttribute('data-unix'));
+            convertUnixTimeToLocalTime(unixTime, element);
+        });
+
+        lastEditedTimeElements.forEach(element => {
+            const unixTime = parseInt(element.getAttribute('data-unix'));
+            convertUnixTimeToLocalTime(unixTime, element);
+        });
+    };
+
+    const deleteForm = document.getElementById("deleteForm");
+    const checkAllButton = document.getElementById("checkAll");
+    const checkboxes = document.querySelectorAll('input[type="checkbox"]');
+    checkAllButton.addEventListener("click", function () {
+        checkboxes.forEach(checkbox => {
+            checkbox.checked = true;
+        });
+    });
+
+    deleteForm.addEventListener("submit", function (event) {
+        event.preventDefault(); // Stop form submission
+
+        // Get all checkboxes in the delete form
+        const checkboxes = deleteForm.querySelectorAll('input[type="checkbox"]');
+        const filesToDelete = [];
+
+        // Get the filenames of the selected files
+        checkboxes.forEach(checkbox => {
+            if (checkbox.checked) {
+                filesToDelete.push(checkbox.value);
+            }
+        });
+
+        // Call the deleteFiles function to send the request to the server
+        deleteFiles(filesToDelete);
+    });
+    
+
+    function deleteFiles(filesToDelete) {
+        // Send a POST request to the server to delete the selected files
+        fetch("/delete", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ files: filesToDelete }),
+        })
+            .then(response => {
+                if (response.ok) {
+                    // Files deleted successfully
+                    location.reload(); // Refresh the page to reflect the changes
+                } else {
+                    // Handle the error, e.g., display an error message
+                    console.error("Error deleting files");
+                }
+            })
+            .catch(error => {
+                console.error("Error deleting files:", error);
+            });
+    }
+    // Handle exportFolder button click
+    const exportFolderButton = document.getElementById("exportFolder");
+    exportFolderButton.addEventListener("click", function () {
+        window.location.href = "/export";
+    });

templates/list.html

@@ -5,37 +5,14 @@
     <title>List Files</title>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
     <link rel="icon" href="/static/favicon.ico" type="image/x-icon">
-    <script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
-        // Function to convert Unix timestamps to local time
+    <script src="/static/build/list.js" type="text/javascript"></script>
-        function convertUnixTimeToLocalTime(unixTime, element) {
-            const date = new Date(unixTime * 1000);
-            element.textContent = date.toLocaleString();
-        }
-
-        // Call the function for each timestamp on page load
-        window.onload = function () {
-            const creationTimeElements = document.querySelectorAll('.creation-time');
-            const lastEditedTimeElements = document.querySelectorAll('.last-edited-time');
-
-            creationTimeElements.forEach(element => {
-                const unixTime = parseInt(element.getAttribute('data-unix'));
-                convertUnixTimeToLocalTime(unixTime, element);
-            });
-
-            lastEditedTimeElements.forEach(element => {
-                const unixTime = parseInt(element.getAttribute('data-unix'));
-                convertUnixTimeToLocalTime(unixTime, element);
-            });
-        };
-    </script>
 </head>
 
 <body>
     <div id="page-container" class="container">
         <h1>Welcome, {{.Username}}!</h1>
 
-
-
         <!-- Upload Form Modal -->
         <div id="uploadModal" class="modal">
             <div class="modal-dialog">
@@ -118,7 +95,7 @@
                             <button type="submit" id="deleteSelected" class="btn btn-danger">Delete Selected</button>
                         </form>
                     </div>
-                </div>
+                </div>Invalid Date	
             </div>
         </div>
         <table class="table">
@@ -146,67 +123,5 @@
             </tbody>
         </table>
     </div>
-
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
-
-    <script>
-        const deleteForm = document.getElementById("deleteForm");
-        const checkAllButton = document.getElementById("checkAll");
-        const checkboxes = document.querySelectorAll('input[type="checkbox"]');
-        checkAllButton.addEventListener("click", function () {
-            checkboxes.forEach(checkbox => {
-                checkbox.checked = true;
-            });
-        });
-
-        deleteForm.addEventListener("submit", function (event) {
-            event.preventDefault(); // Stop form submission
-
-            // Get all checkboxes in the delete form
-            const checkboxes = deleteForm.querySelectorAll('input[type="checkbox"]');
-            const filesToDelete = [];
-
-            // Get the filenames of the selected files
-            checkboxes.forEach(checkbox => {
-                if (checkbox.checked) {
-                    filesToDelete.push(checkbox.value);
-                }
-            });
-
-            // Call the deleteFiles function to send the request to the server
-            deleteFiles(filesToDelete);
-        });
-        
-
-        function deleteFiles(filesToDelete) {
-            // Send a POST request to the server to delete the selected files
-            fetch("/delete", {
-                method: "POST",
-                headers: {
-                    "Content-Type": "application/json",
-                },
-                body: JSON.stringify({ files: filesToDelete }),
-            })
-                .then(response => {
-                    if (response.ok) {
-                        // Files deleted successfully
-                        location.reload(); // Refresh the page to reflect the changes
-                    } else {
-                        // Handle the error, e.g., display an error message
-                        console.error("Error deleting files");
-                    }
-                })
-                .catch(error => {
-                    console.error("Error deleting files:", error);
-                });
-        }
-        // Handle exportFolder button click
-        const exportFolderButton = document.getElementById("exportFolder");
-        exportFolderButton.addEventListener("click", function () {
-            window.location.href = "/export";
-        });
-    </script>
-
 </body>
-
 </html>