From 84436def964263083b9dab5fac93d1ebc16104b5 Mon Sep 17 00:00:00 2001 From: Chad Davis Date: Mon, 15 Jul 2024 16:37:09 -0500 Subject: [PATCH 1/9] Adjust spacing - Added spaces to align JavaScript variables - Added blank line to better format resulting HTML --- index.php | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/index.php b/index.php index c848935..d9d4e0b 100644 --- a/index.php +++ b/index.php @@ -579,7 +579,7 @@ function convertToLocalTime(isoDate) { // Convert all dates in the table to local timezone window.addEventListener('DOMContentLoaded', (event) => { document.querySelectorAll('.created-date').forEach(element => { - const isoDate = element.getAttribute('data-iso-date'); + const isoDate = element.getAttribute('data-iso-date'); element.textContent = convertToLocalTime(isoDate); }); }); @@ -603,7 +603,6 @@ function convertToLocalTime(isoDate) {
- Date: Mon, 15 Jul 2024 16:40:04 -0500 Subject: [PATCH 2/9] Replaced `$current_dir` variable with `__DIR__` - Moved `$backup_folders` variable to top of script in alphabetical order - Replaced `$current_dir` variable with `__DIR__` constant --- index.php | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/index.php b/index.php index d9d4e0b..ac44cf2 100644 --- a/index.php +++ b/index.php @@ -13,6 +13,7 @@ */ $api_url = 'https://api.github.com/repos/dynamiccookies/Simple-Backup-Utility/releases'; +$backup_folders = get_backup_folders(__DIR__); $colors = [ 'blue', 'blueviolet', 'brown', 'cadetblue', 'chocolate', 'crimson', 'darkblue', 'darkcyan', 'darkgray', 'darkgreen', 'darkmagenta', @@ -23,7 +24,6 @@ 'palevioletred', 'peru', 'purple', 'rebeccapurple', 'red', 'seagreen', 'sienna', 'slategray', 'steelblue', 'teal', 'tomato' ]; -$current_dir = getcwd(); $green = '#28a745'; $latest_version = get_latest_release( $api_url, @@ -34,7 +34,7 @@ $random_color = $colors[array_rand($colors)]; $red = '#dc3545'; $release_url = 'https://github.com/dynamiccookies/Simple-Backup-Utility/releases/tag/$latest_version'; -$sibling_folders = get_sibling_folders($current_dir); +$sibling_folders = get_sibling_folders(__DIR__); $version_message = compare_versions( CURRENT_VERSION, $latest_version, @@ -317,7 +317,7 @@ function show_message($message_text) { } elseif (isset($_POST['delete'])) { // Construct the path to the folder and attempt to delete it - if (delete_backup_folder($current_dir . '/' . $_POST['delete'])) { + if (delete_backup_folder(__DIR__ . '/' . $_POST['delete'])) { // Set success message if deletion is successful $message_color = $green; @@ -604,9 +604,6 @@ function convertToLocalTime(isoDate) {
No Backups Found'; } else { From ba8036b3928de01681991b9e96f41eccc73eb238 Mon Sep 17 00:00:00 2001 From: Chad Davis Date: Mon, 15 Jul 2024 16:46:23 -0500 Subject: [PATCH 3/9] Conditionally show message CSS & JavaScript #43 - Added `if ($message_text)` wrapper around `.message` CSS block - Added `if ($message_text)` wrapper around `messageDiv` timeout - Removed redundant `if (messageDiv)` test --- index.php | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/index.php b/index.php index ac44cf2..2de06d1 100644 --- a/index.php +++ b/index.php @@ -432,6 +432,8 @@ function show_message($message_text) { button:hover { background-color: #0056b3; } + + .message { background-color: ; color: #fff; @@ -440,6 +442,8 @@ function show_message($message_text) { margin-bottom: 10px; transition: opacity 2s ease-out; } + + table { width: 100%; border-collapse: collapse; @@ -533,19 +537,19 @@ function updateContainerWidth() { } } }); + // Show message for 10 seconds setTimeout(function() { var messageDiv = document.getElementById('message'); - if (messageDiv) { - messageDiv.classList.add('fade-out'); + messageDiv.classList.add('fade-out'); - // Hide message container after 2 second fade out - setTimeout(function() { - messageDiv.style.display = 'none'; - }, 2000); - } + // Hide message container after 2 second fade out + setTimeout(function() { + messageDiv.style.display = 'none'; + }, 2000); }, 10000); + // Function to confirm folder deletion and submit the form function confirmDelete(folderName, formId) { From 91360080f0e0399fe7626484fa7a22de4c12711d Mon Sep 17 00:00:00 2001 From: Chad Davis Date: Mon, 15 Jul 2024 17:05:04 -0500 Subject: [PATCH 4/9] Conditionally show Existing Backups JavaScript #43 - Added `if (!empty($backup_folders))` wrapper for `confirmDelete()`, `convertToLocalTime()`, and `window.addEventListener()` to change date format - Moved `.message` timeout JavaScript to be after --- index.php | 50 ++++++++++++++++++++++++++++++-------------------- 1 file changed, 30 insertions(+), 20 deletions(-) diff --git a/index.php b/index.php index 2de06d1..38a8976 100644 --- a/index.php +++ b/index.php @@ -537,26 +537,6 @@ function updateContainerWidth() { } } }); - - - // Show message for 10 seconds - setTimeout(function() { - var messageDiv = document.getElementById('message'); - messageDiv.classList.add('fade-out'); - - // Hide message container after 2 second fade out - setTimeout(function() { - messageDiv.style.display = 'none'; - }, 2000); - }, 10000); - - - // Function to confirm folder deletion and submit the form - function confirmDelete(folderName, formId) { - if (confirm('Are you sure you want to delete the folder "' + folderName + '"?')) { - document.getElementById(formId).submit(); - } - } // Function to trigger update from GitHub repository's latest release function triggerUpdate() { @@ -573,6 +553,17 @@ function triggerUpdate() { document.body.appendChild(form); form.submit(); } + + + // Function to confirm folder deletion and submit the form + function confirmDelete(folderName, formId) { + if (confirm('Are you sure you want to delete the folder "' + folderName + '"?')) { + document.getElementById(formId).submit(); + } + } // Function to convert ISO 8601 date to local timezone and format function convertToLocalTime(isoDate) { @@ -587,6 +578,25 @@ function convertToLocalTime(isoDate) { element.textContent = convertToLocalTime(isoDate); }); }); + + + // Show message for 10 seconds + setTimeout(function() { + var messageDiv = document.getElementById('message'); + messageDiv.classList.add('fade-out'); + + // Hide message container after 2 second fade out + setTimeout(function() { + messageDiv.style.display = 'none'; + }, 2000); + }, 10000); + + From b1b1cf55c9648b3f894e001c8cf8d3d00b511bbb Mon Sep 17 00:00:00 2001 From: Chad Davis Date: Mon, 15 Jul 2024 17:12:04 -0500 Subject: [PATCH 5/9] Disconnect combined CSS for `button.backup` & `.message` - Copied the shared lines of CSS between `button.backup` and `.message` into the `.message` block since it may not always exit (#43) --- index.php | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/index.php b/index.php index 38a8976..6256283 100644 --- a/index.php +++ b/index.php @@ -415,7 +415,7 @@ function show_message($message_text) { gap: 10px; margin-bottom: 20px; } - button.backup, .message { + button.backup { box-shadow: 0 8px 8px 1px rgba(0, 0, 0, .2); font-weight: bold; } @@ -441,6 +441,8 @@ function show_message($message_text) { border-radius: 5px; margin-bottom: 10px; transition: opacity 2s ease-out; + box-shadow: 0 8px 8px 1px rgba(0, 0, 0, .2); + font-weight: bold; } From a29dd867086638ba4e355ca042bc3030d2279571 Mon Sep 17 00:00:00 2001 From: Chad Davis Date: Mon, 15 Jul 2024 17:20:04 -0500 Subject: [PATCH 6/9] Conditionally show Existing Backups CSS #43 - Moved conditional CSS blocks to bottom of CSS section - Moved `.fade-out` into conditional message wrapper and added comment - Added `if (!empty($backup_folders))` wrapper to Existing Backups CSS Close #43 --- index.php | 72 +++++++++++++++++++++++++++++++------------------------ 1 file changed, 41 insertions(+), 31 deletions(-) diff --git a/index.php b/index.php index 6256283..c636d8c 100644 --- a/index.php +++ b/index.php @@ -432,7 +432,36 @@ function show_message($message_text) { button:hover { background-color: #0056b3; } - + .checkbox-columns { + display: flex; + gap: 20px; + text-align: left; + margin: 25px 25px 15px 25px; + } + .checkbox-column label { + display: block; + white-space: nowrap; + margin-bottom: 5px; + } + .divider { + border-top: 1px solid #fff; + margin: 20px 0; + } + .version-info { + position: fixed; + bottom: 0; + right: 0; + margin: 10px; + font-size: small; + } + .version-info a { + color: yellow; + font-weight: bold; + } + .message { background-color: ; @@ -444,7 +473,15 @@ function show_message($message_text) { box-shadow: 0 8px 8px 1px rgba(0, 0, 0, .2); font-weight: bold; } - + .fade-out { + opacity: 0; + } + table { width: 100%; @@ -474,24 +511,6 @@ function show_message($message_text) { table th:nth-child(4), table td:nth-child(4) { width: 10%; } - .checkbox-columns { - display: flex; - gap: 20px; - text-align: left; - margin: 25px 25px 15px 25px; - } - .checkbox-column label { - display: block; - white-space: nowrap; - margin-bottom: 5px; - } - .divider { - border-top: 1px solid #fff; - margin: 20px 0; - } - .fade-out { - opacity: 0; - } .inline-form { display: inline; } @@ -505,17 +524,8 @@ function show_message($message_text) { .trash-icon:hover { color: #c82333; } - .version-info { - position: fixed; - bottom: 0; - right: 0; - margin: 10px; - font-size: small; - } - .version-info a { - color: yellow; - font-weight: bold; - } + +