diff --git a/kjvstudy_org/templates/chapter.html b/kjvstudy_org/templates/chapter.html index 474cd32..b096c13 100644 --- a/kjvstudy_org/templates/chapter.html +++ b/kjvstudy_org/templates/chapter.html @@ -139,20 +139,6 @@ p[id^="verse-"].selected { outline-color: #6b9b7a; } -/* Keyboard navigation selected chapter selector */ -.chapter-nav-controls.selected { - outline: 2px solid #4a7c59; - outline-offset: 4px; - border-radius: 4px; - padding: 0.5rem; - background: rgba(74, 124, 89, 0.05); -} - -[data-theme="dark"] .chapter-nav-controls.selected { - outline-color: #6b9b7a; - background: rgba(107, 155, 122, 0.1); -} - .verse-number-link.has-commentary { color: #c41e3a; } @@ -352,7 +338,7 @@ p[id^="verse-"].selected {
@@ -434,14 +420,11 @@ document.addEventListener('DOMContentLoaded', function() { highlightVerses(); window.addEventListener('hashchange', highlightVerses); - // Three-zone navigation: action buttons, verses, and chapter selector + // Two-zone navigation: action buttons and verses const actionButtons = Array.from(document.querySelectorAll('.chapter-actions .action-btn')); const verses = document.querySelectorAll('p[id^="verse-"]'); - const chapterNavControls = document.querySelector('.chapter-nav-controls'); - const chapterSelect = document.querySelector('.chapter-select'); let selectedVerseIndex = -1; let selectedActionIndex = -1; - let chapterSelectorSelected = false; let inActionZone = false; // Initialize from hash if present (e.g., #verse-24) @@ -470,10 +453,6 @@ document.addEventListener('DOMContentLoaded', function() { verses[selectedVerseIndex].classList.remove('selected'); } actionButtons.forEach(btn => btn.classList.remove('selected')); - if (chapterNavControls) { - chapterNavControls.classList.remove('selected'); - } - chapterSelectorSelected = false; } function selectAction(index) { @@ -488,21 +467,6 @@ document.addEventListener('DOMContentLoaded', function() { }); } - function selectChapterSelector() { - clearAllSelections(); - inActionZone = false; - selectedActionIndex = -1; - selectedVerseIndex = -1; - chapterSelectorSelected = true; - if (chapterNavControls) { - chapterNavControls.classList.add('selected'); - chapterNavControls.scrollIntoView({ - behavior: 'smooth', - block: 'center' - }); - } - } - function selectVerse(index) { clearAllSelections(); inActionZone = false; @@ -523,24 +487,8 @@ document.addEventListener('DOMContentLoaded', function() { // Keyboard navigation for chapters and verses document.addEventListener('keydown', function(e) { - // Don't trigger if user is typing (but allow Escape from SELECT to close it) - if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') { - return; - } - - // Allow Escape to blur and close the SELECT dropdown - if (e.target.tagName === 'SELECT' && e.key === 'Escape') { - e.target.blur(); - clearAllSelections(); - selectedVerseIndex = -1; - selectedActionIndex = -1; - inActionZone = false; - inChapterSelectorZone = false; - return; - } - - // For SELECT elements, only respond to navigation when not using the dropdown - if (e.target.tagName === 'SELECT' && e.key !== 'Escape') { + // Don't trigger if user is typing + if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA' || e.target.tagName === 'SELECT') { return; } @@ -552,9 +500,6 @@ document.addEventListener('DOMContentLoaded', function() { if (selectedActionIndex > 0) { selectAction(selectedActionIndex - 1); } - } else if (inChapterSelectorZone) { - // Move from chapter selector to last verse - selectVerse(verses.length - 1); } else if (selectedVerseIndex === 0 && actionButtons.length > 0) { // At first verse, move to action buttons selectAction(actionButtons.length - 1); @@ -579,12 +524,6 @@ document.addEventListener('DOMContentLoaded', function() { // Move to first verse selectVerse(0); } - } else if (inChapterSelectorZone) { - // Stay in chapter selector zone - // (no down navigation from chapter selector) - } else if (selectedVerseIndex >= verses.length - 1) { - // At last verse, move to chapter selector - selectChapterSelector(); } else if (selectedVerseIndex < 0) { // No selection, start at first verse (initial down starts with verses, not actions) selectVerse(KJVNav.findFirstVisibleIndex(Array.from(verses))); @@ -595,15 +534,11 @@ document.addEventListener('DOMContentLoaded', function() { } } - // Enter: Navigate to selected item or focus chapter selector + // Enter: Navigate to selected item if (e.key === 'Enter') { e.preventDefault(); if (inActionZone && selectedActionIndex >= 0) { window.location.href = actionButtons[selectedActionIndex].href; - } else if (inChapterSelectorZone && chapterSelect) { - // Focus the chapter selector dropdown (user can then use arrow keys to select) - chapterSelect.focus(); - // The browser's native behavior will let them navigate with arrows } else if (selectedVerseIndex >= 0) { const link = verses[selectedVerseIndex].querySelector('.verse-number-link'); if (link) window.location.href = link.href; @@ -618,12 +553,6 @@ document.addEventListener('DOMContentLoaded', function() { if (selectedActionIndex > 0) { selectAction(selectedActionIndex - 1); } - } else if (inChapterSelectorZone) { - // Navigate to previous chapter from chapter selector - const prevBtn = document.getElementById('prev-chapter'); - if (prevBtn) { - window.location.href = prevBtn.href; - } } else { const hash = window.location.hash; if (hash && hash.startsWith('#verse-')) { @@ -649,13 +578,6 @@ document.addEventListener('DOMContentLoaded', function() { if (selectedActionIndex < actionButtons.length - 1) { selectAction(selectedActionIndex + 1); } - } else if (inChapterSelectorZone) { - // Navigate to next chapter from chapter selector - e.preventDefault(); - const nextBtn = document.getElementById('next-chapter'); - if (nextBtn) { - window.location.href = nextBtn.href; - } } else { const nextBtn = document.getElementById('next-chapter'); if (nextBtn) { @@ -672,7 +594,6 @@ document.addEventListener('DOMContentLoaded', function() { selectedVerseIndex = -1; selectedActionIndex = -1; inActionZone = false; - inChapterSelectorZone = false; } // i: Go to interlinear view