Discussion on HTML5 Audio Player with Playlist

Tean

Tean supports this item

Supported

This author's response time can be up to 1 business day.

799 comments found.

Hello I m wondering is it possible to have multiple players in the page? I need this for my site.

Hi!

Yes, multiple players are supported and there is a demo included with multiple players in same page replicating this.

Thanks

I was wondering if this code would work on Google Sites, the old version.

Hello!

Do you have example of a song link?

Rocko

Rocko Purchased

Seeking does not work when loading a single track. Player thinks that the file is not fully loaded, but it actually is. See here: http://gph.is/2gGhJfR

MP3 file is loaded in 1 second, this demo is from my local server.

// Chrome 54 on OSX El Capitan.

Hello!

Does the same issue appears for you here in official demo?

http://www.interactivepixel.net/ccAudioPlayer/index_classic_single.html

If not, I think this must be file encoding, in which case mp3 file need to be encoded using different method.

Dueppel

Dueppel Purchased

Hello,

I purchased the player package a week ago and have been customizing the “HTML5 Audio Player with Playlist”. Great stuff, thank you!

Could not find answers to the following issues in the help file of the package, nor in this support forum.

1) How can I remove the “shuffle play” button & function?

2) How can I disable the automatic starting of the next playlist item at the end of the current item being played? I.e., only play an item if its is clicked in the playlist.

3) If selected, the “replay” (“loop”) button & function only work at the end of the last item in the playlist, not on the item that is currently being played. What I want/need is that the loop-button works at the end of each list item being played, or never. How can I do this?

Thanks for your help!

I fixed one little issue with the demo player html files. If you add content (e.g., a text paragraph) after the last line of code of the player (i.e., between the closing and the in the demo files), then this content does not show up after the playlist (where it should be), but next to the top right-hand corner of the playlist. What is missing is an “alignment clear” statement after the closing :
(note: one could use
but that would be depreciated/old-fashioned HTML).

Dueppel

Dueppel Purchased

Hi Tean,

1) done, perfect – thanks!

2 & 3) Mmmm, that is rather inconvenient. My sound clips are used to test various mechanical teleprinter protocols – which is why looping the same track is extremely desirable. However, if looping a single track is impossible, then the behavior of “classic single player” comes closest. There, you CAN click on any track title and it will get played just ONCE, without auto starting the next track. All I want is the same behavior when I click on a title in the “Default player with playlist” (but of course, with the playlist GUI formatting of the latter). How do I get “classic “player with playlist” to behave like that?

Thanks in advance for your help!

Fred

index_classic_single.html demo just plays a song with api_inputAudio method. This is diifferent from other example because it doesnt load any tracks in the player, it just tells player to play track with info provided. If you want to loop each track and not auto advance to next one I think its best to modify the code to allow for such action.

Dueppel

Dueppel Purchased

With your help, I ended up with the following solution: selected track is played, player stops at end of the track, playlist does not advance to the next track title.

This required the following changes in two .js files.

In “jquery-html5audio.js” (re-minify after making changes):

In line items 1218 + 1225 + 2660 + 3502 + 4462: change autoPlay=true; to autoPlay=false;

Note: in line 1205, leave at default autoPlay=false; such that track still starts playing upon clicking the track title

In “jquery.html5audio.js”

In line 3394: change playlistManager.advanceHandler(1, true); to (0, true) such that the playlist stays on the current title (so the current track can be started again with the play button, i.e., without having to re-click the track title)

Thanks again for your support!

Hi,

I bought this player but seems that when the playlist is a folder the player doesn’t load any content anymore. This worked in the past but not anymore for some reason that I couldn’t figure out. Could you be able to help with this? Thanks!

Hello!

What demo page you are using from the package and what playlist are you trying to load?

Thanks

Hi guys, any way to contact you directly? (It’s not a support request :P) I am trying to get in touch for some time…

Kind regards, Kuba

Hello!

Yes, you can write here: http://codecanyon.net/user/Tean#contact

I did that already ;) No replay… I will try again.

I need this to work on my site and it does not. Can please help me figure this out or give me my money back thank you For your time.

Hello!

Send a message at http://codecanyon.net/user/Tean#contact with a link to your webpage so we can have a look.

Thanks

Im trying to put in the title tag of the html, the current song being played’s title. Is there a function to call ?

<title> <script>currentsong(); </script></title>

kind of like that.

Thank you much. your work is superb.

Hello!

Please renew your item support first and afterwards contact us here: http://codecanyon.net/user/Tean#contact

Hi. Can i use this script with local files?

Hello!

Yes, it can play mp3 offline as well. Server connection is required for some other features like reading audio files from folders or download feature.

Hi,

I keep trying to upload this plugin in wordpress auto upload and it keeps timing out. Even larger plugins aren’t doing this. Then I upload it manually to plugin directory. Go to plugins, and it doesn’t show at all.

Do this with another plugin, shows perfectly both ways (auto upload and manual). What could possibly be problem?

LOL!!!!! You are 100% correct… why… purchased by mistake then. LOL. So is there anyway I can install this on wordpress?

Tean

Tean Author

Maybe uploading the plugin files on your server (in a folder) including the example .html file

Then add it in your pages using an <iframe> http://www.w3schools.com/tags/tag_iframe.asp

Even though now realizing my mistake in thinking it was a wordpress plugin. I do thank you none the less for trying to help. 5 Star support.

ko24be

ko24be Purchased

Hello,

I’m trying to add text underneath the title for every song. Similar to how you see some music playlists with the artist’s name written below each song title.

Can you help me with the coding please?

ko24be

ko24be Purchased

Yes, in my case I want to add a song description underneath the title, just like there is the artist’s name underneath the title name in this example:

http://www.codebasehero.com/files/music-player/demo/

I don’t have my website published/online yet unfortunately.

Tean

Tean Author

You can use this callback in jquery.html5audio.func.js file, and place your logic inside.

function audioPlayerSoundStart(instance, sound_id, counter){
    /* called when current playing sound starts. Returns player instance, sound id, media counter. */
    //console.log('audioPlayerSoundStart: ', sound_id);
}

or this:

function itemTriggered(instance, sound_id, counter){
    /* called when new sound is triggered. Returns player instance, sound_id, media counter. */
    //console.log('itemTriggered: ');
}
Tean

Tean Author

To add an element inside the player, just add some html like:

div id="example"

then inside function above:

function itemTriggered(instance, sound_id, counter){
     jQuery('#example').html("Your description goes here");
}

Of course you have to find a way to change this description for every song.

Thinking about purchasing this, but I have a question. I’m currently using a Flash music player that utilizes an XML playlist along with an XML lyrics list, so that the lyrics to a song display while the song is being played. I’m wondering if your player can be adapted to include this additional feature.

Tean

Tean Author

Hi!

Player doesn’t have lyrics implemented. If this is something that is connected with the song time, this could be implemented additionally with some jquery knowledge.

darrub

darrub Purchased

The player is compatible with icecast server?

Tean

Tean Author

Hi!

It works with shoutcast servers that have .mp3 streaming for example. Basically if your link plays in html5 audio tag: http://www.w3schools.com/html/html5_audio.asp it should work in the player because it uses the same method.

There is the possibility to support google analytics (events) for each song (haw many times played and how long)? (Sorry for English, automatic translation …)

Tean

Tean Author

Hi!

Currently no, but I will consider this option for future updates.

Thanks

Hi, I’m really interested in your product but wondered how easy it is to combine this into a Muse website as I have limited coding knowledge. Thanks

Tean

Tean Author

Hi!

I am not familiar with muse. You need to have basic knowledge of html/css and javascript to put this plugin in your website.

1gagger1

1gagger1 Purchased

Hi, how i can use this plugin if they don’t have admin panel? Where i need download files?

Tean

Tean Author

Hi!

Admin panel is not required. Playlists come in html or xml format which is placed inside a html page.

micronx

micronx Purchased

Hello,

How can I do exactly this example that I send in this link (http://www.anglicanweb.org/soundcloud_player/)

1) Toggle the playllist ? 2 ) player_thumb on left ?

Thanks.

Tean

Tean Author

Hello!

1. There is no official method to toggle playlist, but you could do this on a click of a button:

$('.playlistHolder').toggle();

2. If you add this element inside the player, thumb will automatically be loaded inside it:

div class="player_thumb"><img src="" alt="" />

Of course you need to have data-thumb inside the playlist items:

data-thumb='path/to/thumb/here/'

or if its Soundcloud or Podcast it will be automatic

1gagger1

1gagger1 Purchased

I don’t understand where i need to put\upload folder with player files?

1gagger1

1gagger1 Purchased

So i can’t by one click mount playlist in page. How can I return money for this product back?

Tean

Tean Author

This is juqery plugin and it needs to be implemented in web page in such way. Refund is possible only if the item hasn’t been downloaded.

Tean

Tean Author

Do you understand that you havent purchased wordpress plugin?, this is not wordpress section, you purchased html / css / javascript plugin for static html page.

cocoa1970

cocoa1970 Purchased

I m sorry i bought the wrong version a few minutes ago, I need the one for wordpress please…

5fa8082f-3372-48a9-9284-d4e945ffd31e – 24 Mar 2017 REGULAR LICENSE

by
by
by
by
by
by