Order Now AdSolution Sign Up | Login » Bits on the Run Sign Up | Login »

Forums

/

Multiple Playlists, 1 player with HTML link in xml

41 replies [Last post]

I have reviewed all the topics that make since to me, but some are complicated to a novice like myself. Can I be bold and try a new thread?

I am trying to create a multiple playlist player with annotation with an HTML link below the player to link to a PDF file associated with the audio files in the playlists.

I am not greatly skilled at javascript, but can muddle my way through it with some expert advise.

I have been successful setting up the player and linking the playlists to the player, but am having trouble getting any annotation to show up in caption area below the player.

Also, is there a skin out there that is like the skin found at http://home5.inet.tele.dk/nyboe/flash/mediaplayer/annotationdisplay.htm that I could change the colors on?

Instead of posting all of the code here is the link to the testing page; http://www.silverdalebc.com/ministries/media2.php

Any help is appreciated, thank you for your advice, in advance.

niteowl

you are mixing flashvars and javascript api for the v.3.x player and the v.4.x player !

please see the wiki for complete list of vars and commands for the various players - http://code.jeroenwijering.com/trac/

also please see this page - http://www.jeroenwijering.com/?item=Javascript_API_Examples
and this example - http://home5.inet.tele.dk/nyboe/flash/mediaplayer4/JW_API_xmpl_4-3-1-0.html

please note the above examples use the v.4.x player and swfobject v.2.1 !
you can download the swfobject v.2.1 from here - http://code.google.com/p/swfobject/
or directly here - http://swfobject.googlecode.com/files/swfobject_2_1.zip

more examples (for both versions) here - http://home5.inet.tele.dk/nyboe/flash/

Thanks! I new it was something simple thanks for your expertice!
Also thank you for pointing out the API link and wiki...it really made sense and helped put things in order for this novice programmer-wannabe.

Awesome tools and site!

Signing off...
niteowl

Not one to readily press the panic button... but...

I have about 3 questions: Hope this will help others.

- Read the example of multiple playlist... but am not getting something. The below is an example of sort-of what I'm trying to do. Ideally, you'd click the pic and the playlist for that selection. I'm lost, if an example doesn't have an embed EXACTLY like the wizard

My project:
http://hinterlandsinc.org/music/test-musique.html

- Can and Where would one change the colour of the playlist. Seemed I read somewhere that it couldn't be done with the present version-I could have been hallucinating, but seems I thought I read.

- Is there a param to return to the playlist after playing opposed to moving to the next item on the list.

- How do you get rid of the play jobby on the player?

Thanks, in advanced. Meanwhile I'll continue to hack away... I'll turn you on if I find a solution.
-Joao

Here are my three questions:

1) What is a "jobby"?

2) What do you mean by "return to the playlist"?

3) What version of the player are you using?

4) Are you using a LightTPD server?

5) When you say, "you'd click on the pic", are you referring to the image in the scrolling list to the right of the player?

You can change the color of the JW FLV Media Player's playlist with the color flashvars.

Reference: http://code.longtailvideo.com/trac/wiki/FlashVars#Colors

Also, the latest player automatically scrolls to the current playlist selection.

However, none of this applies to your implementation because you don't even have the JW Player's playlist showing.

I feel like I'm being scolded... but I'll grin and bear it...

I'm using the version, before the present. Haven't upgraded

The "jobby" is: http://home5.inet.tele.dk/nyboe/flash/mediaplayer/multipleplaylists.htm

In theory, clicking the pick should bring up a separate playlist... that is overlayed.

Thanks,
Joao

dont know if there are more errors - but this one is enough to make the script fail:
<a href="javascript:loadPlay('mediaplayer/playlist-10.xml',%203);"><a href="javascript:loadPlay('mediaplayer/playlist-10.xml',3);">

Nobody is scolding you, we just need all of the gory details before we can properly advise you.

You do want proper advise, don't you?

By the way, there are still a few un-answered questions.

If you're not going to have the JW Player's playlist showing, then a few of those items don't matter.

I'm notorious for being vague-appreciate your help... I'll accept my scolding if it'll help get me a resolution...

Joao

To the questions:

My domain host is HostMonster... they informed me that we're running: Apache/Linix Server SentOS

When I reference "returning to the playlist"... you'll note that after you play anything from the list, the picture remains from the selection - whereas, I want to return to the original playlist that they selected from.

I made the change... but to no avail. I guess it might help if I knew what the second parameter was referencing: (i.e. mediaplayer/playlist-10.xml',3) = the "3"

And yes.. I'm referring to the picture to the right in the scroll textbox... that should in theory invoke the plays list.

thanks,
Joao

You have an external playlist, so you will have to format it with CSS.

The "3" refers to the index number in the playlist, starting at "0", so "3" would play the fourth track.

I've been trying to do the same and have been following this page and am not sure if Joao's question was really answered.

Firstly, Looking at his code-The %203 that he originally had was referencing an idx (or index) not a track. I think he was trying to call the XML up.

Secondly, someone asked him to supply them with some information and just left him hanging.

Thirdly, I copied his code and found that it's not working for me, so I'm assuming that it's still isn't working for him. There was a call to Shock effect, from viewing the code of the link that he referenced or is trying to replicate, would that have anything to do with why it's not working

@Manfred,

Joao's questions were answered (and will continue to be answered) to the extent that he supplies the requested information.

Regarding the index/track, they are the same thing, just counted differently. Since the index refers to an array, counting begins at 0. Humans commonly begin counting at 1, so looking at the playlist, the fourth track would be index 3.

Nobody left him hanging — you're dead wrong about that. Let's get one thing perfectly clear here: This is FREE, VOLUNTEER help that Joao is receiving here. We have jobs, families, other pursuits in life, and need to eat and sleep. If you're not happy with the response from the volunteers, look elsewhere!

thanks Manfred.. didn't need the drama, I bought a flash app from Flash Den, it doesn't do exactly what I wanted, it looks nice, and it'll get the work done.

can someone take a look this and tells me if its ok, I am trying to create a player with an XML playlist and RTMP but I dont know why is not working. the player works with YOUTUBE videos but not with RTMP links form vital stream

here is my XML

<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>
<track>
<title>Video1</title>
<creator>Herbalife</creator>
<location>rtmp://herbalife.flash.internapcdn.net/herbalife_vitalstream_com/_definst_/AM/20000</location>
<identifier>22076-am-eng-YearInReview2005-300</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Video2</title>
<creator>herbalife</creator>
<location>rtmp://herbalife.flashsvc.vitalstreamcdn.com/herbalife_vitalstream_com/_definst_/EU/1000</location>
<identifier>1159W-eu-eng-June08KO-300</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Video3</title>
<creator>Herbalife</creator>
<location>rtmp://herbalife.flashsvc.vitalstreamcdn.com/herbalife_vitalstream_com/_definst_/EU/1000</location>
<identifier>1160B-eu-eng-July08KO-300</identifier>
<meta rel="type">rtmp</meta>
</track>
</trackList>
</playlist>

 
@Arturo,

Before we can help you, we need to know what version of the JW FLV Media player you are using because the RTMP and other streaming methods have changed. Right-click on the player's displayarea to see the version that you have.

We also need to know what form of embedding code you are using, so post your player code using the code tags (the "<>" below the text-entry box).

thanks you can see the player here http://www.mypartynights.com/player2.htm and the code that I am using for the player is this:

<script type="text/javascript">
var so = new SWFObject('http://www.mypartynights.com/player/player.swf', 'mpl', '500', '540', '8');
so.addParam('allowscriptaccess', 'always');
so.addParam('allowfullscreen', 'true');
so.addVariable('file', 'http://www.mypartynights.com/player/Playlist.xml&playlist=bottom');
so.addVariable('width', '500');
so.addVariable('height', '550');
so.addVariable('displaywidth', '500');
so.addVariable('backcolor', '0xFFFFFF');
so.addVariable('frontcolor', '0x6666FF');
so.addVariable('bufferlength', '5');
so.addVariable('overstretch', 'fit');
so.addVariable('autoscroll', 'true');
so.addVariable('thumbsinplaylist', 'true');
so.addVariable('autostart', 'true');
so.write('player');
</script>

thank you

Try this:

    <script type="text/javascript">
      var so = new SWFObject('http://www.mypartynights.com/player/player.swf', 'mpl', '500', '760', '8');
          so.addParam('allowscriptaccess',    'always');
          so.addParam('allowfullscreen',      'true');
          so.addVariable('streamer',          'rtmp://herbalife.flash.internapcdn.net/herbalife_vitalstream_com/_definst_');
          so.addVariable('file',              'http://www.mypartynights.com/player/Playlist.xml');
          so.addVariable('playlist',          'bottom');
          so.addVariable('playlistsize',      '120');
          so.addVariable('backcolor',         'FFFFFF');
          so.addVariable('frontcolor',        '6666FF');
          so.addVariable('bufferlength',      '5');
          so.addVariable('stretching',        'exactfit');
          so.addVariable('autostart',         'true');
          so.write('player');
    </script>
<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
  <trackList>
    <track>
      <title>Video1</title> 
      <creator>Herbalife</creator> 
      <location>AM/20000/22076-am-eng-YearInReview2005-300</location> 
      <meta rel='type'>video</meta>
    </track>
    <track>
      <title>Video2</title>
      <creator>Herbalife</creator>
      <location>EU/1000/1159W-eu-eng-June08KO-300</location>
      <meta rel='type'>video</meta>
    </track>
    <track>
      <title>Video3</title>
      <creator>Herbalife</creator>
      <location>EU/1000/1160B-eu-eng-July08KO-300</location>
      <meta rel='type>video</meta>
    </track>
  </trackList>
</playlist>

Since I don't have access to the configuration of your RTMP server, I'm guessing about the application/instance for the RTMP stream URL.

No It didn't work it came up with the error THIS PLAY LIST IS NOT A VALID XML FILE. any other idea?

That's probably only because you didn't correct my typO in this line:

<meta rel='type>video</meta>

Missing a single quote symbol after type.

Do you have any documentation from your streaming service provider that shows the correct stream URL and path(s)/filename?

Yesssssssss you are awesome it works perfect the way I wanted. here is the page so you guys can see

http://www.mypartynights.com/WeddingsTV.asp

thank you

I might have some more questions but, i talk to you later.

thank you

That's AWESOME. Good Luck!

(By the way, I hope you saw the humor in my statement, "you didn't correct my typO".    :D)

I know.. Hey more quetion. what do you recommend to do flash live streaming? I want to do live streaming on my web. thank you

Wowza or Red5 — see this thread: http://www.jeroenwijering.com/?thread=9589

I have this code but nothing. :(

<script type="text/javascript" src="http://content.longtailvideo.com/files/swfobject.js"></script>

<div id="player">This text will be replaced</div>

<script type="text/javascript">
var so = new SWFObject('http://content.longtailvideo.com/files/player.swf','mpl','470','200','9');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('flashvars','&file=http://www.emix.lt/playlist.xml&backcolor=FFFFFF&frontcolor=000000&lightcolor=0099cc&skin=http://www...');
so.write('player');
</script>

Here is my playlist.xml

<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>
<track>
<title>Video1</title>
<creator>Herbalife</creator>
<location>rtmp://herbalife.flash.internapcdn.net/herbalife_vitalstream_com/_definst_/AM/20000</location>
<identifier>22076-am-eng-YearInReview2005-300</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Video2</title>
<creator>herbalife</creator>
<location>rtmp://herbalife.flashsvc.vitalstreamcdn.com/herbalife_vitalstream_com/_definst_/EU/1000</location>
<identifier>1159W-eu-eng-June08KO-300</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Video3</title>
<creator>Herbalife</creator>
<location>rtmp://herbalife.flashsvc.vitalstreamcdn.com/herbalife_vitalstream_com/_definst_/EU/1000</location>
<identifier>1160B-eu-eng-July08KO-300</identifier>
<meta rel="type">rtmp</meta>
</track>
</trackList>
</playlist>

With this it working http://www.jeroenwijering.com/upload/bunnies.xml but with mine nothing

 
@Mindaugas,

See the code posted above on 29.10.2008 which has the correct player code and playlist code for your application.

@klodi,

http://www.emix.lt/playlist.xml result: "404 Page not found"

hello.my problem is that i want to add a mp3 player in my webpage and a list of songs below that..like

AUDIO PLAYER
1.looseurself.mp3
2.rapgame.mp3
3.beautiful.mp3
and i want the songs in a <textarea> like thing i think u got wat i mean
if u could help me by sending the code....
i will really thankful to u....

Hi,

You can use the simple skin and the player with an XML plalist to do this.

JW Player Code Example:

<script type="text/javascript" src="swfobject.js"></script>

<div name="mediaspace" id="mediaspace"></div>

<script type="text/javascript">
var so = new SWFObject('player.swf','ply','470','200','9','#ffffff');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','transparent');
so.addParam('flashvars','file=music.xml&playlist=bottom&skin=simple.swf');
so.write('mediaspace');
</script>

XML Playlist Code Example:

<?xml version='1.0' encoding='UTF-8'?>
<playlist version='1' xmlns='http://xspf.org/ns/0/'>
  <trackList>
    <track>
      <title>Song One</title>
      <location>1.mp3</location>
  <annotation>This is a song.</annotation>
    </track>
    <track>
      <title>Song Two</title>
      <location>2.mp3</location>
  <annotation>This is a song.</annotation>
    </track>
<track>
      <title>Song Three</title>
      <location>3.mp3</location>
  <annotation>This is a song.</annotation>
    </track>
  </trackList>
</playlist>

Best,
-Ethan

Thanx Ethan for help but i tried it didnt work i copied the code above JW Player Code Example and copied in my html file b/w <body> tag bt it didnt work...

Can you provide a link to your test page?

Ok i hav done i got da way to embed audio player...
thanx for ur help

now i want to do the same thing with the videos.....
video player i want to embed is u can see it on site www.eminem.com
can u help me in providing the source code so that i could just copy it in my page..... and use it

Hi,

I asked for a link to where you are running the player, www.eminem.com is not your site.

Best,
-Ethan

i havent uploaded it yet so how could i give u the link of the site..it is my project i hav to show it in university..
now could u please help me in embeding video player with a list of videos name in my site

thanx but there is a problem

<script type='text/javascript' src='http://mywebsite.com/swfobject.js'></script>

<div id='mediaspace'>This text will be replaced</div>

<script type='text/javascript'>
var so = new SWFObject('http://mywebsite.com/player.swf','ply','470','470','9','#');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('file','http://mywebsite.com/playlist.xml');
so.addVariable('playlist','bottom');
so.addVariable('playlistsize','180');
so.write('mediaspace');
</script>

as mention in the code i also needs some files to completly get wat i want

1.<script type='text/javascript' src='http://mywebsite.com/swfobject.js'></script>
i need this swfobject.js file bcz all the scripting is in it i have visted the link 'http://mywebsite.com/swfobject.js bt it appears as a empty page

2.http://mywebsite.com/player.swf'
i also need this player.swf' file

can u plz help where can i get these files??
waiting for ur reply
best regards
Babar

i hav done with the video problem
i hav another big problem i hav created my web site in 800x600 resolution whenever i opened it another system with higher or lesser resolution my web page go all wrong..
my backgrounds go out of order table widths and every thing
wat should i do so that like any other web page my web page doesnt dishape in higher resolution screen??
anxiously waiting for your reply

Can you provide a link?

sorry as i told u i haven't uploaded my web page
i will but after my exams bt i hav to show my project first
so can u help me y my web page goes out of shape wen i opened it in higher resolution

and another small problem
i have apllied javascript on my form
the errors comes wen i left name,state,page empty bt doesnt come wen i left the rating and gender radio buttons unchecked
here is the code u can test it
<html>
<head>
<title>Eminem-Feedback</title>

<style type=text/css>
.title{font-family:BankGothic Md BT;font-size:30pt;color:White}
.fields{font-family:BankGothic Md BT;font-size:13pt;color:black}
.home{font-family:Hard Light;font-size:25pt;text-decoration:none;color:White}
</style>

<script language="javascript">
function validateform(thisform)
{

if (thisform.name.value=="")
{
alert(" Please Give Your Name ");
thisform.name.focus();
return false;
}

if (thisform.state.value=="")
{
alert(" Please Select Your State ");
thisform.state.focus();
return false;
}

if (thisform.page.value=="")
{
alert(" Please Tell which Page You Like the Most ");
thisform.page.focus();
return false;
}

if(thisform.gender.value=="")
{
alert(" Please Select Gender ");
thisform.gender.focus();
return false;
}

if (thisform.rate.value=="")
{
alert(" Please Rate My Site ");
thisform.rate.focus();
return false;
}

else

return true;

};

</script>
</head>
<body bgcolor="black">
<h5 align=left><a href="../Home/Eminem.html" title="Click to go back to Home Page" class=home>HOME</a><h5>
<h1 align=center class=title>Feedback</h1>
<br>
<form name="myform" method="POST" action="feedback.php" onSubmit="return validateform(myform)">

<table border=1 width=520 height=640 cellpadding=0 cellspacing=0 align=center bgcolor="white">

<tr><td class=fields bordercolor=white>  Name              <input type="text" name="name" size=35 maxlength=25><br><br><br><br>

  Select State    <select name="state">
<option selected="selected" value="">Select Your State</option>
<option value="Pakistan">Pakistan</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Saudia Arabia">Saudia Arabia</option>
<option value="England">England</option>
</select>

<br><br><br><br>

  I Like Page       <select name="page">
<option selected="selected" value="">Select a Page</option>
<option value="Home">Home</option>
<option value="Audios">Audios</option>
<option value="Videos">Videos</option>
<option value="Gallery">Gallery</option>
</select><br><br><br><br>

  Gender           <input type=radio name="gender" value="Male">Male<br>                       <input type=radio name="gender" value="Female">Female
<br><br><br>

  Please Rate<br><br> <input type=radio name="rate" value="1 Star">1 Star  <input type=radio name="rate" value="2 Star">2 Star  <input type=radio name="rate" value="3 Star">3 Star  <input type=radio name="rate" value="4 Star">4 Star  <input type=radio name="rate" value="5 Star">5 Star  
<br><br><br><br>

  Comments<br>                  <textarea name=comments rows="8" cols="31">Please Enter Your Comments (Not more than 255 characters)</textarea>

</table><br><br>
<table border=0 align=center width=280 >
<tr><td><pre><input type=submit value=Submit name=submit> <input type=reset value=Reset name=reset></pre>
</td></tr>
</form>

</body>
</html>

Please provide the link so I can see, this is hard to debug.

i tried to make mp3 song which has tiltle but the player didnot work for me

jw embaded code

<script type="text/javascript" src="http://somlyrics.com/media/swfobject.js"></script>

<div name="mediaspace" id="mediaspace"></div>

<script type="text/javascript">
var so = new SWFObject('player.swf','ply','470','200','9','#ffffff');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','transparent');
so.addParam('flashvars','file=http://somlyrics.com/media/playlists.xml&playlist=bottom&skin=http://somlyrics.com/media/simple.swf');
so.write('mediaspace');
</script>

xml playlist

<?xml version='1.0' encoding='UTF-8'?>
<playlist version='1' xmlns='http://xspf.org/ns/0/'>
<trackList>
<track>
<title>Song One</title>
<location>http://somlyrics.com/media/Abdi Janan -Qays.mp3</location>
<annotation>This is a song.</annotation>
</track>
<track>
<title>Song Two</title>
<location>http://somlyrics.com/media/Abdi Janan -Ma ogtahay.mp3</location>
<annotation>This is a song.</annotation>
</track>
<track>
<title>Song Three</title>
<location>http://somlyrics.com/media/Abdi Janan -Qays.mp3</location>
<annotation>This is a song.</annotation>
</track>
</trackList>
</playlist>

but the player doesnot appear the page

http://somlyrics.com/kuday.html

and I aslo uploaded simple.swf into my server

i hope some one will help me

thnks.