remove redundant button

This commit is contained in:
Joey Yakimowich-Payne 2025-04-18 07:15:22 -06:00
commit 3a18609e33
No known key found for this signature in database
GPG key ID: 6BFE655FA5ABD1E1
3 changed files with 29 additions and 6 deletions

View file

@ -90,9 +90,9 @@ body {
/* NEW: Style for highlighted search results */ /* NEW: Style for highlighted search results */
.bingo-cell.highlighted { .bingo-cell.highlighted {
border-color: #3b82f6; /* Tailwind blue-500 */ border-color: #3b82f6; /* Tailwind blue-500 */
border-width: 3px; border-width: 3px; /* Reverted from 4px */
transform: scale(1.05); transform: scale(1.05); /* Reverted from 1.07 */
box-shadow: 0 0 15px rgba(59, 130, 246, 0.6); /* Stronger blue glow */ box-shadow: 0 0 15px rgba(59, 130, 246, 0.8); /* Increased opacity from 0.6 (Kept) */
z-index: 10; /* Ensure highlighted cells are visually on top if overlapping happens during scale */ z-index: 10; /* Ensure highlighted cells are visually on top if overlapping happens during scale */
} }

View file

@ -36,9 +36,7 @@
<!-- Control Buttons --> <!-- Control Buttons -->
<div class="flex space-x-4 mb-4"> <div class="flex space-x-4 mb-4">
<button onclick="generateBoard()" class="bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"> <!-- Removed Generate/Update Button -->
Generate/Update Board
</button>
<button onclick="randomizeBoard()" class="bg-yellow-600 hover:bg-yellow-700 text-white font-bold py-2 px-4 rounded"> <button onclick="randomizeBoard()" class="bg-yellow-600 hover:bg-yellow-700 text-white font-bold py-2 px-4 rounded">
Randomize Randomize
</button> </button>

View file

@ -806,6 +806,11 @@ function randomizeBoard() {
applyMarkedCellStyle(cell); // Reset marked styles (which also calls applyCellStyle) applyMarkedCellStyle(cell); // Reset marked styles (which also calls applyCellStyle)
}); });
// Explicitly remove any existing highlights BEFORE clearing the search input
const currentlyHighlighted = board.querySelectorAll('.bingo-cell.highlighted');
currentlyHighlighted.forEach(cell => cell.classList.remove('highlighted'));
clearSearch(); // Clear search highlights and input
clearMarks(false); // Clear visual marks clearMarks(false); // Clear visual marks
saveBoardState(); // Save the new randomized state (including cleared marks) saveBoardState(); // Save the new randomized state (including cleared marks)
showNotification('Board randomized!', 'success'); showNotification('Board randomized!', 'success');
@ -930,6 +935,22 @@ function getMarkedIndices() {
return indices; return indices;
} }
// --- Clear Search Input and Highlights ---
function clearSearch() {
const searchInput = document.getElementById('search-input');
if (searchInput) {
searchInput.value = ''; // Clear the input field
// Trigger the input event listener to ensure highlights are removed
searchInput.dispatchEvent(new Event('input'));
}
// It's technically redundant to remove the class here now, as the
// event listener triggered above should handle it, but it doesn't hurt.
const highlightedCells = document.querySelectorAll('#bingo-board .bingo-cell.highlighted');
highlightedCells.forEach(cell => {
cell.classList.remove('highlighted'); // Remove highlight class
});
}
// --- Load State on Page Load --- // --- Load State on Page Load ---
function loadFromLocalStorage() { function loadFromLocalStorage() {
const savedSize = localStorage.getItem(LS_BOARD_SIZE) || "5"; // Default to 5 const savedSize = localStorage.getItem(LS_BOARD_SIZE) || "5"; // Default to 5
@ -1391,6 +1412,10 @@ function loadFromLocalStorage() {
saveCellStyleSettings(); saveCellStyleSettings();
refreshCellStyles(); refreshCellStyles();
}); });
clearSearch(); // Clear search highlights and input
clearMarks(false); // Clear visual marks
saveBoardState(); // Save the new randomized state (including cleared marks)
} }
// --- Function to make all cells square and equal size --- // --- Function to make all cells square and equal size ---