Commit Graph

254 Commits

Author SHA1 Message Date
juanatsap 8f4d0e9433 feat: self-host HTMX 2.0.10 and Hyperscript 0.9.91, remove unpkg CDN
- Download htmx.min.js v2.0.10 and _hyperscript.min.js v0.9.91 locally
- Update head-scripts.html to load from /static/ instead of unpkg CDN
- Remove https://unpkg.com from CSP script-src whitelist
- Update all documentation references to reflect self-hosted paths
- No breaking changes: all hx-* attributes are HTMX 2.0 compatible
2026-05-14 12:59:30 +01:00
juanatsap 46912f0bf3 feat: add collab category for gh-dashboard project
New COL badge (soft green) for collaboration projects, distinct from
OSS contributions.
2026-05-07 23:12:32 +01:00
juanatsap f3fc6a2632 feat: add gh-dashboard project, language switch partial, header alignment fix
- Add gh-dashboard (debba/gh-dashboard) as collaboration project in EN/ES CV data
- Add head-language-switch.html template partial with test
- Change CV header text-align-last from justify to left
- Update .gitignore to exclude prompt symlinks and cv-site binary
2026-05-07 22:52:46 +01:00
juanatsap b9db689981 fix: remove emojis from chat loading phrases 2026-05-04 15:20:04 +01:00
juanatsap ef958dffe5 feat: language switch reloads page (fixes chat), fun loading phrases
- Language switch now does full page reload so chat reinitializes
- Replaced boring "Initializing AI model..." with 14 fun random phrases
- Phrases are bilingual (ES/EN), CV-themed, with emojis
2026-05-04 15:00:46 +01:00
juanatsap 075a58efe4 fix: category badge before project title 2026-05-04 14:53:01 +01:00
juanatsap ea5e0c5aab fix: category badge moved to end of badge row (after GitHub+stars) 2026-05-04 14:49:04 +01:00
juanatsap 27cd4d06e8 fix: badge order — GitHub icon, number, star icon 2026-05-04 14:46:53 +01:00
juanatsap c8e680f7ea feat: 3-letter category tags, merged GitHub+stars badge, pastel colors
- Category badges: CLI, APP, WEB, PLG, SDK, OSS in pastel tones
- GitHub + stars merged into single dark badge with gold star count
- La Porra fixed to "web" category
2026-05-04 14:37:36 +01:00
juanatsap 542419de45 feat: category icon badges on projects — CLI, App, Web, Plugin, SDK
Each project now shows a colored icon badge indicating its type:
- CLI (purple terminal), App (blue apple), Web (cyan globe)
- WebApp (teal app), Plugin (amber puzzle), SDK (violet package)
- Contrib (gray pull request)
2026-05-04 14:28:37 +01:00
juanatsap 29aa3d1fd7 fix: stars badge on all projects with a GitHub repo, not just openSource 2026-05-04 14:19:26 +01:00
juanatsap 96ca60babe fix: stars badge shows "13 stars" (number first), SoundInbox not open source
- Badge text order: number before "stars"
- SoundInbox: removed gitRepoUrl, removed "open-source" from descriptions
- SoundInbox is a native app, not an open-source project
2026-05-04 14:08:22 +01:00
juanatsap 7322c1a158 fix: stars count rendered server-side with 30min cache, no client-side API calls 2026-05-04 13:52:53 +01:00
juanatsap 76d9649ec2 feat: custom gold stars badge matching other badges, live count via GitHub API 2026-05-04 13:47:05 +01:00
juanatsap 9a2343a71e feat: GitHub stars badge on open-source projects via shields.io
- New openSource field in project model distinguishes OS from private
- shields.io badge shows live star count for open-source projects
- SoundInbox marked as NOT open source (no badge, no stars)
- Immich Photo Manager, Cmux Resurrect, Gotify Commander, CDC Starter Kit → open source
- Stars badge hidden in print view
2026-05-04 13:42:40 +01:00
juanatsap 3aebc82068 fix: background toggle button dev-only, photo always visible in production 2026-05-02 15:00:02 +01:00
juanatsap 9547bc7130 feat: remove Commando project, add Gotify Commander logo, drolosoft linked
- Remove unreleased Commando project from CV
- Add gotify-commander.png logo from GitHub repo
- "drolosoft" lowercase with link to drolosoft.com in summary
- Replace Certifications chip with Open source chip in chat
2026-04-27 00:32:54 +01:00
juanatsap 5c5f99b626 fix: English disclaimer matches Spanish tone 2026-04-27 00:23:28 +01:00
juanatsap a35db95ca4 fix: chat disclaimer — "soy el yo digital de Juan, y sólo sé responder..." 2026-04-27 00:22:36 +01:00
juanatsap 668eb56c9f fix: disclaimer tooltip — 'soy el yo digital de Juan' 2026-04-27 00:00:52 +01:00
juanatsap 6204ffdd6c fix: chat uses second person (tú/you), footer text visible over background
- Chat suggestions and help modal questions now address Juan directly
- Footer text/links use white with text-shadow for readability over photos
2026-04-26 23:39:38 +01:00
juanatsap 6cd949c5ea feat: background photo toggle available everywhere, not just dev 2026-04-26 23:33:37 +01:00
juanatsap f5c78e6845 feat: chat speaks as Juan — first person, CV photo avatar, disclaimer tooltip
- Agent prompt rewritten to first person ("I worked at...", "I built...")
- Bot avatar replaced with dni-thumb.jpeg (2.6KB, 56x56 retina)
- Greeting: "Pregúntame lo que quieras sobre mi currículum"
- Underlined "mi currículum" with floating tooltip disclaimer
- Every response ends with cordial email contact invitation
- Background photos now visible in production (random per load)
- Toggle button remains dev-only
2026-04-26 23:32:48 +01:00
juanatsap 3b6d5e781a feat: background photo system — random Lanzarote landscapes behind CV grid
Dev-only toggle button enables/disables photo backgrounds. Photos are
auto-discovered from static/images/backgrounds/ and randomly selected
on each page load. Production is unaffected — no button, no photo.
2026-04-25 14:46:33 +01:00
juanatsap 7b6062d0f2 privacy: remove phone number from CV — private data
- Clear phone field in both EN/ES JSON data
- Conditional rendering in footer, plain text, and JSON-LD
- Chat agent already configured to not reveal contact details
2026-04-09 20:20:15 +01:00
juanatsap 0b672447f6 feat: cog menu for layout modes, mobile viewport fix, better separation
Header UX:
- Replace 5 icon buttons with single cog (gear) dropdown menu
- Cog menu shows all layout options with icons + labels
- Help and Close buttons stay visible outside the cog
- Active mode highlighted in green

Mobile fixes:
- Fix viewport overflow (100vw + max-width: 100vw)
- Stronger shadow (0 -4px 20px) for clear CV/chat separation
- Rounded corners (12px) on top for recognizable chat window
- Hide desktop-only modes (side panel, floating, full) from cog on mobile
- max-height: 50vh ensures CV always visible above

Dark mode:
- Cog menu styled for dark backgrounds
2026-04-09 18:39:51 +01:00
juanatsap e56a86860f fix: scroll to CV section aligns to top instead of center 2026-04-09 12:56:56 +01:00
juanatsap ded519758b feat: add Google Search Console verification meta tag 2026-04-09 12:37:55 +01:00
juanatsap 6e922fd1cb feat: mobile-first chat layout — split mode, hidden desktop modes, 79 tests
Mobile (≤480px):
- Hide Side Panel, Floating, Full Screen buttons
- Show Split button (50vh vertical split, CV visible above)
- Compact mode: 55vh max bottom sheet
- Force desktop modes to compact if somehow activated
- Disable tooltips on mobile (overflow prevention)
- Tighter header padding

Desktop (>480px):
- Split button hidden, all modes available as before

Tests: 85-chat-mobile.test.mjs — 79 assertions across
iPhone SE (320x568), iPhone 14 (393x852), iPhone 14 Pro Max (430x932),
plus desktop sanity check
2026-04-09 12:21:28 +01:00
juanatsap 5dd845a4b7 feat: add close button to chat header 2026-04-09 11:45:48 +01:00
juanatsap 988f8acb80 fix: welcome message — 'about Juan' instead of 'about this CV' 2026-04-09 11:43:08 +01:00
juanatsap ddb2b843a4 fix: wave fully opaque (outside button), animation plays twice with pause 2026-04-09 11:41:18 +01:00
juanatsap 84d69fa8db feat: wave greeting animation on chat button to attract clicks
Emoji 👋 pops up 3 times with a waving motion (3s delay after page load),
then disappears. Hidden when chat is open.
2026-04-09 11:35:21 +01:00
juanatsap 823030dcf2 test: 38 layout mode tests + fix half/full/float CSS positioning
- Fix side panel and full screen not covering full viewport
- Fix floating mode initial position (near chat button, not top-right)
- Reset width/height inline styles when switching modes
- Add 84-chat-layout-modes.test.mjs: 38 assertions covering
  compact, side panel, full screen, floating, drag, rapid switching,
  and user avatar rendering
2026-04-09 11:09:30 +01:00
juanatsap 8e029d1363 feat: chat UX overhaul — GLM local model, icons, layout modes, instant bubbles
- Add GLM-4.7-Flash as default Ollama model (replaces Mistral)
- Fix WRITE_TIMEOUT (15s→120s) and HTMX timeout (5s→120s) for local LLM
- Auto-warmup model on startup in development mode
- Add /api/chat/status endpoint for model readiness polling
- Show "Initializing AI model..." indicator while model loads
- Add user avatar (mdi:account) on chat messages
- Inject company/project/course sprite icons inline in chat responses
- Replace cramped header icons with 4 icon buttons + tooltips
  (Compact, Side panel, Floating, Full screen)
- Add floating/draggable chat mode with smooth drag support
- Chip questions show user bubble instantly and clear input
- Help modal prefills input instead of auto-sending
- User bubble rendered client-side for immediate feedback
2026-04-09 10:54:23 +01:00
juanatsap d5c90248cc feat: Teams-style chat UX overhaul
Bubbles:
- Teams-style layout: bot avatar (green circle) on left, message beside it
- User messages right-aligned, no avatar (clean, like Teams)
- Rounded bubbles (border-radius: 16px) instead of square
- Distinct corner radii for conversation flow

Navigation:
- Links no longer close the chat — panel stays open for continued navigation
- Added #certifications anchor (alias to courses section)
- Fixed agent instruction to use #courses for certifications references

Theme:
- All colors use CSS variables from _themes.css
- Automatically adapts to light/dark without explicit .theme-clean overrides
- Panel uses --paper-bg (white in light, dark in dark theme)

Size modes:
- 3 discrete toggle buttons: compact, half-screen, fullscreen
- Active state highlighted, direct selection (no confusing cycling)
- Removed chat-half-left (simplified to compact/half/full)

Intelligence:
- React query now returns results (verified: 4 companies + 2 projects + skills)
2026-04-08 17:51:14 +01:00
juanatsap be5fdd03c4 feat: chat avatars + dark theme fix + text overflow fix
Avatars:
- Robot icon (green circle) before each agent message
- Person icon (dark circle) before each user message
- New .chat-bubble wrapper with flex layout for avatar + message

Dark theme fixes:
- Panel background: #1e1e1e (not pure black)
- Agent bubbles: #2d2d2d with light text (not dark/invisible)
- Input area: #2d2d2d (not black)
- Header stays green (--accent-green) in both themes
- Chips, suggestions consistent with panel background

Text overflow:
- overflow-wrap + word-break on messages
- min-width: 0 prevents flex overflow
- User bubble properly right-aligned with avatar
2026-04-08 17:31:07 +01:00
juanatsap 5448c3cf7a feat: resizable chat panel (compact → half-right → half-left → full)
4 size modes cycled via expand button in header:
- Compact: 360px (default, bottom-right corner)
- Half-right: 50vw docked to right edge, full height
- Half-left: 50vw docked to left edge, full height
- Full: 100% viewport overlay

Also fixes text overflow in chat messages (overflow-wrap, word-break).
Messages area expands to fill available height in larger modes.
Size button uses mdi icons: arrow-expand, dock-right, dock-left, arrow-collapse.
CSS transitions for smooth size changes.
2026-04-08 17:24:35 +01:00
juanatsap c44e9e8c67 feat: CV navigation links in chat responses (GPS for the CV)
Agent instruction now requires markdown links to CV anchors:
- Companies: [Olympic Broadcasting](#exp-olympic-broadcasting)
- Projects: [Immich Photo Manager](#proj-immich-photo-manager)
- Sections: [Skills](#skills), [Experience](#experience)

formatResponse converts [text](#anchor) → clickable green links
that close the chat panel, smooth-scroll to the target, and
pulse a green highlight for 2 seconds.

All existing CV anchor IDs used: exp-{companyID}, proj-{projectID},
course-{courseID}, plus section IDs (experience, projects, skills, etc.)
2026-04-08 17:11:22 +01:00
juanatsap 160be31b31 feat: auto-fallback Gemini→Ollama + model warmup on chat open
Dual-provider architecture:
- Both Gemini and Ollama initialize at startup (if configured)
- Primary (Gemini) tried first for every request
- On any error (429, 503, timeout), automatically falls back to Ollama
- No manual switching needed — completely transparent to the user
- Log shows: "Primary failed (gemini: ...), falling back to ollama: ..."

Warmup:
- POST /api/chat/warmup called silently when chat panel opens
- Pre-loads Ollama model in background (10-15s) while user reads welcome
- By the time user types, model is ready for instant response
- Warms up fallback provider specifically (Gemini doesn't need it)

Timeout:
- Agent context increased to 60s (Ollama first response can be slow)
- Each request creates a fresh session (stateless for fallback compat)
2026-04-08 14:57:38 +01:00
juanatsap 4f558ac842 fix: replace Hyperscript with plain JS for chat interactions
The Hyperscript trigger/call commands couldn't reliably trigger HTMX
form submissions or call global JS functions. Moved all chat
interactions to plain JavaScript:

- toggleChatPanel(): open/close panel + icon swap
- sendChatQuestion(q): set input + htmx.trigger(form, 'submit')
- closeChatHelpAndAsk(q): close modal + open chat + send question
- htmx:afterRequest listener clears input after submit

Hyperscript kept only for site-wide patterns (closeOnBackdrop) that
work reliably.

Also: better error message for rate-limited API responses (429).
2026-04-08 14:11:11 +01:00
juanatsap 25ddfff0da feat: redesign help modal with accordion and clickable questions
- Replace flat list with <details>/<summary> accordion (5 categories)
- Questions are clickable: close modal → open chat → send question
- closeChatHelpAndAsk() helper bridges modal and chat panel
- Green accent on category icons and question hover
- Chevron arrows for expand/collapse state
- Dark theme support for all accordion elements
- Compact layout with no wasted space
2026-04-08 14:01:17 +01:00
juanatsap e21418b80e fix: Hyperscript chip submit + comprehensive mascot documentation
Chips:
- Replace broken onclick with Hyperscript: `on click set #chat-input.value
  to '...' then trigger submit on #chat-form` — Hyperscript dispatches a
  native DOM submit event that HTMX intercepts correctly

Documentation (doc/28-AI-CHAT-AGENT.md — complete rewrite, ~544 lines):
- 18 sections covering full mascot feature reference
- Architecture diagram with end-to-end flow (11 steps)
- All 4 component files documented with code patterns
- query_cv tool: 11 section types in tables with examples
- Cross-section search mechanics explained
- Agent intelligence: 8 question-type strategies
- Suggested questions: chip-to-question mapping for both languages
- Design system: CV color tokens, typography, dark theme comparison
- Session management: OOB swap lifecycle
- Security: input/output sanitization, privacy rules
- Testing: 46 Playwright assertions across 25 test groups
- Configuration, dependencies, ADK Go concepts table
2026-04-08 13:49:39 +01:00
juanatsap 16dd150758 fix: restore tooltip, accent-blue colors, fix chip click mechanism
- Restore has-tooltip tooltip-left on toggle button
- Use --accent-blue (#0066cc) as secondary color: header, user bubbles,
  send button, chip hover, input focus — breaks the all-black monotony
- Dark theme uses deeper blue (#003d7a header, #004d99 interactions)
- Fix chip click: replace Hyperscript htmx.trigger() call with direct
  onclick using JS htmx.trigger() — Hyperscript couldn't resolve the
  HTMX global properly
- Remove _chat.css @import from main.css (loaded separately already)
2026-04-08 13:37:32 +01:00
juanatsap c93bfb0450 fix: add cache-busting version to chat CSS link 2026-04-08 13:32:31 +01:00
juanatsap 069d6f860e fix: isolate chat button from fixed-btn stack to ensure right position
- Move chat-widget outside the floating buttons section in index.html
- Remove fixed-btn class from toggle button (was inheriting left-side
  positioning from the button stack's mobile flex layout)
- Chat widget now renders independently just before body-scripts
2026-04-08 13:24:29 +01:00
juanatsap 94976e1c19 feat: help modal, comprehensive intelligence, fix right-side position
Position fix:
- Remove _chat.css @import from main.css (was overriding with old
  left:2rem cached version). Chat CSS now loaded only via head-styles.
- Button confirmed at right:2rem, bottom:6rem (above back-to-top)

Help modal:
- New chat-help-modal.html using same <dialog> pattern as shortcuts
- 6 organized categories: Experience, Technologies, Projects,
  Education, Skills, How it works
- Bilingual EN/ES with example questions per category
- ? button in header opens modal via commandfor/show-modal
- Removed inline help card (modal replaces it)

Intelligence:
- Comprehensive query strategy for 8 question types
- Technology queries always use cross-section search
- Company queries use experience without filter for full listing
- Agent knows CV site is built with Go/HTMX (bonus context)
- Skills report proficiency levels when technology found
2026-04-08 13:15:07 +01:00
juanatsap 795ba88d6f fix: match CV design system, right-side positioning, smarter agent
CSS:
- Button moved to right: 2rem, above back-to-top (bottom: 6rem)
- Uses CV design tokens: --black-bar, --accent-blue, --paper-bg
- Fonts: Quicksand (header), Source Sans Pro (body)
- Tooltip on the left side (tooltip-left class)
- Dark theme uses CV-consistent grays

Intelligence:
- Agent instruction emphasizes exhaustive reporting of ALL matches
- Cross-section search results must not be truncated
- Mentions CV site itself is built with Go when relevant

Tests:
- Updated positioning assertions (right side, x > viewport/2)
- Added 5 intelligence tests: Go cross-section, company count,
  years of experience, React cross-section, Spanish response
- Resilient to API errors (waits for any message, not just user)
- 42 total test assertions
2026-04-08 13:04:47 +01:00
juanatsap 93e33f6496 fix: chat submission and session handling + 37 Playwright tests
- Fix chip auto-submit: use htmx.trigger() instead of native submit
  to bypass browser validation on required field
- Remove required from input (server validates already)
- Fix session_id duplication: use hx-swap-oob to replace single input
- Fix agent context: use background context with 30s timeout instead
  of HTTP request context (prevents premature cancellation)
- Remove redundant close button from header (toggle button handles it)
- Add 83-chat-mascot.test.mjs: 37 tests covering button, panel,
  help card, chips, typed questions, session, Spanish, positioning
2026-04-08 11:31:09 +01:00
juanatsap b0e8e1ced7 feat: evolve chat into CV Assistant mascot with help popup and suggestions
- Mascot identity: robot-happy-outline icon, "CV Assistant" branding
- Help popup: onboarding card explaining what the mascot can do (EN/ES)
- Suggested questions: 5 clickable chips that auto-submit (bilingual)
- Typing indicator: three bouncing dots during agent response
- Icon swap: mascot icon ↔ close icon via Hyperscript class toggle
- Dark theme support for all new elements
- Modular CSS loading in development, chat CSS always loaded separately
2026-04-08 10:49:19 +01:00