How xtpm/cloverslove works
cloverslove is a personal, title-screen-style website. A visitor navigates its sections to view profile and activity, browse live GitHub repositories and README summaries, explore socials, and change settings. The browser app also manages the animated background, music, and synthesized menu sounds. A scheduled Cloudflare Worker records Spotify listening history in KV for the site to display. The main browser file is only partially excerpted, so documented capabilities are included, but uncertain internal call relationships are omitted.
Main entry points: main.js Site and navigation · index.js History API and recorder · sfx.js Menu sound effects · video Background media
Components 17
Browser experience
- Site and navigation
main.js - Settings and preferences
main.js - Menu sound effects
sfx.js - Background media
public/assets/video - Background music
public/assets/music/background.mp3
Profile and discovery
- About and activity
main.js - Repository browser
main.js - Repository summaries
main.js - Social links
main.js
Listening history
- Listening history view
main.js - History API and recorder
worker/src/index.js - Workers KV history
worker/src/index.js
External services
- Lanyard presence
- GitHub API
- GitHub raw README
Other components
- Visitor
- Cloudflare scheduler
Connections 16
- Visitor → Site and navigation: navigates
README.md - Site and navigation → Settings and preferences: manages
README.md - Site and navigation → Menu sound effects: plays
main.js - Site and navigation → Background media: uses
README.md - Site and navigation → Background music: uses
README.md - Site and navigation → About and activity: renders
README.md - Site and navigation → Repository browser: renders
README.md - Site and navigation → Social links: renders
README.md - Repository browser → GitHub API: fetches repositories
main.js - Repository browser → Repository summaries: opens summary
main.js - Repository summaries → GitHub raw README: fetches README
main.js - About and activity → Lanyard presence: fetches presence
main.js - History API and recorder → Lanyard presence: checks listening
worker/src/index.js - History API and recorder → Workers KV history: reads and writes
worker/src/index.js - Cloudflare scheduler → History API and recorder: triggers recording
worker/src/index.js - Listening history view → History API and recorder: fetches history
main.js