How bodhisattva-duduka/viibe-music-player works
Viibe is a client-side music player with a playlist-browsing workflow: the user opens the main page, the playlist controller reads the local playlist catalog, and selecting a track connects it to browser audio playback. Playback controls provide play/pause, seeking, and volume; the README also documents skip and replay. The repository includes a separate player page and a music-animation showcase. Source excerpts are partial, so uncertain event wiring and the implementation of documented skip/replay behavior are not shown as separate components.
Main entry points: script.js Playlist controller · index.html Main page · musicPlayer.html Player page · musicPlayer.js Player controls
Components 15
Playlist catalog
- Playlist controller
script.js - Playlist data
playlists.json - Track files
Bollywood songs
Main player
- Main page
index.html - Browser audio
index.html - Playback controls
script.js
Standalone player
- Player page
musicPlayer.html - Player controls
musicPlayer.js - Player audio
musicPlayer.html
Presentation
- Playing animation
musicPlayingAnimation.html - Main styles
style.css - Player styles
musicPlayer.css - Player animation
musicPlayingAnimation.html - UI assets
assets
Other components
- Listener
Connections 16
- Listener → Main page: opens
- Main page → Playlist controller: loads
- Playlist controller → Playlist data: fetches
- Playlist controller → Main page: renders playlists
- Listener → Playlist controller: selects track
- Playlist controller → Track files: selects audio
- Playlist controller → Browser audio: sets source
- Listener → Playback controls: uses controls
- Playback controls → Browser audio: controls playback
- Listener → Player page: opens
- Player page → Player controls: loads
- Player controls → Player audio: controls playback
- Listener → Playing animation: views
- Main page → Main styles: uses styles
- Player page → Player styles: uses styles
- Main page → UI assets: uses assets