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

Forums

JW Player
/
JavaScript Interaction

JavaScript playlist not working

10 replies [Last post]
Posted: Thu, 2009-10-22 15:06 Rick Penticoff
Anonymous's picture

I have gotten a playlists to work inside the Flash player. But I'd like to be able to format the playlist, so I've tried the Javascript option suggested at the Playlists Tutorial page (http://www.longtailvideo.com/support/tutorials/Playlist-Tutorial). However, I have not yet succeeded in getting any playlist to display using this method.

I have confirmed (using Firebug) that the relevant files are loading -- jquery.playlist.js, playlist.css, and jquery.js. I've even tried different versions of jquery.js (the version at http://www.longtailvideo.com/support/tutorials/Playlist-Tutorial is 1.3.1; I already had 1.3.2 installed). But for whatever reason, the JS is not firing the CSS and generating the html needed to display the playlist.

Here's the code I've been using to successfully load the player and play a video:

<script type="text/javascript">

var flashvars = {};  // apply to JW FLV Media Player
flashvars.file = encodeURIComponent('playlistRSS.xml?' + Math.round(1000 * Math.random()));
flashvars.id = "PlayerObj";
flashvars.playlist = "bottom";
flashvars.playlistsize = "360";

var params = {};  // apply to Adobe Flash Player
params.allowfullscreen = "true";
    params.allowscriptaccess = "sameDomain";
    params.bgcolor = "#FFFFFF";

var attributes = {};  //  apply to the HTML Object element
    attributes.id = "PlayerObj";
    attributes.name = "PlayerObj";

swfobject.embedSWF("http://../../../player.swf", "irPlayer", "370", "640", "9.0.124", "", flashvars, params, attributes);
</script>

Thanks for any help.

Posted: Thu, 2009-10-22 15:16 Edward Spiegel  
Edward Spiegel's picture

There is a problem in the files they posted. Use the javascript.js file that the tutorial page itself is calling (in addition to the files the tutorial tells you to use) and it should work. I spent and evening trying to figure out what I was doing wrong and then dissected the tutorial page itself and noticed that on the tutorial page they aren't using the files that they tell you to use.

They are aware of the problem and will be posting fixed files. In the meantime, add the javascript.js page and you should be fine.

Posted: Thu, 2009-10-22 16:15 Rick Penticoff  
Rick Penticoff's picture

Wonder of wonders -- that did it!

Many thanks, Edward. I kept looking and looking at the source of the tutorial page myself. Never noticed the javascript.js file until you pointed it out.

Posted: Thu, 2009-10-22 16:54 hobbs  
hobbs's picture

What's in javascript.js that you think you need?

I don't use javascript.js and my JavaScript Playlist works perfectly!

Posted: Thu, 2009-10-22 17:19 Rick Penticoff  
Rick Penticoff's picture

Don't know since I'm no JS expert. Could be the function printPlaylist() code under the Player 4 javascript API section.

Posted: Thu, 2009-10-22 21:31 Zachary Ozer  
Zachary Ozer's picture

This is actually a bug in our code which we've now repaired. The update should be pushed live shortly.

Once this is done, you won't need javascript.js - the playlist script was simply expecting playerReady to already be defined.

Posted: Thu, 2009-11-05 20:37 Eric  
Eric 's picture

Trouble getting this to work. I've added the javascript and css links to the page nothings happening. Maybe someone can help. Here's my player code:

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

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

<script type='text/javascript'>
var so = new SWFObject('jwplayer/player.swf','ply1','500','375','9');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('file','jwplayer/mrss-video-playlist.xml');
so.write('mediaspace');
</script>

And here are the links I've added:

<link href="new_style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="jwplayer/playlist.css" />
<script type="text/javascript" src="jwplayer/jquery.js"></script>
<script type="text/javascript" src="jwplayer/jquery.playlist.js"></script>

According to Firebug the javascript seems to be loading.

Posted: Thu, 2009-11-05 20:58 hobbs  
hobbs's picture

 
Are you testing this online? (from a http://... URI) ;Absolutely required for the JavaScript API to function.

Is the player loading? If not, I would work on that first. You need swfobject and player.swf.

Next the playlist. It should load independtly:http://www.domain.com/path/jwplayer/mrss-video-playlist.xmlAdjust the domain & path to yours. Loading the playlist in your browser will also validate the XML somewhat, depending on what browser you use to load the playlist.

Once the player is loading with a playlist, start working your way through jquery.playlist.js The first function that is called is playerReady(). Use some alerts like this, or any JavaScript debugger:

playerReady = function(obj)
{
  player = document.getElementById(obj.id);

for(var j in obj)
{
  alert(j + ': ' + obj[j]);
}

  checkPlaylistLoaded();
}

Then follow along through the flow (checkPlaylistLoaded() is next) until you have the HTML playlist display.

Next, style the playlist display in playlist.css to suit your needs.

If you get stuck, post a link to your Test Page. There are too many things that can go wrong, to use guessing as a useful form of debugging.

Posted: Thu, 2009-11-05 21:02 Eric  
Eric 's picture

Ok thanks, I will give that a try. I am not testing on-line so that could be part of the problem.

Posted: Fri, 2009-11-06 15:43 Eric  
Eric 's picture

Thanks hobbs! That fixed the problem. I guess testing using wamp works when the API requires an absolute address.

Cheers,

Eric

Posted: Fri, 2009-11-06 19:11 hobbs  
hobbs's picture

 
@Eric,

You're welcome.

              [i]Good Luck![/i]

  • Locked