gem-hunter

A client-side horoscope dashboard built with vanilla JavaScript ES modules, using a locally fetched JSON data source. Features a zodiac sign grid, daily horoscope display, Big Three generator, compatibility checker, favorites toggling with persistence, and sign search.

python3 -m http.server 4040

Open: http://localhost:4040

// Component: ZodiacGrid
// Input: { signs, favorites, onSelectSign, onToggleFavorite }
// Output: DOM nodes mounted inside `container`
// Events: onSelectSign(sign) — called when user clicks a sign card
//         onToggleFavorite(sign) — called when user clicks the heart
// Dependencies: none

• Loading — spinner message shown in grid while data.json is being fetched
• Error — user-friendly error message with a Retry button that re-triggers the load without a page refresh
• Empty — "No signs match…" message when search returns zero results
• Success — zodiac grid, horoscope box, and all controls rendered

• Zodiac sign grid with live search filtering
• Daily horoscope display (reading, mood, lucky color, lucky number, moon phase)
• Favorites toggling with heart icons — persisted to localStorage across page refreshes
• Big Three generator (Sun sign by date range; Moon and Rising are approximate)
• Compatibility checker with individual scores for all 66 sign pairs (love, friendship, communication)

• Timeout — requests are automatically cancelled after 8 seconds via AbortController
• Stale-request cancellation — a new load aborts any previous in-flight request
• Structured error messages — distinct messages for timeout, stale, network, HTTP, parse, and validation failures
• Data validation — top-level JSON shape and all horoscope entries are validated before state is updated

• Total structured test cases: 14
• Categories covered: success, edge, and failure
• Features covered: zodiac grid / horoscope, Big Three generator, compatibility checker, favorites, search/filter, responsive layout
• Bugs fixed: 5

all 14 test cases now pass after the fixes | Pass rate: 14/14 (100%)

• Moon and Rising sign calculations are approximate and simplified for this project
• Compatibility data is based on static local JSON rather than a live service
• The project is fully client-side and depends on local data files

https://megluc.github.io/final-zodiac-app/