/** * CV Site - JavaScript Wrappers for Hyperscript Functions * ========================================================= * * ARCHITECTURE NOTE (2025-11-17): * =============================== * These are thin JavaScript wrappers that delegate to Hyperscript functions. * * Why wrappers are needed: * - Hyperscript's `call` command within `_=""` attributes requires functions in global JS scope * - While hyperscript docs state "global hyperscript functions can be called from JavaScript", * the reverse (JS calling hyperscript via `call` in attributes) requires window exposure * - Templates use `_="on mouseenter call syncPdfHover(true)"` syntax * - Hyperscript `def` functions are accessible via _hyperscript.evaluate() but not window.functionName * - These wrappers bridge the gap by exposing to window and delegating to hyperscript * * Implementation in Hyperscript: * - toggleCVLength() → static/hyperscript/toggles._hs * - toggleIcons() → static/hyperscript/toggles._hs * - toggleTheme() → static/hyperscript/toggles._hs * - syncPdfHover() → static/hyperscript/hover-sync._hs * - syncPrintHover() → static/hyperscript/hover-sync._hs * - highlightZoomControl() → static/hyperscript/hover-sync._hs * * Pattern: window.functionName() → _hyperscript.evaluate('hyperscriptFunction()') */ /** * Toggle CV Length (Short/Long) * @param {boolean} isLong - true for long CV, false for short */ function toggleCVLength(isLong) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('toggleCVLength(' + isLong + ')'); } } /** * Toggle Icons Display * @param {boolean} showIcons - true to show icons, false to hide */ function toggleIcons(showIcons) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('toggleIcons(' + showIcons + ')'); } } /** * Toggle Theme (Default/Clean) * @param {boolean} isClean - true for clean theme, false for default */ function toggleTheme(isClean) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('toggleTheme(' + isClean + ')'); } } /** * Sync PDF Button Hover State * @param {boolean} show - true to add hover class, false to remove */ function syncPdfHover(show) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('syncPdfHover(' + show + ')'); } } /** * Sync Print Button Hover State * @param {boolean} show - true to add hover class, false to remove */ function syncPrintHover(show) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('syncPrintHover(' + show + ')'); } } /** * Highlight Zoom Control * @param {boolean} show - true to highlight, false to remove highlight */ function highlightZoomControl(show) { if (typeof _hyperscript !== 'undefined') { _hyperscript.evaluate('highlightZoomControl(' + show + ')'); } } /** * Scroll to Section * @param {Event} event - The click event (for preventDefault) * @param {string} sectionId - The ID of the section to scroll to */ function scrollToSection(event, sectionId) { if (event) { event.preventDefault(); } const element = document.getElementById(sectionId); if (element) { element.scrollIntoView({ behavior: 'smooth' }); } } // Make functions globally available for hyperscript `call` command window.toggleCVLength = toggleCVLength; window.toggleIcons = toggleIcons; window.toggleTheme = toggleTheme; window.syncPdfHover = syncPdfHover; window.syncPrintHover = syncPrintHover; window.highlightZoomControl = highlightZoomControl; window.scrollToSection = scrollToSection; // Note: handleGlobalKeydown() is defined in keyboard._hs as reference only // The actual keyboard handler is inline in templates/index.html (body tag)