zen-audio-player / zen-audio-player.github.io

Listen to YouTube videos, without the distracting visuals.
https://zen-audio-player.github.io/
MIT License
229 stars 180 forks source link

#229 Playlist that shows history, no repeats #336

Closed k----n closed 3 years ago

k----n commented 4 years ago

Description

This PR adds playlist functionality with history that is clearable. The history does not include repeats and saves up to the last 30 songs in the browser's cache. The song at the top of the history playlist is the song that is being currently played. Click on any song in the history playlist to play the song.

The URL with the video id will be updated when the song is played using https://github.com/browserstate/history.js/. The search bar is also updated with the video id.

This is the first step towards creating a playlist to queue songs. In order to actually have a playlist that queues songs, I would some refactoring so that the search functionality does not refresh the page. This can be achieved with https://github.com/browserstate/history.js/.

Unfortunately, I do not have very much time at the moment to add queue functionality, but feel free to help out and contribute.

P.S. I also added 'npm run css-fix' to package.json which tries to fix stylelint errors.

Types of changes

What types of changes does your code introduce? Check all the boxes that apply:

Final checklist:

Go over all the following points and check all the boxes that apply
If you're unsure about any of these, don't hesitate to ask. We're here to help!

k----n commented 4 years ago

@shakeelmohamed I think we can ignore the code climate issues. They are CSS issues.

First issue is not having a fallback for 'rgba' in the CSS. However, with stylelint it is an error when you have duplicate attributes (e.g. 2 backgrounds).

Second issue is with CSS properties not being in alphabetical order. But it seem like it matters if the attribute starting with '-' is at the beginning or end.