We apologize for the interruption. However, seabreezecomputers.com has been offering free tools and downloads for many years. Unfortunately, server expenses are now starting to exceed revenue earned. If you appreciate the free tools and downloads at seabreezcomputers.com please consider making a donation.

Quick Jump
How to Use
How it Works
Off Screen DIV
Detect Browser
Load a Song
Object Tag
Embed Tag
Quicktime Functions
Quicktime MP3 ID3 Tag
Media Player Functions
Media Player ID3 Tag
Links
Javascript Progress Bar
Javascript Find on Page
Javascript Slideshow with Crossfade
Javascript or PHP Photo Gallery
Royalty Free Music at No Charge
Download Music Legally
Home Page

: Off
Volume:

Time:

NEW!! 12/19/2014!! Ths script on this page is outdated. Please check out the new Cool Audio Player Script for Javascript or PHP at http://www.seabreezecomputers.com/audio/

Features

7/29/2014: Version 1.4c: Audio was not playing in Kindle Fire's Silk browser because the user agent for Silk did not have "Android" in it. But it did have "Silk" in the user agent, so changed line 305 of the script to detect "silk" in the user agent string so that audio now plays in Amazon Kindle Fire Silk browsers.
5/1/2013: Version 1.4b: Fixed minor HTML5 volume control bug and Chrome for Android would not play audio unless HTML5 load() and play() were added to the code. Note: for HTML5 audio in Chrome for Android you must use Chrome version 25 or newer. To check the version go type: chrome://version in Chrome address field.
4/18/2013: Version 1.4: New! Now the player works with iOS, iPhone, iPad, iPod and Android devices using HTML5 audio tag. All the controls work except for Apple iOS and Android does not allow volume control in javascript so the volume and therefore FadeOut does not work. So on phones and tablets the volume is controlled by the rocker volume control on the device. Chrome also uses the audio tag now. So now this player has been tested to work with Internet Explorer, Firefox, Chrome, Safari, Opera, Netscape, iOS and Android.
3/20/2013: Version 1.2c: Now the current volume is saved between songs with a variable named current_volume
8/18/11: Created a version (1.3) which has individual play buttons for each song. Try this link if you need the version with individual play buttons.
9/18/09: Version 1.2b: Added window.onunload = stop_song; to bottom of sound.js to prevent IE 7 and 8 from having an error when refreshing the page because setTimeout was continuing to call display_time() function.
5/30/09: Version 1.2: Added 'px' to all style top, left width and height numbers to be compatible with doctype strict. Also converted html tags to lowercase to be compatible with xhtml.
New as of 7/12/2008: Added Shuffle button.
Javascript .mp3 and .mid player in Internet Explorer, Netscape, Mozilla Firefox, Safari and Opera.
Instead of using default windows media player controls or default Quicktime controls, you can make your own custom controls.
Easily create a playlist of MP3 music files.
Full Play, Stop, Pause, Rewind, Fast-Forward, Volume, Previous Song, Next Song and Fade Out controls for most browsers including IE 6.0+, Netscape 7.1+, Firefox 1.5+ and Opera 9+.
Play, Stop, Previous Song and Next Song controls for Safari and other older browser versions.
Automatic playback of next song in playlist in most browsers

How to Use

dlc_b
Download
Download
sound.js

Downloaded 0 times.

Please make a donation to reveal the download link.
Copy the following textbox and paste it just before </HEAD> in your HTML document:
<script type="text/javascript" language="JavaScript" src="sound.js"> </script>
Copy the following textbox which contains the player controls which can be customized and paste it in the body of your HTML document where you want the player controls to appear:
 <div style="border: 1px solid black; width: 340px; padding: 5px;"> <button onclick="play_song();" id="play_btn">Play</button> <button onclick="pause_song();" id="pause_btn">Pause</button> <button onclick="stop_song();" id="stop_btn">Stop</button> <button onclick="fade();" id="fade_btn">Fade Out</button> <span id="fade_display">: Off</span> <br> <button onmousedown="volume(1);" onmouseout="volume(3);" onmouseup="volume(3)" id="vol_left"><</button> Volume: <span id="vol_display"> </span> <button onmousedown="volume(2);" onmouseout="volume(3);" onmouseup="volume(3)" id="vol_right">></button> <button onclick="next_song(1);" id="next_btn">Prev Song</button> <button onclick="next_song(2);" id="next_btn">Next Song</button> <br> <button onclick="fast_reverse();">Rewind</button> <button onclick="fast_forward();">Fast Forward</button> <button onclick="shuffle();">Shuffle</button>  <div id="songname"><br></div> <div id="songtime" style="float: left;">Time:</div> <div id="speed" style="float: right;">1X</div> <div id="message" style="border: 1px solid black; height: 50px; width: 330px; padding: 5px; margin: 1px; clear: both"></div> </div>
For the Playlist make an invisible textarea in the BODY of your HTML document like the one below with each mp3 listed on a seperate line. Make sure the textarea has the id songlist:
 <textarea id="songlist" style="visibility:hidden"> more.mp3 peace.mp3 foralltheliveslost.mp3 nevercompletely.mp3 Heartwarming.mp3 </textarea>
or an easier way to make the playlist is to click on the following batch file and save it to your hard drive in the folder that contains the mp3 and mid files you want in the playlist: dlc_b
Download
Download
songs.bat

Downloaded 0 times.

Please make a donation to reveal the download link.

It will create a file called songs.txt which will contain the textarea element along with all your songs. Then paste the information from songs.txt into the body of your HTML document.
If you are putting your songs in a different folder from your INDEX.HTML file then edit sound.js and change the folder variable from var folder = ''; to var folder = 'music/'; where music is the name of the folder that holds the mp3 files.

How it Works

songs.bat

songs.bat contents looks like the following: @echo off set filename=%1 if %1.==. set filename=songs.txt echo ^<textarea id="songlist" style="visibility:hidden"^> > %filename% dir /b /od *.mp3 *.mid >> %filename% echo ^</textarea^> >> %filename% echo All the mp3 and mid files from this folder are now listed in %filename% pause

You can edit the batch file if you wish. The important line is:

dir /b /od *.mp3 *.mid >> %filename%

There you can add more file types if you wish. It basically uses the dir command in basic listing mode /b and orders the list by date /od. You can change the sort method to order by name (alphabetic) by replacing /od with /on. See the dir command help for more options. (Click on Start -> Run. Type in cmd and press ENTER. Type in dir /? and press ENTER.)

Note: Windows Media Player will play .WMA files, but Quicktime Player (which Firefox, Safari and Opera uses), will NOT play .WMA files.

Quicktime vs. Windows Media Player

These Javascript functions use Windows Media Player for Internet Explorer and Netscape, but use Quicktime for Firefox, Safari, and Opera. Here are the reasons:

Internet Explorer: Since Internet Explorer and Windows Media Player are both made by Microsoft I thought it fitting to use Windows Media Player. However, Internet Explorer 6.0 and above seems to have full control over Quicktime as well as Windows Media Player in the browser.
Netscape: The Netscape browser does not seem to allow you to control Quicktime with Javascript controls such as document.embeds['sound'].Play(); therefore I used Windows Media Player because Netscape can control it with Javascript.
Firefox: Firefox 1.5 can't control Windows Media Player with Javascript, but it can control Quicktime.
Safari: The Safari browser can't seem to control Windows Media Player or Quicktime with Javascript. Go figure, since Quicktime and Safari are both made by Apple. Since Quicktime is made by Apple I decided that I would use that player.
Opera: Opera can control Quicktime with Javascript but it cannot control Windows Media Player.

Off Screen DIV

If we were to create an invisible DIV then the contents of the DIV can't be played and therefore don't work. Also in many browsers, for some reason we don't have access to Javascript media player controls if we tell the media player to make itself invisible. So to solve both of these problems and to not display either the Quicktime or Windows Media Player default players we just place them off screen by creating an offscreen DIV to hold the player as follows:

// Make a DIV to hold the player and place it off the screen
// so that we don't see it
document.write('<DIV ID="player"'
+ 'style="position:absolute;left:-1000px;top:-1000px"'
+ '></DIV>');

Detect Browser

To detect the browser so we can put the correct media player in the player DIV we use the following function:

function detect_browser()
{
var browser_name = navigator.userAgent;
// We have to check for Opera first because
// at the beginning of the userAgent variable
// Opera claims it is MSIE.

if (browser_name.indexOf("Opera")!= -1)
browser_name = "Opera";
else if (browser_name.indexOf("Firefox")!= -1)
browser_name = "Firefox";
else if (browser_name.indexOf("MSIE")!= -1)
browser_name = "MSIE";
else if (browser_name.indexOf("Netscape")!= -1)
browser_name = "Netscape";
else if (browser_name.indexOf("Safari")!= -1)
browser_name = "Safari";

return browser_name;

} // end function detect_browser()

Load A Song

Then we use the following function to create the player and load the song:

Object tag

The object tag has the following properties to specify which player to use: CLASSID, CODEBASE, STANDBY and TYPE.

CLASSID="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" specifies windows media player 7 or later.

CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" specifies Quicktime.

CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" specifies where to download the activex control for windows media player for the browser if they do not have it.

CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab" specifies where to download the activex control for the quicktime player for the browser if they do not have it.

STANDBY="Loading Microsoft� Windows� Media Player components..." specifies the text to write to the screen while the media player control is being downloaded.

TYPE="application/x-oleobject" specifies that we are loading a Windows Media player activex object.

<PARAM name="TYPE" VALUE="audio/wav"> specifies that we are loading audio wav or mp3 files for quicktime. (Note: Windows Media Player will support .WMA audio files, but Quicktime will not play .WMA audio files.)

Embed tag

The embed tag has the following properties to specify which player to use: CLASSID, TYPE and PLUGINSPAGE.

CLASSID="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" specifies windows media player 7 or later.

CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" specifies Quicktime.

pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" specifies where they can download Windows Media Player if they do not have it.

pluginspage="http://www.apple.com/quicktime/download/" specifies where they can download Quicktime if they do not have it.

type="application/x-mplayer2" tells the browser we are loading windows media player activex controls.

type="audio/wav" tells the browser we are loading wav or mp3 files with quicktime.

To support Safari and older versions of browsers that don't support the control of media players in the browser using Javascript we have included the commands to autostart the song. The function load(media) is called when the user presses the Play button.

Javascript Controls

Quicktime

In order to control quicktime with Javascript, the following must be included in the embed statement:

enablejavascript="true"

Also notice that we have included both ID="sound" and NAME="sound" for the Quicktime player embed statement. If we only had the ID="sound" identifier then we would still be able to control the Quicktime Player by using document.embeds['sound']. We could use functions such as the following to control the music:

document.embeds['sound'].Stop(); // Pause
document.embeds['sound'].Play(); // Play
document.embeds['sound'].GetVolume(); // Get Volume Level
document.embeds['sound'].SetVolume(x); // Set Volume from 0 to 256(loudest)
document.embeds['sound'].GetTime(); // Get Current Time in song
document.embeds['sound'].GetDuration(); // Get Duration of song
document.embeds['sound'].GetTimeScale(); // Get TimeScale

(NOTE: The time scale of Quicktime songs is not always in seconds. To convert the current time and current duration of the song to minutes:seconds, here is the formula:

time = document.embeds['sound'].GetTime();
duration = document.embeds['sound'].GetDuration();
scale = document.embeds['sound'].GetTimeScale();
time = Math.floor(time*(1/scale)); // convert to seconds
duration = Math.floor(duration*(1/scale)); // converts to seconds
// convert seconds into mm:ss
mins = Math.floor(time / 60);
secs = time - (mins * 60);
time = mins + ':' + secs;
mins = Math.floor(duration / 60);
secs = duration - (mins * 60);
duration = mins + ':' + secs;

Since we also include NAME="sound" in the Quicktime embed statement, we are also able to control the player with document.sound. We could use functions such as the following to control the music:

document.sound.Stop(); // Pause
document.sound.Play(); // Play
document.sound.GetVolume(); // Get Volume Level
document.sound.SetVolume(x); // Set Volume from 0 to 256(loudest)

For a complete list of Quicktime Javascript Controls go to:

http://developer.apple.com/documentation/QuickTime/Conceptual/QTScripting_JavaScript/index.html#//apple_ref/doc/uid/TP40001526

MP3 ID3 Tag info

Quicktime includes a way to get the artist name and song title from the MP3 ID3 tag using javascript:

song_title = document.sound.GetUserData('�nam');
song_artist = document.sound.GetUserData('�ART');

At first I thought these functions did not work because they kept returning null. I finally realized that they did work but I was calling them too quickly after loading the song. Quicktime has to load most of the mp3 music file before it can tell you the ID3 tag information. So now the display_info() function in sound.js calls itself again if the above functions return null:

song_title = document.sound.GetUserData('�nam');
song_artist = document.sound.GetUserData('�ART');
/* Quicktime has a problem of not being able to load
the song name and artist until most of the song is
loaded, so if song_title == null we need to call this
function again in a few milliseconds */
if (song_title == null)
{
setTimeout('display_info();', 250);
return;
}

Windows Media Player

Windows Media Player 7 and later is controlled from javascript with document.sound.controls and document.sound.settings and document.sound.network. So we have access to functions such as the following:

document.sound.controls.stop(); // Stop
document.sound.controls.play(); // Play
document.sound.controls.pause(); // Pause
document.sound.settings.volume; // Get volume level
document.sound.settings.volume = x; // Set volume from 0 to 100 (loudest)
document.sound.network.bufferingProgress; // Buffering Progress from 0 to 100
document.sound.playState; // Play state of current song
document.sound.controls.currentPositionString; // Current position in minutes:seconds
document.sound.currentMedia.durationString; // Duration of song in minutes:seconds

MP3 ID3 Tag Info

Windows Media Player also includes javascript functions to get the song title and song artist from the MP3 ID3 Tag:

song_title = document.sound.currentMedia.getItemInfo('Title');
song_artist = document.sound.currentMedia.getItemInfo('Author');

For a complete list of Windows Media Player Javascript controls go to:
http://msdn2.microsoft.com/en-us/library/bb249349.aspx

Also go to:
Media Player Controls Object
Media Player Media Object
Media Player Network Object
Media Player Settings Object

((( spellific )))
Practice spelling while playing a fun word game!
Click here to play

Speech Recognition Anywhere

Type emails with your voice
Write documents with your voice
Control the Internet with your voice
Chrome Extension

Reconocimiento de voz en cualquier lugar

Escribe correos electrónicos con tu voz
Escribe documentos con tu voz
Controla la Internet con tu voz
Extensión de Chrome

Spracherkennung Allerorts

Geben Sie E-Mails mit Ihrer Stimme ein
Schreiben Sie Dokumente mit Ihrer Stimme
Steuern Sie das Internet mit Ihrer Stimme
Chrome-Erweiterung

Reconnaissance de la parole

Tapez des e-mails avec votre voix
Écrivez des documents avec votre voix
Contrôlez l'Inernet avec votre voix
Extension Chrome

Riconoscimento vocale ovunque

Digita e-mail con la tua voce
Scrivi documenti con la tua voce
Controlla Internet con la tua voce
Estensione Chrome

どこでも
音声認識

あなたの声で文書を書く
あなたの声でメールを入力してください
音声でインターネットをコントロール
Chrome拡張機能

语音识别
无处不在

用你的声音写文件
用您的声音输入电子邮件
用你的声音控制互联网
Chrome 扩展程序

語音識別
無處不在

用你的聲音寫文件
用您的聲音輸入電子郵件
用你的聲音控制互聯網
Chrome 擴展程序

Back to www.seabreezecomputers.com

f Share
-

G+ Share
-

Tweet
-

in Share
-

P in it
-

Speech Recognition Anywhere

Type emails with your voice
Write documents with your voice
Control the Internet with your voice
Chrome Extension

Reconocimiento de voz en cualquier lugar

Escribe correos electrónicos con tu voz
Escribe documentos con tu voz
Controla la Internet con tu voz
Extensión de Chrome

Spracherkennung Allerorts

Geben Sie E-Mails mit Ihrer Stimme ein
Schreiben Sie Dokumente mit Ihrer Stimme
Steuern Sie das Internet mit Ihrer Stimme
Chrome-Erweiterung

Reconnaissance de la parole

Tapez des e-mails avec votre voix
Écrivez des documents avec votre voix
Contrôlez l'Inernet avec votre voix
Extension Chrome

Riconoscimento vocale ovunque

Digita e-mail con la tua voce
Scrivi documenti con la tua voce
Controlla Internet con la tua voce
Estensione Chrome

どこでも
音声認識

あなたの声で文書を書く
あなたの声でメールを入力してください
音声でインターネットをコントロール
Chrome拡張機能

语音识别
无处不在

用你的声音写文件
用您的声音输入电子邮件
用你的声音控制互联网
Chrome 扩展程序

語音識別
無處不在

用你的聲音寫文件
用您的聲音輸入電子郵件
用你的聲音控制互聯網
Chrome 擴展程序

User Comments

There are 89 comments.

Displaying first 50 comments.

1. Posted By: tvradio - radiofono1@gmail.com - April 10, 2008, 3:17 pm

Thank you for the code of cool mp3 player.

With a little modification, we can listen a list mp3 of esnips using your coolmp3 player.
Here is an example i made:
http://www.filefactory.com/file/8f29de

( A little problem is that is starts play from 2nd song
and then, by using the NextSong button. Then it plays normaly)
------------
About embed media-player in firefox without using quicktime, here is a solution i have use in my webpage:
i use: http://users.otenet.gr/~tvradio/javaplayer3.js
that plays mp3 using: playmedia(times,height,width,"songname")
----------
If it is possible, please remake your sound.js to be compatible with firefox, without using quicktime.
------------
Thanks again.
Koltsidas Michael
Greece

2. Posted By: tvradio - radiofono1@gmail.com - April 12, 2008, 1:40 pm

Good job, Thank you.
I experimented with your javaplayer. It plays only in internet explorer.

I tried and made a firefox-javaplayer that plays a list of esnips-songs.(http://www.esnips.com)

My player can be found at http://users.otenet.gr/~tvradio/javajampa2.html

It has an array of 300 song-IDs from esnips, then adds the time-function to allow direct playing songs in mediaplayer, reading from esnips. I know about nothing for java, but i try it.

If anybody wants, he can improve it. You can use free my code.

Koltsidas Michael
(newby in java)
radiofono1@gmail.com
http://users.otenet.gr/~tvradio

3. Posted By: True_mesiash - - May 4, 2008, 7:50 am

I'm trying to use this script on my ActiveDesktop. And I'm getting error that looks something like this:

"There was error in the script on this page
Line: 1
Sign: 1
Error: Object expected
Code: 0

URL: file//

Do you want to continue using scripts on this page?
YES | NO"

[translation from my native language]

In the Script I've removed parts that show ID3 Tag and time. [there were errors there]

Java scripts are not my strong side.
Please help.

using IE7 but i think Active desktop might still use IE6.

4. Posted By: prachi - - May 13, 2008, 4:21 am

Good work..It has helped a lot for developing my own jukebox. But, the problem I find in this is that it does not play songs continously. i.e one after another..If possible, please help in doing that

5. Posted By: ranjeet - - July 10, 2008, 2:52 pm

I checked above code, it played only one song and stopped , it does not go automatically, i was looking player, which play online mp3 song automatically and randomly like offline radio.

Please please help for this issue please.

my email address is : randassy@yahoo.com

6. Posted By: Ross - - September 3, 2008, 4:27 am

Have to say huge thanks! This is exactly what I was looking for and testing for me so far in firefox has worked to perfection. Great job.

7. Posted By: ameet topare - - September 8, 2008, 5:41 am

i am getting the value of sound as 0 using document.embeds['sound'].GetVolume(); or
document.getElementById('sound').getVolume()

8. Posted By: Josh - - September 26, 2008, 2:09 pm

I tried to use the code in an aspx page, and added the tags to the page. When viewing the page in Firefox it plays the song for about a second, and then stops. any help on this would be much appreciated. Thanks.

9. Posted By: Josh - - September 26, 2008, 2:11 pm

I tried to use the code in an aspx page, and added the "form" tags to the page. When viewing the page in Firefox it plays the song for about a second, and then stops. any help on this would be much appreciated. Thanks.

10. Posted By: kl - - November 17, 2008, 10:39 am

is there any way to hide the player and just have the buttons?

11. Posted By: KL - - November 17, 2008, 11:06 am

nevermind, figured out if you add the dimensions in the sound.js file to width="0" height="0" nothing shows up. Not sure how this is cross browser.

But I also have a second question. Is there a way to just have one button that when you click it plays and when you click again, it stops playing?

view here what i'm trying to do...
http://www.peterprimamore.com/aboutpeter

12. Posted By: Jeff - - November 17, 2008, 5:59 pm

Change the play_song() function in sound.js to the function below and then the Play button will become both a play button and a stop button:

function play_song()
{
// Check to see if current song has stopped
if (document.getElementById('player').innerHTML == '')
{
load(media);
setTimeout('display_time();', 1000);
setTimeout('display_info();', 1000);
display_song();
document.getElementById('play_btn').innerHTML = "Stop";
}
else // otherwise stop it and change button text
{
stop_song();
document.getElementById('play_btn').innerHTML = "Play";
}
} // end function play

Jeff
www.seabreezecomputers.com

13. Posted By: amadzay - - November 27, 2008, 9:40 am

how is it possibile, if the song1 in page1 is finished it goes automatically to page2 and plays song2 and so on..

thanks

14. Posted By: Jeff - - November 28, 2008, 11:53 am

The answer is in the function display_time()

Look toward the bottom of display_time() function and change:

// This is for Firefox
if (time == duration) // if at end of song
{
next_song(2); // then play next song in playlist
return;
}
// This is for Ie
if (song_status == 1) // song stopped
{
next_song(2);
return;
}

to sommething like:

// This is for Firefox
if (time == duration) // if at end of song
{
window.location = 'www.address.com'; // then load next page
return;
}
// This is for Ie
if (song_status == 1) // song stopped
{
window.location = 'www.address.com'; // then load next page
return;
}

Then on page 2 instead of waiting for a play button to be pressed, you could call the play_song() function from the very bottom of the function loadsongs()

Jeff
www.seabreezecomputers.com

15. Posted By: Ekix - ekix@ekisoft.com - December 2, 2008, 3:54 pm

Hello guys,

Sorry I'm a bit lost, so could someone give me an example of a working web page using this javascript system.

I'm a bit confused how to do it, anyway I'd like to get my player to show the player also and a drop down to choose what the visitor wants to select selects to play.

At the moment I'm using embedded Windows Media player in my web pahe, but it only works

If anyone could help me a bit, that would be nice...

Regards/
Ekix

16. Posted By: Ahmad - - December 22, 2008, 1:13 am

Hi,
Thanks a lot for your script.
I have changed window.onload = loadsongs; to window.onload = play_song; but the player can not find the soundfile but with function loadsongs work well.
Demo at
http://aua.info/islamstart/quransearch/randomSlide.php

17. Posted By: Ahmad - - December 23, 2008, 6:08 am

Hi,
by luck I have resolved somehow the problem with window.onload = play_song; by myself.

18. Posted By: Ahmad - - December 31, 2008, 2:00 am

Hi,
by following code, the player plays from the all list in frist page just one song and goes automatically to the next page
How is it possibile that the player plays all tracks in first page and then goes to next page?

// This is for Ie
if (song_status == 1) // song stopped
{ window.location = 'www.address.com'; // then load next page
return;
} The player playing only one Track and goes to second page.

19. Posted By: Jeff - - December 31, 2008, 4:01 pm

Ahmad, to switch to a new page after all the songs have been played you would need to edit next_song(dir) function as follows.
The change is the lines that say:

if (current_song > playlist_length)
current_song = 0; // loop to first song

instead you would change it to:

if (current_song > playlist_length)
window.location = 'www.address.com'; // then load next page

Jeff
www.seabreezecomputers.com

20. Posted By: . - amad@yahoo.com - January 1, 2009, 5:22 am

Thnaks, it works. Now wenn I change window.onload = loadsongs;
to window.onload = play_song; does`t play automaticaly songs wenn the page is loaded. I use IE 6.0 and Mozilla/5.0

21. Posted By: Jeff - - January 1, 2009, 12:33 pm

I never told you to change window.onload. Keep it as "window.onload = loadsongs;"

And as I said in a comment earlier:

Instead of waiting for a play button to be pressed, you could call the play_song() function from the very bottom of the function loadsongs()

Jeff
http://www.seabreezecomputers.com

22. Posted By: pawan vidya - - January 13, 2009, 2:11 am

hi , i m tring to play my selected song putted those in textarea but not successed.
plz heklp me how i paly song with this script.

23. Posted By: tomguiss - - January 18, 2009, 2:11 pm

Hello,

i want my webpage to load and start automatically a song, and juste have a button with "pause" and after clicking the text on the button would be "play"

How can i make it ?

24. Posted By: Jeff - - January 19, 2009, 1:00 pm

In sound.js at the very bottom of the loadsongs() function add the line:

play_song();

That will automatically start playing the music when the page is loaded. Then in your HTML document you could just put the control for the pause button:


<DIV STYLE="border: 1px solid black; width: 340px;
padding: 5px;">
<BUTTON ONCLICK="pause_song();" ID="pause_btn">Pause</BUTTON>
</DIV>

Jeff
www.seabreezecomputers.com

25. Posted By: Dino67 - - March 9, 2009, 2:24 pm

Thanks for the code. It works great except in IE7. If the user refreshes my page in IE7 while the music is playing, an error is generated: "Unhandled win32 exception". This error may occur on the first refresh or on the second refresh of the page. It does not occur with other browsers. I've asked friends to check and they are experiencing the same porblem so it's not unique to my system. Any ideas as to why that would be hapeening?

26. Posted By: Dino67 - - March 9, 2009, 2:27 pm

I forgot to add to my previous post that I have my music set to play when the page loads, using play_song(), and I only have a 'stop' button, no other control visible. Other than that, I have made no changes to the code.

27. Posted By: James Crossett - - May 20, 2009, 3:00 am

Getting this thing cross browser for me seems more to do with platforms. Windows and Mac. Detecting platforms and delivering either Windows media or Quicktime worked for me without any problem on any browser I tested in as you then deal with the native players.

So...add this function or replace detect_browser():
function detect_platform(){
var platform = navigator.platform;
return platform;
};

Load function becomes (just a change in the IF statement to merely detect Windows or assume Mac or something else)

function load(media){
media = folder + media;
var player = document.getElementById('player');

if (detect_platform() == "Win32"){
player.innerHTML = '

28. Posted By: ypki - - July 29, 2009, 2:00 am

Excellent work......
i have a doubt,
What happen when the music player is created and play a music file from server, will the music file is downloaded to the client system or it play from server?
If it download to the client system, where it save?
If it play from server, will it take more time to load?

29. Posted By: dbrumm - - September 18, 2009, 12:53 pm

Also had a problem with the refresh in IE7 and 8. It happens because the Display Time function is calling once the page is removed. I tried a few null statements like

if (typeof (document.getElementById("sound")) !== 'undefined' && document.getElementById("sound") != null) {

But still does not work. If you find a solution please let me know. Love the setup just have to solve this problem before I can use it.

Thanks,

30. Posted By: Reju Koshy - - September 27, 2009, 11:30 am

To avoid some java script errors in IE add following condition in display_time() finction...

if(document.sound){
song_status = document.sound.playState;
}

if(document.sound){
buffer_status = document.sound.network.bufferingProgress;
}

if(document.sound){
time = document.sound.controls.currentPositionString;
//duration = document.sound.currentMedia.duration;
duration = document.sound.currentMedia.durationString;
}

31. Posted By: TDinDC - - October 15, 2009, 10:12 am

Hi Jeff.
I made one small variation for a consistent display of the time during play I wanted to share with you. In the function display_time() I changed the following:
secs = time - (mins * 60);
if (secs < 10)
{
secs = '0' + secs;
}
time = mins + ':' + secs;
mins = Math.floor(duration / 60);
secs = duration - (mins * 60);
if (secs < 10)
{
secs = '0' + secs;
}

What this does *(suppose the current time is 1 minute 7 seconds) is to display "1:07" rather than "1:7". The same is true for duration (say 4 minutes 5 seconds) it displays "4:05" not "4:5"

32. Posted By: Cat - cat@theparables.com - November 24, 2009, 1:40 pm

anyone want to help me get a working version running on my website that includes a dropdown select list of songs, and has all the IE 7 and 6 problems corrected?

I just want to play MP3 that I own the rights to files from a web page and make them available to everyone for free.

33. Posted By: ghostrider - ghostrider.k9@gmail.com - December 11, 2009, 11:05 pm

How do u play the song automatically as the page loads? pls help

34. Posted By: Jeff - - December 13, 2009, 8:01 pm

Leia11. To play a song when the page is loaded do the following:

In sound.js at the very bottom of the loadsongs() function add the line:

play_song();

That will automatically start playing the music when the page is loaded. Then in your HTML document you could just put the control for the pause button:


<DIV STYLE="border: 1px solid black; width: 340px;
padding: 5px;">
<BUTTON forbidden="pause_song();" ID="pause_btn">Pause</BUTTON>
</DIV>

Jeff

35. Posted By: Tim - - December 30, 2009, 6:02 am

0 The playback state is undefined.
Here are the feedback results for playState:

1 Playback is stopped.
2 Playback is paused.
3 The player is playing a stream.
4 The player is scanning a stream forward.
5 The player is scanning a stream in reverse.
6 The player is buffering media.
7 The player is waiting for streaming data.
8 The player has reached the end of the media.
9 The player is preparing new media.
10 The player is ready to begin playback.

36. Posted By: Undefined Cat - - February 11, 2010, 8:11 pm

This is an awesome script!!!! I like it. However, i just tested out with Windows 7 's mozilla Firefox, the looping music part doesn't work as well. It wouldn't go to the next song but repeat the first song, and then play the 2nd song, then repeat the 2nd song for twice, and so on... I went through the code and logic, i don't see where it would went wrong for Win 7's browser. Yet, it worked perfectly fine with in IE for Windows 7 OS!!

37. Posted By: Shaun - - March 25, 2010, 6:42 am

I got the player working in Dreamweaver.

Then I removed all unwanted buttons,
as I only wanted to see Play, Stop buttons.

Thats the good part :)

Now the problem:
I want 10 buttons, 1 button for a single .mp3
Is this possible?

I have created my own Play Button, Stop Button.
How can I use my own button graphics, as I the style of the grey buttons here to not fit the style of the website I am designing at the moment.

Thanks!

38. Posted By: RaptorJesus - nathan.davies-lee1@education.nsw.gov.au - April 4, 2010, 7:48 pm

Yeah, uh i am having a problem. I added every scrap of code here, and I get a message... something about an error with a (.) extension. Song Title is always undefined. Please can someone email me the right code? if all else fails, i can just cheapskate 1 song into the background...

39. Posted By: suresh - - April 26, 2010, 12:16 pm

i need a controller such that if say a specific position then it has to play from that position
Ex i had song which plays for 600 seconds
I need to play from 20 seconds

like this taking an input value it has to play from that position

could any one please send the example code for this

40. Posted By: KKammeyer - - May 14, 2010, 7:28 pm

I can't get this script to work in IE either. It works great in Firefox. I traced it down to the following line in the sound.js file:

var songs_list = document.getElementById('songlist').innerHTML;

According to the following website, there are some squirrely things about the getElementById method in Internet Exploder:

http://reference.sitepoint.com/javascript/Document/getElementById

I can't quite follow what they are saying since I'm new to JavaScript, but the result is that the sound.js script never populates the songs_list var for me in IE, so there is nothing to play. Any suggestions? Why does this script work in IE on this webpage, but not in IE on my own computer?

41. Posted By: Bertil - - June 3, 2010, 10:04 am

Hi!

I really like your java player. But- When I tried it in Win7 and Firefox 3.6.3
It plays, but says "This browser does not support song ID3 information.�
It is only "play" and "stop" that are working.

And when I exit the Firefox, it crashes!

When I test with IE, all works fine!

Rebooting to WinXP, ALL works fine in both browsers!

-:(

Bertil

42. Posted By: kkkmmm - cmcm@hotmail.com - July 5, 2010, 8:02 pm

This is awesome! good job!

43. Posted By: Nilabh - - July 8, 2010, 5:25 am

I want that my song will start start randomly, not from 1st as in list....i.e. its plays 3rd song first then other

please help me

44. Posted By: franszo - - August 11, 2010, 3:57 am

hai!
i try to implement it in wordpress.
in IE works fine, but in FF, when i press play, i've got "Current song: undefined" msg.
Have you got any idea why? Or a solution? thanks

45. Posted By: blreng - - September 30, 2010, 7:12 am

I have embedded the player into my webpage and it will function correctly offline (local implimentation), however having uploaded all necessary files (including sound.js) it does not play music file (.aac) online.

Any suggestions as to what could be wrong.

Regards

46. Posted By: blreng - - September 30, 2010, 7:35 am

Having changed the music file to mp3 format and amended playlist accordingly website is now functioning online with PC WINXP in IE8 and safari, that is the good news.

The bad news is that the 'iPad' is still silent with apparently 'NO ERRORS' showing on debug.

47. Posted By: Jeff - - September 30, 2010, 12:36 pm

As for .aac files. I have never tested the player with those files. Only mp3. Also the player has not been tested on the iPad or iPod Touch. My guess is that the safari browser on those devices does not support the code used to playback music files in the script. I just tested it on an iPod Touch and it acts like it is trying to play the song but there is no sound.

Jeff
www.seabreezecomputers.com

48. Posted By: Hour sokaon - hoursokaon@yahoo.com - October 3, 2010, 7:40 pm

I use Yahoo media player in my website but and I put more than 1 songs in playlist. After one song finished the next song doesn't play unless i press the next button. How can I do with this java script If I need the next song is load?

Script :
(

var YMPParams =
{
autoplay:true,
volume:0.5,
defaultalbumart:'http://dl.dropbox.com/u/10744521/Couple.jpg'
}

Without You
Take me to your heart)

So please help me to do.
hoursokaon@yahoo.com

49. Posted By: hour sokaon - hoursokaon@yahoo.com - October 3, 2010, 7:43 pm

I use this page to do.
http://mediaplayer.yahoo.com/

50. Posted By: W. Iwanowa - - October 27, 2010, 12:48 am

Thank!
Thank!
Thank!