From 2433fc7601c21a360401be142e9e6736ab6cd04d Mon Sep 17 00:00:00 2001 From: JoseQuintas2003 Date: Wed, 16 Apr 2025 01:11:06 +0100 Subject: [PATCH] Bug Fix that caused the Select/Deselect All buttons to appear incorrectly Changed Page Select button so that both Select/Deselect All buttons can show up at the same time. Also made it so that Select All button does not show up when all pages are selected, and Deselect All button does not show up when no pages are selected --- .../static/js/multitool/PdfContainer.js | 87 ++++++++++++++----- src/main/resources/templates/multi-tool.html | 2 +- 2 files changed, 64 insertions(+), 25 deletions(-) diff --git a/src/main/resources/static/js/multitool/PdfContainer.js b/src/main/resources/static/js/multitool/PdfContainer.js index 72dd7f4c0..f08734637 100644 --- a/src/main/resources/static/js/multitool/PdfContainer.js +++ b/src/main/resources/static/js/multitool/PdfContainer.js @@ -35,6 +35,7 @@ class PdfContainer { this.splitAll = this.splitAll.bind(this); this.deleteSelected = this.deleteSelected.bind(this); this.toggleSelectAll = this.toggleSelectAll.bind(this); + this.toggleDeselectAll = this.toggleDeselectAll.bind(this); this.updateSelectedPagesDisplay = this.updateSelectedPagesDisplay.bind(this); this.toggleSelectPageVisibility = this.toggleSelectPageVisibility.bind(this); this.updatePagesFromCSV = this.updatePagesFromCSV.bind(this); @@ -64,6 +65,7 @@ class PdfContainer { window.splitAll = this.splitAll; window.deleteSelected = this.deleteSelected; window.toggleSelectAll = this.toggleSelectAll; + window.toggleDeselectAll = this.toggleDeselectAll; window.updateSelectedPagesDisplay = this.updateSelectedPagesDisplay; window.toggleSelectPageVisibility = this.toggleSelectPageVisibility; window.updatePagesFromCSV = this.updatePagesFromCSV; @@ -435,31 +437,43 @@ class PdfContainer { toggleSelectAll() { const checkboxes = document.querySelectorAll('.pdf-actions_checkbox'); - window.selectAll = !window.selectAll; + window.selectAll = true; const selectIcon = document.getElementById('select-All-Container'); const deselectIcon = document.getElementById('deselect-All-Container'); - if (!window.selectAll) { - this.showButton(selectIcon, true); - this.showButton(deselectIcon, false); - } else { - this.showButton(selectIcon, false); - this.showButton(deselectIcon, true); - } + this.showButton(selectIcon, false); + this.showButton(deselectIcon, true); + checkboxes.forEach((checkbox) => { - checkbox.checked = window.selectAll; + checkbox.checked = true; const pageNumber = Array.from(checkbox.parentNode.parentNode.children).indexOf(checkbox.parentNode) + 1; - if (checkbox.checked) { - if (!window.selectedPages.includes(pageNumber)) { - window.selectedPages.push(pageNumber); - } - } else { - const index = window.selectedPages.indexOf(pageNumber); - if (index !== -1) { - window.selectedPages.splice(index, 1); - } + if (!window.selectedPages.includes(pageNumber)) { + window.selectedPages.push(pageNumber); + } + }); + + this.updateSelectedPagesDisplay(); + } + + toggleDeselectAll() { + const checkboxes = document.querySelectorAll('.pdf-actions_checkbox'); + window.selectAll = false; + const selectIcon = document.getElementById('select-All-Container'); + const deselectIcon = document.getElementById('deselect-All-Container'); + + this.showButton(selectIcon, true); + this.showButton(deselectIcon, false); + + checkboxes.forEach((checkbox) => { + checkbox.checked = false; + + const pageNumber = Array.from(checkbox.parentNode.parentNode.children).indexOf(checkbox.parentNode) + 1; + + const index = window.selectedPages.indexOf(pageNumber); + if (index !== -1) { + window.selectedPages.splice(index, 1); } }); @@ -569,6 +583,27 @@ class PdfContainer { // Update the input field with the formatted page list selectedPagesInput.value = this.formatSelectedPages(window.selectedPages); + + const selectIcon = document.getElementById('select-All-Container'); + const deselectIcon = document.getElementById('deselect-All-Container'); + + //Check if no pages are selected + if (window.selectedPages.length === 0) { + this.showButton(selectIcon, true); + this.showButton(deselectIcon, false); + } else { + this.showButton(deselectIcon, true); + } + + //Check if all pages are selected + const allCheckboxes = document.querySelectorAll('.pdf-actions_checkbox'); + const allSelected = Array.from(allCheckboxes).every((checkbox) => checkbox.checked); + if (allSelected) { + this.showButton(selectIcon, false); + this.showButton(deselectIcon, true); + } else { + this.showButton(selectIcon, true); + } } parsePageRanges(ranges) { @@ -852,18 +887,22 @@ class PdfContainer { deleteButton.classList.toggle('hidden', !window.selectPage); const selectedPages = document.getElementById('selected-pages-display'); selectedPages.classList.toggle('hidden', !window.selectPage); + if(!window.selectPage) { this.showButton(document.getElementById('deselect-All-Container'), false); this.showButton(document.getElementById('select-All-Container'), false); } - else if(window.selectAll){ - this.showButton(document.getElementById('deselect-All-Container'), true); - this.showButton(document.getElementById('select-All-Container'), false); - } else{ - this.showButton(document.getElementById('deselect-All-Container'), false); - this.showButton(document.getElementById('select-All-Container'), true); + const allCheckboxes = document.querySelectorAll('.pdf-actions_checkbox'); + const allSelected = Array.from(allCheckboxes).every((checkbox) => checkbox.checked); + if (!allSelected) { + this.showButton(document.getElementById('select-All-Container'), true); + } + + if (window.selectedPages.length > 0) { + this.showButton(document.getElementById('deselect-All-Container'), true); + } } const exportSelected = document.getElementById('export-selected-button'); diff --git a/src/main/resources/templates/multi-tool.html b/src/main/resources/templates/multi-tool.html index 3c6c60fba..5ef7e9bc8 100644 --- a/src/main/resources/templates/multi-tool.html +++ b/src/main/resources/templates/multi-tool.html @@ -94,7 +94,7 @@