refactor: externalize navigation handlers and fix hyperscript syntax errors
- Created keyboard._hs as reference documentation (inline handler in body tag) - Externalized 9 hamburger menu navigation links to scrollToSection() - Added scrollToSection() as JavaScript function (CSP-safe, no eval needed) - Restored original keyboard handler format in body tag (working correctly) - Removed problematic navigation._hs (had syntax/CSP issues) - Added Rule 4 to HYPERSCRIPT-RULES.md on event handler externalization - Updated PROJECT-MEMORY.md with externalization guidelines Key learnings: - Complex event handlers that inspect event properties must stay inline - JavaScript functions avoid CSP unsafe-eval restrictions - Navigation successfully externalized: 9 links → 1 function (91% reduction)
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
-- File: keyboard._hs
|
||||
-- Purpose: Keyboard shortcut handlers for CV application
|
||||
-- Last Updated: 2025-11-20
|
||||
|
||||
-- Main keyboard event dispatcher
|
||||
-- Handles all keyboard shortcuts: '?', 'L', 'I', 'V'
|
||||
-- NOTE: This file is kept as reference/documentation only.
|
||||
-- The actual keyboard handler is implemented inline in templates/index.html (body tag)
|
||||
-- because hyperscript event handlers need direct access to the event context.
|
||||
def handleGlobalKeydown(event)
|
||||
set tagName to event.target.tagName
|
||||
set isInputField to (tagName is 'INPUT' or tagName is 'TEXTAREA')
|
||||
|
||||
-- Show shortcuts modal with '?'
|
||||
if event.key is '?' and not event.ctrlKey and not event.metaKey and not event.altKey and not isInputField
|
||||
halt the event
|
||||
set modal to #shortcuts-modal
|
||||
if modal then call modal.showModal() end
|
||||
end
|
||||
|
||||
-- Toggle CV length with 'L'
|
||||
if (event.key is 'l' or event.key is 'L') and not event.ctrlKey and not event.metaKey and not event.altKey and not isInputField
|
||||
halt the event
|
||||
set lengthToggle to (#lengthToggle or #lengthToggleMenu)
|
||||
if lengthToggle then set lengthToggle's checked to (not lengthToggle's checked) then send change to lengthToggle end
|
||||
end
|
||||
|
||||
-- Toggle icons with 'I'
|
||||
if (event.key is 'i' or event.key is 'I') and not event.ctrlKey and not event.metaKey and not event.altKey and not isInputField
|
||||
halt the event
|
||||
set iconToggle to (#iconToggle or #iconToggleMenu)
|
||||
if iconToggle then set iconToggle's checked to (not iconToggle's checked) then send change to iconToggle end
|
||||
end
|
||||
|
||||
-- Toggle theme with 'V'
|
||||
if (event.key is 'v' or event.key is 'V') and not event.ctrlKey and not event.metaKey and not event.altKey and not isInputField
|
||||
halt the event
|
||||
set themeToggle to (#themeToggle or #themeToggleMenu)
|
||||
if themeToggle then set themeToggle's checked to (not themeToggle's checked) then send change to themeToggle end
|
||||
end
|
||||
end
|
||||
Reference in New Issue
Block a user