Embedding several songs on one page with JS player

A

alice

I've been trying for a long time to figure this out, to have a page
with several MP3 clips, and each one having a custom start and stop
button next to them to play the track. I finally found a bit of code
that does this, but it's made for only one mp3 file. I don't know
enough about javascript to customize the code myself. I know there
probably needs to be an "array" of some sort, but I need some help
figuring out where and how that works.

Here's the code I found

<script language="JavaScript">
var state;

//URL of song - Direct path
function playerinit()
{
player.url="YOURSONG";
player.settings.autoStart = true ;
}

//Play Function
function play()
{
if (player.controls.isavailable('play'))
{
player.controls.play();
state=setInterval("updatetime()",1000);
}
}

//Stop Function
function stop()
{
if (player.controls.isavailable('stop'))
{
player.controls.stop();
clearInterval(state);
}
}
</script>
</head>

<body onload="playerinit();">

<!-- START PLAYER -->
<!-- Default Player Settings -->
<object id="player"
classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
type="application/x-oleobject" width="0" height="0">
<param name="autoStart" value="0">
<param name="balance" value="0">
<param name="currentPosition" value="0">
<param name="currentMarker" value="0">
<param name="enableContextMenu" value="0">
<param name="enableErrorDialogs" value="0">
<param name="enabled" value="-1">
<param name="fullScreen" value="0">
<param name="invokeURLs" value="0">
<param name="playCount" value="1">
<param name="rate" value="1">
<param name="uiMode" value="invisible">
<param name="volume" value="100">
<param name="URL" value>
<param name="defaultFrame" value>
<param name="baseURL" value>
<param name="stretchToFit" value="0">
<param name="windowlessVideo" value="0">
<param name="SAMIStyle" value>
<param name="SAMILang" value>
<param name="SAMIFilename" value>
<param name="captioningID" value>
<embed id="player" type="application/x-mplayer2" src="" height="0"
width="0">
</object>
<!-- END Default Player Settings -->

<br />

<!-- Player Controls -->
<input TYPE="image" src="PLAYBUTTONHERE.gif" value="Play "name="play"
onclick="play();">
<input TYPE="image" src="STOPBUTTONHERE.gif" value="Stop" name="stop"
onclick="stop();">
<!-- END Player Controls -->
 
C

cwdjrxyz

I've been trying for a long time to figure this out, to have a page
with several MP3 clips, and each one having a custom start and stop
button next to them to play the track. I finally found a bit of code
that does this, but it's made for only one mp3 file. I don't know
enough about javascript to customize the code myself. I know there
probably needs to be an "array" of some sort, but I need some help
figuring out where and how that works.

Here's the code I found

<script language="JavaScript">
var state;

//URL of song - Direct path
function playerinit()
{
player.url="YOURSONG";
player.settings.autoStart = true ;
}

//Play Function
function play()
{
if (player.controls.isavailable('play'))
{
player.controls.play();
state=setInterval("updatetime()",1000);
}
}

//Stop Function
function stop()
{
if (player.controls.isavailable('stop'))
{
player.controls.stop();
clearInterval(state);
}
}
</script>
</head>

<body onload="playerinit();">

<!-- START PLAYER -->
<!-- Default Player Settings -->
<object id="player"
classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
type="application/x-oleobject" width="0" height="0">
<param name="autoStart" value="0">
<param name="balance" value="0">
<param name="currentPosition" value="0">
<param name="currentMarker" value="0">
<param name="enableContextMenu" value="0">
<param name="enableErrorDialogs" value="0">
<param name="enabled" value="-1">
<param name="fullScreen" value="0">
<param name="invokeURLs" value="0">
<param name="playCount" value="1">
<param name="rate" value="1">
<param name="uiMode" value="invisible">
<param name="volume" value="100">
<param name="URL" value>
<param name="defaultFrame" value>
<param name="baseURL" value>
<param name="stretchToFit" value="0">
<param name="windowlessVideo" value="0">
<param name="SAMIStyle" value>
<param name="SAMILang" value>
<param name="SAMIFilename" value>
<param name="captioningID" value>
<embed id="player" type="application/x-mplayer2" src="" height="0"
width="0">
</object>
<!-- END Default Player Settings -->

<br />

<!-- Player Controls -->
<input TYPE="image" src="PLAYBUTTONHERE.gif" value="Play "name="play"
onclick="play();">
<input TYPE="image" src="STOPBUTTONHERE.gif" value="Stop" name="stop"
onclick="stop();">
<!-- END Player Controls -->
Click to expand...

That script looks as if it is very old. It likely is designed for the
WMP and uses a type of code that gives a lot of validation errors, so I
will not use this approach. In any event, it would require major
surgery to modify it to play several sound files with controls for on
and off.

I have done what you seem to wish, except I am using wma and ra files
rather than mp3. However, that is no problem, since both the WMP and
Real players will play mp3s. Also note that I reference a Microsoft
..wax playlist file for a song that points to the url of the actual .wma
file and a Real .rpm playlist file that points to the url of the actual
..ra file. There are good technical reasons for doing this for my
application, and the playlist files are very short - mainly the url
wanted at just a bit of other code in the case of .wax.

Also, most of the heavy script work is done on the server using php.
Although the pages could be written only using javascript if served as
html, the php is required if served as true xhtml with the correct
mime type.

See http://www.cwdjr.net/souearly/songs2Root.php for the version for
the WMP.

See http://www.cwdjr.net/souearly/songs2Root.txt for some of the php
used which can not be seen by just viewing the page source. You will
see some arrays, and other php script things that look much like
javascript.

Finally see http://www.cwdjr.net/souearly/songs2RootReal.php if you
have a recent Real player.

The controls with start and stop are actually mini embedded WMP and
Real players that are generated by the player objects.

The page could of course be done without all of the elaborate display
that mostly is done in a very large external script.

The two player pages work on IE6 and the most recent versions of Opera,
Firefox, Mozilla, Netscape, and SeaMonkey if you have the required
players and do not have script turned off.

Of course this may be much more complicated than you want, and not all
hosts allow you to use php on the server. It would take quite a bit of
work to write a stripped down version that uses only javascript and no
php, strips the displays, and design the page for html only and not
xhtml. I do not have time to do this at present, since I have several
other projects going.
 
A

alice

cwdjrxyz said:
That script looks as if it is very old. It likely is designed for the
WMP and uses a type of code that gives a lot of validation errors, so I
will not use this approach. In any event, it would require major
surgery to modify it to play several sound files with controls for on
and off.

I have done what you seem to wish, except I am using wma and ra files
rather than mp3. However, that is no problem, since both the WMP and
Real players will play mp3s. Also note that I reference a Microsoft
.wax playlist file for a song that points to the url of the actual .wma
file and a Real .rpm playlist file that points to the url of the actual
.ra file. There are good technical reasons for doing this for my
application, and the playlist files are very short - mainly the url
wanted at just a bit of other code in the case of .wax.

Also, most of the heavy script work is done on the server using php.
Although the pages could be written only using javascript if served as
html, the php is required if served as true xhtml with the correct
mime type.

See http://www.cwdjr.net/souearly/songs2Root.php for the version for
the WMP.

See http://www.cwdjr.net/souearly/songs2Root.txt for some of the php
used which can not be seen by just viewing the page source. You will
see some arrays, and other php script things that look much like
javascript.

Finally see http://www.cwdjr.net/souearly/songs2RootReal.php if you
have a recent Real player.

The controls with start and stop are actually mini embedded WMP and
Real players that are generated by the player objects.

The page could of course be done without all of the elaborate display
that mostly is done in a very large external script.

The two player pages work on IE6 and the most recent versions of Opera,
Firefox, Mozilla, Netscape, and SeaMonkey if you have the required
players and do not have script turned off.

Of course this may be much more complicated than you want, and not all
hosts allow you to use php on the server. It would take quite a bit of
work to write a stripped down version that uses only javascript and no
php, strips the displays, and design the page for html only and not
xhtml. I do not have time to do this at present, since I have several
other projects going.
Click to expand...

Thanks. What I really want though is on this page
www.fearofdolls.com/music.html, instead of just having (listen) links
next to each song, I want a button to start and stop it, and I want the
track to just play while you're on the page, and not open up a new page
or window or player, and not have a huge player embeded in the page,
just little start and stop buttons.
I'll take a look at your pages more in depth and see if that might be
what I need. I'm just beginning to learn js, php, and am swtiching from
html to xhtml.
 
C

cwdjrxyz

Thanks. What I really want though is on this page
www.fearofdolls.com/music.html, instead of just having (listen) links
next to each song, I want a button to start and stop it, and I want the
track to just play while you're on the page, and not open up a new page
or window or player, and not have a huge player embeded in the page,
just little start and stop buttons.
I'll take a look at your pages more in depth and see if that might be
what I need. I'm just beginning to learn js, php, and am swtiching from
html to xhtml.
Click to expand...

On my page you just get tiny embedded players just to the left of each
song title. They are reduced to about the same size as the text and are
mainly just a start-stop control. You are not directed to another page,
and you do not bring up a large player. The point is that a player can
be reduced to tiny size and be mainly just a start stop button. The
advantage is that all of the controls are built into the player object,
so you do not have to try to script the player itself, which is very
difficult to get to work on most modern browsers. If you are interested
in IE browsers with the WMP only, there is less of a problem. You have
as many mini players as there are songs. I do not care what code you
use. However, I wanted to set the record straight. Your link did not
work for me.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

WMP Script 0
How to have two html audio players on one page? 0
Creating Media Player object using javascript 0
Markers in Media Player 7 ? 0
How Do I Force An Object On The Page To PostBack or Reload? 4
WINDOWS MEDIA PLAYER OBJECT 0
embedding wmp on firefox 0
Fading effect between play and play-over and pause and pause-over 0

Members online

Total: 31 (members: 1, guests: 30)
Robots: 366

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,014
Latest member
BiancaFix3

Latest Threads

Top