refactor: use idiomatic hyperscript selector syntax

Replace verbose document.getElementById() and document.querySelectorAll()
with cleaner hyperscript syntax:
- #id for ID selectors
- .class and the first .class for class selectors
- <selector/> query literals for complex selectors
- #{variable} for dynamic ID interpolation

Files changed:
- utils._hs: scrollHeight, details, footer buttons, scrollToSection
- zoom._hs: all zoom control element selectors (14 changes)
- pdf-modal._hs: modal selector
- keyboard._hs: dynamic toggle and modal selectors
- contact-modal.html: response div and modal close
- index.html: ninja-keys bar selector
This commit is contained in:
juanatsap
2025-12-02 16:23:40 +00:00
parent 6970606c42
commit 3c49f8f7cf
6 changed files with 25 additions and 25 deletions
+3 -3
View File
@@ -8,9 +8,9 @@
-- Helper function to toggle a checkbox by ID (tries primary ID, then menu ID)
-- Called from inline keyboard handler in body tag
def handleToggleShortcut(toggleId, menuToggleId)
set toggle to document.getElementById(toggleId)
set toggle to #{toggleId}
if toggle is null
set toggle to document.getElementById(menuToggleId)
set toggle to #{menuToggleId}
end
if toggle is not null
set toggle.checked to (not toggle.checked)
@@ -23,7 +23,7 @@ end
-- ==============================================================================
-- Helper function to open a modal dialog by ID
def openModalShortcut(modalId)
set modal to document.getElementById(modalId)
set modal to #{modalId}
if modal is not null
call modal.showModal()
end
+1 -1
View File
@@ -9,7 +9,7 @@
-- Called from each card's click event
def selectPdfCard(card)
-- Get the modal container
set modal to document.getElementById('pdf-modal')
set modal to #pdf-modal
if modal is null then exit end
-- Remove selected from all cards
+7 -7
View File
@@ -67,8 +67,8 @@ def handleScroll()
set isMenuOpen to menu.classList.contains('menu-open')
-- Calculate if at bottom (within 50px)
set scrollHeight to document.documentElement.scrollHeight
set clientHeight to document.documentElement.clientHeight
set scrollHeight to the document's documentElement's scrollHeight
set clientHeight to the document's documentElement's clientHeight
set isAtBottom to (scrollHeight - currentScroll - clientHeight) < 50
-- Reset keepHeaderVisible when scrolling up
@@ -144,7 +144,7 @@ end
-- Expand all <details> elements in the CV
def expandAllSections(evt)
if evt then call evt.preventDefault() end
set details to document.querySelectorAll('details')
set details to <details/>
for d in details
set d's @open to ''
end
@@ -153,7 +153,7 @@ end
-- Collapse all <details> elements in the CV
def collapseAllSections(evt)
if evt then call evt.preventDefault() end
set details to document.querySelectorAll('details')
set details to <details/>
for d in details
call d.removeAttribute('open')
end
@@ -164,7 +164,7 @@ end
-- ==============================================================================
-- Adds/removes footer-hovered class to fixed buttons when hovering footer
def setFooterHover(show)
set buttons to document.querySelectorAll('.download-btn, .print-friendly-btn, .shortcuts-btn, .info-button, .back-to-top, .color-theme-switcher')
set buttons to <.download-btn, .print-friendly-btn, .shortcuts-btn, .info-button, .back-to-top, .color-theme-switcher/>
for btn in buttons
if show
add .footer-hovered to btn
@@ -199,11 +199,11 @@ end
-- Smooth scroll to a section by ID
def scrollToSection(evt, sectionId)
if evt then call evt.preventDefault() end
set el to document.getElementById(sectionId)
set el to #{sectionId}
if el is not null
call el.scrollIntoView({ behavior: 'smooth' })
-- Close the menu after navigation
set menu to document.querySelector('.navigation-menu')
set menu to the first .navigation-menu
if menu is not null
remove .menu-hover from menu
remove .menu-open from menu
+11 -11
View File
@@ -11,7 +11,7 @@ def handleZoomInput(slider)
set zoomLevel to zoomValue / 100
-- Update display
set valueEl to document.getElementById('zoom-value-current')
set valueEl to #zoom-value-current
if valueEl is not null
put zoomValue into valueEl
end
@@ -19,7 +19,7 @@ def handleZoomInput(slider)
set slider's @aria-valuetext to `${zoomValue}%`
-- Toggle reset button class
set resetBtn to document.getElementById('zoom-reset')
set resetBtn to #zoom-reset
if resetBtn is not null
if zoomValue is not 100
add .zoom-not-default to resetBtn
@@ -29,7 +29,7 @@ def handleZoomInput(slider)
end
-- Apply zoom to wrapper
set wrapper to document.getElementById('zoom-wrapper')
set wrapper to #zoom-wrapper
if wrapper is not null
set wrapper's *zoom to zoomLevel
-- Handle width for zoom > 100%
@@ -53,7 +53,7 @@ end
-- ==============================================================================
-- Called from reset button to reset zoom to 100%
def handleZoomReset()
set slider to document.getElementById('zoom-slider')
set slider to #zoom-slider
if slider is not null
set slider.value to 100
call handleZoomInput(slider)
@@ -73,7 +73,7 @@ def initZoomControl(control)
-- Load saved zoom level
set savedZoom to localStorage.getItem('cv-zoom')
set slider to document.getElementById('zoom-slider')
set slider to #zoom-slider
if savedZoom and slider
set slider.value to savedZoom
call handleZoomInput(slider)
@@ -83,7 +83,7 @@ def initZoomControl(control)
set isVisible to localStorage.getItem('cv-zoom-visible')
if isVisible is 'true'
remove .zoom-hidden from control
set menuBtn to document.getElementById('show-zoom-menu-btn')
set menuBtn to #show-zoom-menu-btn
if menuBtn is not null
add .zoom-hidden to menuBtn
end
@@ -104,8 +104,8 @@ end
-- ==============================================================================
-- Show zoom control
def showZoomControl()
set control to document.getElementById('zoom-control')
set menuBtn to document.getElementById('show-zoom-menu-btn')
set control to #zoom-control
set menuBtn to #show-zoom-menu-btn
if control is not null
remove .zoom-hidden from control
set localStorage['cv-zoom-visible'] to 'true'
@@ -117,8 +117,8 @@ end
-- Hide zoom control
def hideZoomControl()
set control to document.getElementById('zoom-control')
set menuBtn to document.getElementById('show-zoom-menu-btn')
set control to #zoom-control
set menuBtn to #show-zoom-menu-btn
if control is not null
add .zoom-hidden to control
set localStorage['cv-zoom-visible'] to 'false'
@@ -130,7 +130,7 @@ end
-- Toggle zoom control visibility
def toggleZoomControl()
set control to document.getElementById('zoom-control')
set control to #zoom-control
if control is not null
if control.classList.contains('zoom-hidden')
call showZoomControl()