txeo/cv-site
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
289 Commits 1 Branch 2 Tags
d2330f5d48afbc62d2fff6e65349a24ed409602f
Commit Graph

3 Commits

Author SHA1 Message Date
juanatsap d2330f5d48 refactor: migrate toggle and hover sync functions from JavaScript to Hyperscript 
BREAKING: Removed JavaScript toggle functions in favor of organized Hyperscript architecture

Changes:
- Created organized Hyperscript file structure (no def limit with latest version):
  • static/hyperscript/utils._hs (utility functions)
  • static/hyperscript/toggles._hs (CV length, icons, theme toggles)
  • static/hyperscript/hover-sync._hs (PDF/Print hover sync + zoom highlight)

- Removed functions._hs (renamed to utils._hs for better organization)

- Emptied static/js/cv-functions.js (kept file with migration notice)
  • toggleCVLength, toggleIcons, toggleTheme → toggles._hs
  • syncPdfHover, syncPrintHover, highlightZoomControl → hover-sync._hs

- Updated templates/index.html to load all 3 new hyperscript files

- Updated tests/mjs/1-toggles.test.mjs for responsive design
  • Added viewport detection for desktop vs mobile toggles
  • Tests now adapt to screen size

Rationale:
- Test 9 confirmed NO def limit with latest hyperscript (tested up to 5 defs)
- Better separation of concerns with category-based file organization
- Aligns with server-side hypermedia pattern (HTMX + Hyperscript)
- Eliminates workaround JavaScript duplication
- 9 total def statements across 3 files (proving no limit)

Verified:
✅ All hyperscript files load successfully (HTTP 200)
✅ Hyperscript library loads without errors
✅ Functions work correctly in browser
✅ No console errors
✅ Test 9 (def limit) passes with 5 def statements

Related: Test 9 verification (tests/mjs/9-hyperscript-def-limit.test.mjs)
 2025-11-17 16:28:52 +00:00
juanatsap f87a1a5c28 fix: implement complete hover synchronization for PDF/Print buttons 
CRITICAL BUG FIX: Hover states now sync between action bar and hamburger menu

Changes:
1. Added mouseenter/mouseleave handlers to menu PDF button
   - templates/partials/navigation/hamburger-menu.html:178-181
   - Added .menu-pdf-btn class for targeting
   - Added hyperscript hover sync events

2. Updated syncPdfHover() function
   - static/js/cv-functions.js:71-82
   - Now selects both .pdf-btn and .menu-pdf-btn
   - Both buttons get .pdf-hover-sync class on hover

3. Updated syncPrintHover() function
   - static/js/cv-functions.js:88-99
   - Now selects both .print-btn and .menu-print-btn
   - Both buttons get .print-hover-sync class on hover

4. Added CSS for menu PDF button hover sync
   - static/css/main.css:2690-2700
   - .menu-pdf-btn.pdf-hover-sync styling (white bg, red icon)
   - Matches action bar PDF button hover state

5. Created comprehensive hover sync test
   - tests/mjs/8-hover-sync.test.mjs
   - Tests all 4 hover scenarios (bar→menu, menu→bar for both buttons)
   - Validates event handlers and CSS class application
   - Manual verification instructions included

Behavior now correct:
✅ Hovering action bar PDF button highlights menu PDF button
✅ Hovering action bar Print button highlights menu Print button
✅ Hovering menu PDF button highlights action bar PDF button
✅ Hovering menu Print button highlights action bar Print button

Fixes documented bug from PROJECT-MEMORY.md Section 3.
 2025-11-17 14:35:32 +00:00
juanatsap 3f77fedeaf fix: icon toggle real-time rendering + hyperscript architecture cleanup 
CRITICAL FIX: Icon toggle now works without page refresh
- Changed class name from 'show-logos' to 'show-icons' (CSS mismatch bug)
- Updated localStorage key from 'cv-logos' to 'cv-icons'
- Fixed toggleIcons() function in cv-functions.js

HYPERSCRIPT ARCHITECTURE:
- Moved 6 toggle functions from hyperscript to JavaScript (cv-functions.js)
- Solves hyperscript 0.9.14 parser limitation (max 3 def statements total)
- Upgraded hyperscript from 0.9.12 to 0.9.14
- Fixed operator precedence in keyboard shortcuts
- Cleaned view-controls.html templates (inline → function calls)

NEW FILES:
- static/js/cv-functions.js - Global toggle functions (6 functions)
- HYPERSCRIPT-RULES.md - Permanent architecture documentation
- tests/mjs/0-zoom.test.mjs - Zoom functionality test
- tests/mjs/1-toggles.test.mjs - Comprehensive toggle test with real-time verification
- tests/TEST-SUMMARY.md - Test suite documentation

TESTS:
- Real-time DOM update verification (no refresh required)
- Screenshot capture for visual regression
- localStorage persistence validation
- Toggle synchronization between action bar and menu

BREAKING CHANGE: localStorage key changed from 'cv-logos' to 'cv-icons'
Users may need to re-toggle icons preference on first load after update.
 2025-11-17 13:00:03 +00:00