Published on

Welcome to the Groove

Last Modified on
Last modified on
Welcome to the Groove
Photo by Maria D. Campbell on Interglobalmedia


Welcome to the Groove is an audio player app backed by a JS object called Jukebox with methods to play, stop, and load songs. It is an audio player in the form of a jukebox created with ES6 JavaScript, HTML5 Audio, OOP, and includes a search-in-text searchbar.

Metadata is extracted from audio files, a progress bar with a thumb slider which displays the duration of songs, and is synched to the audio's current time.

The app build is based on OOP (Object Oriented Programming), and I created all the elements on the page (except the body element, which I needed in order to be able to append all other elements to the DOM) using the JavaScript document.createElement() method along with the help of other built-in methods such as setAttribute(), appendChild(), classList.add().

There is also a search input and more.

Project Includes

object oriented javascript, web audio api, metadata, progress bar, thumb slider, search