MP3 Playlist How To Using Javascript

Questions about applications and software
Forum rules
Before you post read how to get help. Topics in this forum are automatically closed 6 months after creation.
Locked
User avatar
soundchaser59
Level 3
Level 3
Posts: 161
Joined: Tue Sep 20, 2016 1:36 am

MP3 Playlist How To Using Javascript

Post by soundchaser59 »

I'm trying to figure out how to use Javascript to manage an MP3 playlist. Does anyone have any links to sites that have working Javascript examples? I've read some things lately that say jQuery is outdated, although many of the examples I've already found seem to enjoy referring to jQuery. I've tried to emulate some of these examples but I can never get any of them to work right.

Admittedly, Javascript is something I've never had to learn much about in the past, so it's a huge weak spot for me that is long overdue for an update. My html and css seem to be working fine, and I can make a very basic top down playlist in straight html. But I'd like to learn how to have more control over how things play and how the player element handles switching from one song to the next, etc. It's easy to make a list of songs where the surfer stops one tune and plays the next one in the list, scrolling down the page if the list of songs is too long. But (for example) having one player at the top of the page with the ability to hit a previous button or a next button, or ability to automatically switch to the next song in the list if the listener isn't paying attention, that requires something like Javascript to manage.

Is Javascript still the best thing to learn and the best way to handle this? Or are there newer scripts that are just as popular and almost as pervasive?
Last edited by LockBot on Wed Dec 28, 2022 7:16 am, edited 2 times in total.
Reason: Topic automatically closed 6 months after creation. New replies are no longer allowed.
Menard
Level 7
Level 7
Posts: 1729
Joined: Wed May 08, 2019 5:14 am
Location: Angers (France)

Re: MP3 Playlist How To Using Javascript

Post by Menard »

For me a playlist is a folder in which I put the files to play :P if that can help :| :wink:
Linux Mint 20.3 Cinnamon - K 5.15 - Desktop - english
AMD APU A8 7600 - DDR3 1833 MHz 8 GB x2 Dual Channel
--

If you think tough men are dangerous, wait until you see what weak men are capable of.
mikeflan
Level 17
Level 17
Posts: 7097
Joined: Sun Apr 26, 2020 9:28 am
Location: Houston, TX

Re: MP3 Playlist How To Using Javascript

Post by mikeflan »

What is the attraction to Javascript? Are you trying to embed this into a webpage? Maybe it is best to describe your goal.
User avatar
soundchaser59
Level 3
Level 3
Posts: 161
Joined: Tue Sep 20, 2016 1:36 am

Re: MP3 Playlist How To Using Javascript

Post by soundchaser59 »

mikeflan wrote: Sun Apr 11, 2021 7:26 am What is the attraction to Javascript? Are you trying to embed this into a webpage? Maybe it is best to describe your goal.
Just because javascript is what all the programmers I work with use and know best. One of my questions is if there is some other code or script that will do this same task.

I have all of my mp3 files in a folder on my own hosted web site. I want to make a web page that wil let listeners listen to all of the tunes in the folder. The example I saw on another site had the player at the top with the usual controls like start, pause, stop, and previous and next buttons just below to navigate to the previous song or the next song. If the current song plays to the end then the player automatically switches to the next song in the list.

The list of songs is displayed below the player. If the listener scrolls down the page, the player div remains visible at the top at all times while the list of songs below scrolls. If the listener clicks on one of the songs in the list, that song will be loaded and played by the player. If the player automatically plays thru the entire list of songs (maybe 15 mp3 files) then it will stop after the last song finishes.

I can make the list appear on the page just using straight html. But then the listener has to manually stop one song playing and start the next song playing, there is nothing automatic about it, no way to make it play thru the list of songs automatically as an "unattended player." I have an example of javascript that puts the mp3 files in an array, but I can't get the example to work with my html page. I have tried many different ways of referencing the script, and even wondered if it requires jquery to work. I just don't know enough about javascript to make it all tie together.

Would some other script or some other code make this all easier to do?
mikeflan
Level 17
Level 17
Posts: 7097
Joined: Sun Apr 26, 2020 9:28 am
Location: Houston, TX

Re: MP3 Playlist How To Using Javascript

Post by mikeflan »

The first link here is perhaps what you want:
https://duckduckgo.com/?q=serve+mp3+fil ... ite&ia=web

That is the simple way to do it, and I like simple.
I have not done it, so can't really comment.
User avatar
soundchaser59
Level 3
Level 3
Posts: 161
Joined: Tue Sep 20, 2016 1:36 am

Re: MP3 Playlist How To Using Javascript

Post by soundchaser59 »

mikeflan wrote: Sun Apr 11, 2021 7:24 pm The first link here is perhaps what you want:
https://duckduckgo.com/?q=serve+mp3+fil ... ite&ia=web

That is the simple way to do it, and I like simple.
I have not done it, so can't really comment.
That is definitely simple. Unfortunately that example only loads one mp3 file into the audio player, with no way to list tunes or select other tunes. Unless maybe I'm getting the wrong example, maybe the search results were sorted differently on my screen than on yours.

Here is an example of what I'm aimimg for. But this example is canned and was created by using an online tool in trial mode. I don't have possession of the code or the script. The site wants people to try it and then subscribe for a monthly fee in order to get unlimited use of their tool. The player is actually created and hosted on their server, not mine, and all they do is provide the embed code to use to load the player on your web page after you upload the files to their hosting site. Not what I want, but it does let you see an example of a playlist player that I'm talking about.

Soundchaser list player example
User avatar
murray
Level 5
Level 5
Posts: 784
Joined: Tue Nov 27, 2018 4:22 pm
Location: Auckland, New Zealand

Re: MP3 Playlist How To Using Javascript

Post by murray »

Maybe try finding a jQuery plugin that does what you want? Here's a few: 10 Best jQuery Audio Player Plugins
Running Mint 19.3 Cinnamon on an Intel NUC8i5BEH with 16GB RAM and 500GB SSD
Locked

Return to “Software & Applications”