How lingshanli99999/soundcare_h5 works
SoundCare H5 is a browser-based wellness music app. Users start from the home page, choose a scene or describe a need, generate music with manual or AI-assisted settings, then play it while viewing simulated HRV feedback; profile information is documented as static mock data. The graph follows documented routes and sampled API, store, and player behavior. Home, AI-generation, and API wiring beyond the supplied excerpts is represented only where the README supports it.
Main entry points: index.ts Page router · PlayerView.vue Music player · AiGenerateView.vue AI generation · GenerateView.vue Manual generation
Components 18
App navigation
- App bootstrap
src/main.ts - App shell
src/App.vue - Page router
src/router/index.ts - Home and scenes
src/views/HomeView.vue - Profile mock
src/views/ProfileView.vue
Music generation
- Manual generation
src/views/GenerateView.vue - AI generation
src/views/AiGenerateView.vue - Music API
src/api/music.ts - Prompt API
src/api/llm.ts
Playback wellbeing
- Music player
src/views/PlayerView.vue - HRV state
src/stores/hrv.ts - HRV calculations
src/utils/hrv.ts
API and persistence
- Music state
src/stores/music.ts - Browser storage
src/utils/storage.ts - HTTP client
src/api/client.ts
Other components
- User
- SoundCare backend
- Browser audio
Connections 29
- User → Home and scenes: opens app
- App bootstrap → App shell: mounts
- App bootstrap → Page router: installs
- App shell → Page router: renders routes
- Page router → Home and scenes: dispatches
- Page router → Manual generation: dispatches
- Page router → AI generation: dispatches
- Page router → Music player: dispatches
- Page router → Profile mock: dispatches
- Home and scenes → Manual generation: opens scene
- Home and scenes → AI generation: opens prompt
- Home and scenes → HRV state: reads mock HRV
- Manual generation → Music API: requests music
- Manual generation → Music state: saves result
- Manual generation → Music player: navigates
- AI generation → Prompt API: optimizes prompt
- AI generation → Music API: requests music
- AI generation → Music state: saves result
- AI generation → Music player: navigates
- Music API → HTTP client: posts request
- Prompt API → HTTP client: posts request
- HTTP client → SoundCare backend: sends API calls
- Music player → Music state: loads track
- Music state → Browser storage: reads and writes
- Music player → Browser audio: plays track
- Music player → HRV state: updates feedback
- HRV state → HRV calculations: calculates metrics
- User → Manual generation: sets parameters
- User → Music player: controls playback