add jquery ui and modal dialogs to reload and delete buttons

res/app.js

@@ -317,18 +317,7 @@ $(document).ready(function () {
         window.open('/genDocs.php?cmd=genDocUniqueItems', '_blank');
     });
 
-    // Delete button event
-    $('.btn-delete').click(function (event) {
-        event.preventDefault(); // Prevent default button click behavior
 
-        // delete item index
-        $.get('/ajax/uniqueitems.php?cmd=delete&index=' + $(".uniqueform input[name='index']").val(), function (response) {
-            // Handle the response from the server
-            // remove option from list
-            $('.uniqueitems-select option[value="' + $(".uniqueform input[name='index']").val() + '"]').remove();
-            console.log(response);
-        });
-    });
 
     // Save button event
     $('.btn-save').click(function (event) {
@@ -500,31 +489,100 @@ $(document).ready(function () {
 
     // Reload Mod files
     $('#reload-button').on('click', function () {
-        $("#TabContent").hide();
+        // Create a dialog with OK/Cancel buttons
-        showLoadingSpinner();
+        $('<div>').html(
-        $.get('/reload.php')
+                "Warning: Reloading all TXT/TBL files!<br><br>" +
-                .done(function (response) {
+                "This action will reload all the TXT/TBL files into the database, overwriting any existing data. It will not modify your TXT/TBL files or mod files.<br><br>" +
-                    console.log('Request successful');
+                "Please note that while this step is generally safe, it's always recommended to back up your mod files before proceeding.<br><br>" +
-                    console.log(response);
+                "Are you absolutely sure you want to proceed with this operation?"
+                ).dialog({
+            title: "Confirmation",
+            modal: true,
+            resizable: false,
+            buttons: {
+                OK: function () {
+                    // OK button clicked
+                    console.log("OK button clicked");
 
-                    // Perform additional actions or handle the response here
+                    // Show loading spinner and disable the button
-                    hideLoadingSpinner();
+                    $("#TabContent").hide();
-                    $("#TabContent").show();
+                    showLoadingSpinner();
-                })
+                    $('#reload-button').prop('disabled', true);
-                .fail(function (jqXHR, textStatus, errorThrown) {
-                    console.log('Request failed');
-                    console.log(jqXHR);
-                    console.log(textStatus);
-                    console.log(errorThrown);
 
-                    // Handle the error or show an error message
+                    // Send the request to reload.php
+                    $.get('/reload.php')
+                            .done(function (response) {
+                                console.log('Request successful');
+                                console.log(response);
 
-                })
+                                // Perform additional actions or handle the response here
-                .always(function () {
+                                hideLoadingSpinner();
-                    // Hide the loading overlay and enable the button
+                                $("#TabContent").show();
-                    $('#loading-overlay').fadeOut();
+                            })
-                    $('#reload-button').prop('disabled', false);
+                            .fail(function (jqXHR, textStatus, errorThrown) {
-                });
+                                console.log('Request failed');
+                                console.log(jqXHR);
+                                console.log(textStatus);
+                                console.log(errorThrown);
+
+                                // Handle the error or show an error message
+                            })
+                            .always(function () {
+                                // Hide the loading overlay and enable the button
+                                $('#loading-overlay').fadeOut();
+                                $('#reload-button').prop('disabled', false);
+                            });
+
+                    $(this).dialog("close");
+                },
+                Cancel: function () {
+                    // Cancel button clicked
+                    console.log("Cancel button clicked");
+
+                    $(this).dialog("close");
+                }
+            }
+        });
+    });
+
+    // Reload Mod files
+    $('.btn-delete').on('click', function () {
+        event.preventDefault(); // Prevent default button click behavior
+        // Create a dialog with OK/Cancel buttons
+        $('<div>').html(
+                "Warning: This will delete the item from the database and the TXT file on disk!<br><br>" +
+                "There is no UNDO for this. Make sure you want to delete this row before you proceed.<br><br>" +
+                "It's always recommended to back up your mod files before proceeding.<br><br>" +
+                "Are you absolutely sure you want to proceed with this operation?"
+                ).dialog({
+            title: "Confirmation",
+            modal: true,
+            resizable: false,
+            buttons: {
+                OK: function () {
+                    // OK button clicked
+                    console.log("OK button clicked");
+                    // Delete button event
+
+                    // delete item index
+                    $.get('/ajax/uniqueitems.php?cmd=delete&index=' + $(".uniqueform input[name='index']").val(), function (response) {
+                        // Handle the response from the server
+                        // remove option from list
+                        $('.uniqueitems-select option[value="' + $(".uniqueform input[name='index']").val() + '"]').remove();
+                        console.log(response);
+                    });
+
+
+                    $(this).dialog("close");
+                },
+                Cancel: function () {
+                    // Cancel button clicked
+                    console.log("Cancel button clicked");
+
+                    $(this).dialog("close");
+                }
+            }
+        });
     });
 
 

src/head.php

@@ -52,11 +52,7 @@
     <link rel="stylesheet" href="/res/font-awesome.min.css">
     <link rel="preconnect" href="https://fonts.gstatic.com">
     <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap" rel="stylesheet">
-    <link rel="stylesheet" href="https://bootswatch.com/4/lumen/bootstrap.min.css">
+    <link rel="stylesheet" href="/res/lumen_bootstrap.min.css">
-<!--    <link rel="stylesheet" href="/res/win95/assets/win95.css">
-    <link rel="stylesheet" href="https://unpkg.com/98.css" />
-    <link rel="stylesheet" href="https://unpkg.com/xp.css" />
-    <link rel="stylesheet" href="https://khang-nd.github.io/7.css/7.css">-->
     <link rel="stylesheet" href="/res/style.css">
     <link rel="stylesheet" href="/res/<?php echo $css ?>">
     <style>
@@ -73,9 +69,9 @@
     </script>
 
     <script src="/res/app.js"></script>
+    <!-- Include the necessary jQuery UI and CSS files -->
+    <script src="/res/jquery-ui.min.js"></script>
+    <link rel="stylesheet" href="/res/jquery-ui.css">
 
-
+    <title>D2Modder</title>
-
-</script>
-<title>D2Modder</title>
 </head>