Load a playlist from second playlist?

43 replies [Last post]

Posted: Fri, 2007-12-21 00:27 jKerr

Is it possible to have an item from a playlist in mpl1 load a different playlist in mpl2?

I've been trying something like the following in the playlist for mpl1:

<track>
  <title>New Features</title>
  <creator>IntelePACS 3-3-3</creator>
  <info><a href="javascript:createplayer('playlist.xml', true)"></a></info>
 <image>./JW/preview.jpg</image>
</track>

I create mpl1 in the <head>

<script type="text/javascript">
function createplayer(theFile, go) {
var s1 = new SWFObject("./JW/mediaplayer.swf","playlist","400","440","7");
	s1.addParam('allowscriptaccess','always');
	s1.addParam("allowfullscreen","true");
	s1.addVariable("file","./JW/playlist.xml");
	s1.addVariable("displayheight","300");
	s1.addVariable("backcolor","0x000000");
	s1.addVariable("frontcolor","0xCCCCCC");
	s1.addVariable("lightcolor","0x996600");
	s1.addVariable("width","400");
	s1.addVariable("height","440");
	s1.addVariable("recommendations","./JW/recommendations.xml");
	s1.addVariable("showstop", "true");
	if (go) { s.addVariable("autostart","true"); }
	s1.write("mpl1");
}
</script>

and in the body, i create mpl2:

<p id="mpl2"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</p>
<script type="text/javascript">
	var s2 = new SWFObject("./JW/mediaplayer.swf","playlist","180","250","7");
  s2.addParam('allowscriptaccess','always');
	s2.addParam("allowfullscreen","true");
  s2.addVariable("width","180");
	s2.addVariable("height","250");
	s2.addVariable("displaywidth","0");
	s2.addVariable("displayheight","250");
	s2.addVariable("file","./JW/playlist2.xml");	
	s2.addVariable("backcolor","0xFFFFFF");
	s2.addVariable("frontcolor","0x004e75");
	s2.addVariable("showicons","false");
  s2.addVariable("lightcolor","0x996600");
  s2.addVariable("thumbsinplaylist","true");
	s2.addVariable("showstop", "false");
	s2.addVariable("autoscroll", "true");
	s2.write("mpl2");
</script> 

Finally, i create the placeholder for mpl1:

<div id="mpl1"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</div>

Basically, what i'm trying to do is use mpl2 as a menu to drive content in the main player.

you can see the updated mockup here:

www.parkingkarma.ca/training

Am i barking up the wrong tree? Is there a better way to do this?

cheers,

-jeremy

Posted: Fri, 2007-12-21 06:34 andersen

try change this:
<info><a href="javascript:createplayer('playlist.xml', true)"></a></info>
to
<info>javascript:createplayer('playlist.xml', true)</info>

Posted: Fri, 2007-12-21 10:57 jkerr

@andersen

getting much closer ..

now, the player i'm using as my "menu" (mpl2) is displaying the icon for a link .. so it is accepting the javascript with your fix above ..

now, it is just not loading the playlist into mpl1

do i need to set a function to get this to work?

i added the enablejs flashvar to both players, but it still won't update the player with the new playlist ..

in the status bar, it does say that it's transferring data from the website, so it looks like it is trying to load into itself?

i'm thinking this should operate much like your floating windows examples ... but i don't need the floating windows .. so i'm having a hard time filtering out the code that i don't need from your source ..

thanks!

-jeremy

Posted: Fri, 2007-12-21 11:07 jkerr

@andersen

hmm .. i just looked at the demo page again, and I see that Jeroen offers another solution with:

javascript:loadFile({file:'/upload/mediaplayer.xml'})

if i were to use instead:

var currentItem;

with portions of:

function sendEvent(typ,prm) { thisMovie("mpl").sendEvent(typ,prm); };
	function getUpdate(typ,pr1,pr2,pid) {
		if(typ == "time") { currentPosition = pr1; }
		else if(typ == "volume") { currentVolume = pr1; }
		else if(typ == "item") { currentItem = pr1; setTimeout("getItemData(currentItem)",100); }
		var id = document.getElementById(typ);
		id.innerHTML = typ+ ": "+Math.round(pr1);
		pr2 == undefined ? null: id.innerHTML += ", "+Math.round(pr2);
		if(pid != "null") {
			document.getElementById("pid").innerHTML = "(received from the player with id <i>"+pid+"</i>)";
		}
	};

and ..

function loadFile(obj) { thisMovie("mpl").loadFile(obj); };
	function addItem(obj,idx) { thisMovie("mpl").addItem(obj,idx); }
	function removeItem(idx) { thisMovie("mpl").removeItem(idx); }
	function getItemData(idx) {
		var obj = thisMovie("mpl").itemData(idx);
		var nodes = "";
		for(var i in obj) { 
			nodes += "<li>"+i+": "+obj[i]+"</li>"; 
		}
		document.getElementById("data").innerHTML = nodes;
	};

... would that provide me with the behaviour i'm looking for if I then add the following to my playlist instead:

javascript:loadFile({file:'/upload/mediaplayer.xml'}

what would be the difference between using createplayer, or loadFile? would i be able to avoid reloading the player every time if i use loadFile?

in reality, i don't really want to ever redraw the player .. i just want to keep repopulating the playlist through a variety of different calls from menus ..

what would be the pros/cons of each method?

cheers,

-jeremy

Posted: Fri, 2007-12-21 11:31 NoRedraw

<info><![CDATA[javascript:loadFile('playlist.xml')]]></info>
works - add path if needed ('/media/playlist.xml')

Posted: Fri, 2007-12-21 11:45 jkerr

@ NoRedraw

thanks, but i'm getting the same behaviour

when i click the playlist item in mpl2, i get the "transferring data" message, but my playlist in mpl1 does not change ..

the test page is here:

www.parkingkarma.ca/training

thoughts on what i'm doing wrong?

cheers,

-jeremy

Posted: Fri, 2007-12-21 12:00 andersen

what would be the pros/cons of each method?

recreating will use a minimal amount of script (read: less debugging) and can load and play in one go, and work offline -
loadfile using the js-api, will only work online, and with .html .swf, .xml and .js on the same domain, and can not load and play in one go, but can look more pretty as there is no (re)creation pause...

first try use full paths in the previous setup:
<info>javascript:createplayer('http://whateveryourdomain.com/playlist.xml', true)</info>
that really ought to work! - and seem by your description to be the only problem left!
maybe test in two steps, by using a link to make sure the player will create proper: <a href="javascript:createplayer('http://whateveryourdomain.com/playlist.xml', true)">create</a>
if you want to avoid (re)creating i think it is best to use the "divide and conquer" method while developing -
as you have at least two tasks at hand - how to start scripts from the playlist and how to load and play files in the player...

first try to make a copy of the [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/javascript.htm]javascript page[/url] work
then combine with the "menu player" when that works...

please check the small [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/loadandplaywin.htm?2]playerwindow[/url] of the [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/loadandplay.htm]loadandplay[/url] demo from the [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/]demopage [/url]- it shows how to check that the player is ready before attempting to play ("state"==0)

Posted: Fri, 2007-12-21 12:15 andersen

oh, i see you have posted a link in the meantime - and it seem to work? sure you are not looking at an old cached version?

Posted: Fri, 2007-12-21 12:24 jkerr

@ andersen,

definitely not looking at the cached version ..

perhaps this will provide some insight:

i removed the <location> tag from the menu playlist

now, the info bar says it's trying to reach talkr

so, is the problem with my menu playlist? do i need to include the <location> tag, even though i don't want to load the movie into the current player ..

perhaps this has something to do with it ..

do i leave location empty, like this:

<location></location>

in the mean time, i'm taking your advice and going with the old "keep it simple, stupid" ..

i've stripped all of the unnecessary .css and other style info, menus, etc .. and i'm just trying to build the down and dirty JW interaction ..

for now, i'll try the createPlayer option, since i'm having a hard enough time debugging this when i don't really fully understand the javascript API to begin with ..

i'll post a stripped down demo version shortly ...

cheers,

-jeremy

Posted: Fri, 2007-12-21 12:31 jkerr

uh .. forget that last comment .. of course i need to provide a location ..

i'm going to grab a coffee to get my synapses firing again ..

still .. i've just added a full path for <location> and still nothing loads ..

back to the basics ...

-jeremy

Posted: Fri, 2007-12-21 13:50 jkerr

@andersen

ok, here's a stripped down demo:

www.parkingkarma.ca/training/jw-test.php

by all accounts, this should work

i named the players "menu" and "main" to make them easy to identify.
playlist2.xml is for my menu and contains all the javascript calls to (re)create the player in "main"

here's the code for playlist2

<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
	<trackList>
		<track>
		  <title><![CDATA[&lt;li&gt;&lt;/li&gt;]]></title>
			<creator><![CDATA[<b>Load Playlist 3</b>]]></creator>
			<location>http://www.parkingkarma.ca/training/JW/flv/3-3-3/training002.swf</location>
      <info>javascript:createplayer('http://www.parkingkarma.ca/training/JW/playlist3.xml', true)</info>
			<image></image>
		</track>
		<track>
		  <title><![CDATA[&lt;li&gt;&lt;/li&gt;]]></title>
			<creator><![CDATA[<b>Load Playlist 4</b>]]></creator>
			<location>http://www.parkingkarma.ca/training/JW/flv/3-3-3/training003.swf</location>
      <info>javascript:createplayer('http://www.parkingkarma.ca/training/JW/playlist4.xml', true)</info>
			<image></image>
		</track>
		<track>
		  <title><![CDATA[&lt;li&gt;&lt;/li&gt;]]></title>
			<creator><![CDATA[<b>Load Playlist Original</b>]]></creator>
			<location>http://www.parkingkarma.ca/training/JW/flv/3-3-3/training002.swf</location>
      <info>javascript:createplayer('http://www.parkingkarma.ca/training/JW/playlist.xml', true)</info>
			<image></image>
		</track>
	</trackList>
</playlist>

here's the code for playlist3

<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
	<trackList>
		<track>
			<creator>Playlist3</creator>
      <title>Using and Installing InteleViewer</title>
			<location>http://www.parkingkarma.ca/training/JW/flv/3-3-3/training001.swf</location>
			<image>./JW/preview.jpg</image>
		</track>
		<track>
			<title>Playlist3</title>
			<creator>IntelePACS 3-3-3</creator>
			<location>http://www.parkingkarma.ca/training/JW/flv/3-3-3/training002.swf</location>
			<image>./JW/preview.jpg</image>
		</track>
		<track>
			<title>Playlist3</title>
			<creator>IntelePACS 3-3-3</creator>
			<location>./JW/flv/3-3-3/training003.swf</location>
			<image>./JW/preview.jpg</image>
		</track>
	</trackList>
</playlist>

that looks pretty straight-forward, given what i now understand about this player ..

is there a conflict with my ids for the player?
am i not creating the player correctly?
did i miss a script somewhere?

i hope this stripped down-version makes it easier for you to assist ..

cheers,

-jeremy

Posted: Fri, 2007-12-21 14:12 andersen

I AM SO SORRY!

it seems this functionality has disappeared without warning! (probably at some point when JeroenW changed the xml parser)
admitted, it is a while ago i had tried this functionallity -
but i remember someone reporting success doing like this with the rotator just a couple of days ago i think...

heres is the proof:
working [url=http://home5.inet.tele.dk/nyboe/flash/menumediaplayer.htm]menuplayer [/url]using the player v.3.6
same (but [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/menumediaplayer.htm]not working[/url]) using player v.3.12
i am devastated, sorry to have vasted yours and a couple of others time - will file as a [url=http://www.jeroenwijering.com/?forum=Bug_Reports]bug report[/url]...

Posted: Fri, 2007-12-21 14:21 jkerr

@ andersen,

no worries, andersen ..

your help is invaluable, as usual ..

this process is good for me, because i'm learning more and more about the player as i go ..

in fact, i think i learn more when things don't work, than when they do, since i'm forced to really look at what code is doing what ..

i feel way more comfortable than i did even just 4 weeks ago, when i started building my training portal ..

so, with that said ... until a bug fix is available, should i avoid the JW to act as a menu? granted, it's not really what it's designed for, but it looked like a really simple option for navigation of my content without having to have menus all over the place ..

while i ask, i should mentioned that there "is" one more level of complexity that i've left out (intentionally) just to get the basic part working .. but i'll present it now, since it may change what you suggest ..

in the simplest of terms: i'll have:

main drop down menu at the top (plain old .css)
those menu links will trigger a different playlist that appears in player "menu" (these are the training topics)
when a person clicks on the topic in "menu" player, that loads the correct playlist into the "main" player

so, as the user selects items from the main drop-down, or training topics, all of the playlists will update dynamically ..

should i just resort back to .css for anything that is a "menu" and only use the JW player as a Player? that would be too bad .. because I thought i was starting to get kind of creative in how i was implementing the player .. :-)

back to the drawing board ... thanks for letting me know it's a bug .. i'll stop pulling my hair out now <grin>

cheers,

-jeremy

Posted: Fri, 2007-12-21 14:42 andersen

WAIT! it would seem it is because the default value of the linktarget have changed!!
if you could please check the (alledged non working) again here: maybe [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/menumediaplayer.htm]working version of menuplayer[/url]
there i have set linktarget to _self and it SEEMS to work, but i am not sure of anything right now, having swithched blockers on and off and what know i...

Posted: Fri, 2007-12-21 14:51 jkerr

@ anderson,

i did read about the linktarget issue last week, and it was already enable for my "main" player, because i want to also use the recommendation feature ..

however, linktarget was not set to _self in my "menu" player ... i just tried .. and .. no luck ... it still won't load the new playlist ..

also, your demo is a bit different than what i want to do. for me:

menu player = playlist only (player hidden with displayheight)
main player = playlist & player

so, i'd like the menu playlist to load different playlists into the main player ..

your demo page has two players, but only one playlist ...

cheers,

-jeremy

Posted: Fri, 2007-12-21 15:14 andersen

your demo is a bit different than what i want to do. for me:

well, that just minor tweaks, now that we know it is possible again, its only a question of setting up the players -
i can add i have now tested on a restarted machine, in both IE7 and FF2 (flash v.9.0.115) and with a v.3.12 player - both browsers set to block popups and open pages in new tabs and they seem work fine...

please check the source of the (now working) [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/menumediaplayer.htm]menuplayer demo[/url] - (note that there is only one embedding script) - so you just tell the players to show the playlist and/or screen when you call them in createplayer - and the same in the playlist- there you just tell the createplayer the same - one track playlist snippet:

<track>
<title>create player</title>
<creator>preview (JPG)</creator>
<location>preview.jpg</location>
<info>javascript:createplayer('placeholder1', 'p1', 'playlist1.xml', '320', '225', true)</info>
</track>

Posted: Fri, 2007-12-21 16:04 jkerr

@ andersen,

ok, bear with me as i get my head around this .. i think i see where you're going .. it's just a bit different than what i was doing, since you're using relative placholders, instead of absolute values in many places (which i like much better) ..

so ... your function defines:

function createplayer(thePlace, thePlayerId, theFile, theHeight, theDisplayheight ...

however, you don't specify an ID in the <script>

don't we need to also specify:

s.addVariable("javascriptid",thePlayerId

or does the player understand this by default, without us defining the variable?

also, my two players have different w,h,displayheight "and" displaywidth, so am i safe to also include:

"width", theWidth   and
"displayWidth", theDisplayWIdth

instead of

"width", "400"

(and then define all of those variables in the function createplayer ... ?
i think i'm following .. i just need some time to work around the idea of defining variables, instead of hardcoding all of the values ... this would surely simplify the creation of multiple players on a page ..

thanks for helping me walk through this .. glad to know this should be possible .. i'm getting there ..

cheers,

-jeremy

Posted: Fri, 2007-12-21 16:08 andersen

you are right on all points!
i just included the bare minimals to get the demo going as quick as possible - but is seem you have got the idea just right!
please note though, that the javascriptid only is needed when you use the javascript api which the menuplayer demo doesnt...

Posted: Fri, 2007-12-21 16:47 jkerr

@anderson ..

soooo close .. i can taste it now ..

my menu player appears on load, but why does the main player not appear on load?

i'm missing a comma or something somewhere .. i'm sure ...

but i've been hammering away at this for the past 6 hours now, so it all looks the same .. more ... coffee ... required ..

[url=http://www.parkingkarma.ca//training/jw-menu-test.php]http://www.parkingkarma.ca//training/jw-menu-test.php[/url]

[hold on .. my site is down for some reason ... i'll repost when it's up]

[update: ok ..site back up, and i had to create a new test page .. link above should now work]

-jeremy

Posted: Fri, 2007-12-21 17:13 andersen

change this line:
var s = new SWFObject("./JW/mediaplayer.swf", theFile, theWidth, theHeight, theDisplayWidth, theDisplayHeight, "7");
to:
var s = new SWFObject("./JW/mediaplayer.swf", theFile, theWidth, theHeight, "7");
and try again, ill check if i see more...

Posted: Fri, 2007-12-21 17:16 jkerr

sweet ..

ok .. now both players load ..

but the playlist still won't trigger the switch ..

sure we don't need to embed this in [CDATA ?

-jeremy

Posted: Fri, 2007-12-21 17:21 andersen

yes - the old demo tests all combinations and show it works just fine without - ill have a look on the new file

Posted: Fri, 2007-12-21 17:40 andersen

change placeholder1 and placeholder2 to main and menu resp. or vice versa

#placeholder1 { position:absolute; left:100px; top:50px; z-index:1; }
#placeholder2 { position:absolute; left:100px; top:300px; z-index:1; }
must correspond with:
<div id="main">
<div id="menu">

and maybe use full paths in the playlist calls just to make sure...

HEY! you only have 6 params in the playlist calls, but 8 in the function:

<info>javascript:createplayer('main', 'p1', './JW/playlist4.xml', '400', '440', false)</info>
must correspond exactly with:
function createplayer(thePlace, thePlayerId, theFile, theWidth, theHeight, theDisplayWidth, theDisplayHeight, go)

Posted: Fri, 2007-12-21 17:44 jkerr

YESYES! YES! YES! YES! ! YES! YES! YES!
YES! YES! YES! YES!
YES! YES! YES! YES!

THANK YOU!!!!!

it works! it works! it works!

that was a hard day's work ..

and a great learning experience ..

andersen ... you rock ...

thank you, thank you thank you .

-jeremy

Posted: Fri, 2007-12-21 17:57 jkerr

oh .. and happy holidays .. this was a nice way to go into vacation ..

-jeremy

Posted: Fri, 2007-12-21 17:57 andersen

youre welcome! - and same to you! (yeah, you kind of put me to work on this one, but im glad it worked out!)

Posted: Tue, 2008-01-08 10:25 jkerr

Happy new years everyone!

I'm back to work on my prototype, and I'd like to take this idea one step further of using one JW media player's playlist to act as a menu to load different playlists in a second JW media player.

Everything we worked out above is working great!

I've put the idea to a bit of a beta test, and I did get some feedback from some people that I'd like to try to work out.

I've been told that if i'm trying to use this as a menu, it's not ideal that only the download arrow will load the playlist ... the first time i show this to someone, they click the playlist link, and wonder why that doesn't work ...

so, now i'm trying to see if i can also get the playlist link to drive this javascript by using the <location> tag as well. here's my new code in the playlist:

<track>
  <title><![CDATA[&lt;li&gt;&lt;/li&gt;]]></title>
  <creator><![CDATA[<b>Load Playlist 3</b>]]></creator>
  <location><![CDATA[<a href="javascript:createplayer('main', 'p1', './JW/playlist3.xml', '400', '440', '400', '300', false)">Load the Playlist4</a>]]></location>
    <info><![CDATA[javascript:createplayer('main', 'p1', './JW/playlist3.xml', '400', '440', '400', '300', false)]]></info>
    <image></image>
</track>

Of course, the issue I'm encountering is that it either tries to connect to talkr, or if i try to add the <type> flashvar, there isn't a supported type that looks like it would work for this ..

is there anyway i can trick to get javascript to work from a playlist item? that would be the final touch on this idea that would make it perfect!

cheers,

-jeremy

Posted: Tue, 2008-01-08 15:49 andersen

a couple of ideas:

how about loading a file with the name and a description of the submenu and letting talkr read it aloud instead?
(could be a .mp3 file, image or .flv video instead too ofcourse)

and then just use the js-api to load the submenu as if the download-arrow had been clicked when clicking the items...
(please note that the js-api only works online http://home5.inet.tele.dk/nyboe/flash/mediaplayer/javascript.htm )

please see the annotationdisplay demo on the demopage: http://home5.inet.tele.dk/nyboe/flash/mediaplayer/
http://home5.inet.tele.dk/nyboe/flash/mediaplayer/annotationdisplay.htm
it shows the content of the <annotation> tag of the playlist as html on the page -
you would call the submenu creating script instead...

the following code shows the content of the <annotation> tag in an alert window called from a function:

<html>
<head>
<style type=text/css>
#placeholder { position: absolute;left: 50px; top: 140px; }
</style>
<script type="text/javascript" src="swfobject.js"></script>

function getUpdate(typ,pr1,pr2,pid) {
if(typ == "item") { currentItem = pr1; setTimeout("getItemData(currentItem)",100); }
};

function getItemData(idx) {
var obj = thisMovie("playerId").itemData(idx);
doTheThing(obj["description"]);
};

function thisMovie(movieName) {
if(navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName];
} else {
return document[movieName];
}
};

function doTheThing(arg) {
alert(arg);
}

function createPlayer() {
var s = new SWFObject("mediaplayer.swf","playerId","300","300","7");
s.addParam("allowfullscreen","false");

s.addVariable("usefullscreen","false");
s.addVariable("file","playlist_annotationfunction.xml");
s.addVariable("width","300");
s.addVariable("height","300");
s.addVariable("displayheight","200");

s.addVariable("overstretch","fit");
s.addVariable("showicons","false");
s.addVariable("shuffle","false");
s.addVariable("linktarget","_self");

s.addVariable("enablejs","true");
s.addVariable("javascriptid","playerId");

s.write("placeholder");
}
</script>
</head>
<body onLoad="createPlayer()">

<div id="placeholder">
<a href="http://www.macromedia.com/go/getflashplayer">Get Flash</a> to see this player.</a>
</div>

</body>
</html>

Posted: Thu, 2008-02-28 11:11 Pete

I've read through this thread and have accomplished this in a somewhat different manner. See code below:

My PHP Page that loads first:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<center>
<head>
  <script type="text/javascript" src="/shared/flash_video/swfobject.js"></script>
  
  <script type='text/javascript'>
    var currentState;
    var currentPlaylist;
    var started;
    function thisMovie(movieName)
    {
      if(navigator.appName.indexOf("Microsoft") != -1)
      {
        return window[movieName];
      }
      else
      {
        return document[movieName];
      }
    };
    function sendEvent(typ, prm)
    {
      thisMovie('mpl').sendEvent(typ, prm);
    };
    function loadFile(obj)
    {
	  thisMovie('mpl').sendEvent('stop');
      thisMovie('mpl').loadFile(obj);
      started = false;
      // instrumentation for debug
      lf = document.getElementById('loadfile');
      lf.innerHTML = 'Playlist Loaded: ' + obj['file'];
    };
	function getUpdate(typ, pr1, pr2, pid)
    {
      if((pid != 'null') && (pid == 'mpl'))
      {
        if(typ == 'state')
        {
          currentState = pr1;
          
          if((currentState == 0) && (!started))
          {
            thisMovie('mpl').sendEvent('playitem', 0);
            started = true;
          }
		  
          // instrumentation for debug
          st = document.getElementById('currstate');
          st.innerHTML = 'State: ' + currentState;
        }
      }
    };
  </script>
  <script type='text/javascript'>
    function createPlayer()
    {
      var s1 = new SWFObject('/shared/flash_video/mediaplayer.swf', 'mpl', '950', '500', '8');
          s1.addParam('wmode',               'opaque');
          s1.addVariable('width',                '950');
          s1.addVariable('height',               '500');
          s1.addVariable('displaywidth',      '640');
          s1.addVariable('file',                   '/shared/flash_video/startup.xml');
          s1.addVariable('overstretch',       'false'); // expands to fit h or v  "false" -will stretch them to fit
          s1.addVariable('showdigits',        'true');
          s1.addVariable('autostart',           'true');
          s1.addVariable("bufferlength",     '1');
          s1.addVariable('shuffle',              'false');
	  s1.addVariable('backcolor',         '0x3a4273');
	  s1.addVariable('frontcolor',          '0xFFFFFF');
          s1.addVariable('repeat',               'list');
          s1.addVariable('rotatetime',         '9999');
          s1.addVariable('showicons',        'true');
          s1.addVariable('enablejs',           'true');
          s1.addVariable('javascriptid',       'mpl');
          s1.addVariable('linkfromdisplay',  'true');
          s1.addVariable('linktarget',          '_self');
          s1.write('player');
    };
  </script>
</head>
<body onload="createPlayer();">
  <div id="player">
    <a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Plugin</a> 
    to see this video.
  </div>
  
</center>
</body>
</html>

startup.xml

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>
<track>
<title>Agent Login and Navigation</title>
<creator></creator>
<location>/shared/flash_video/start2.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/agent.xml'});]]></info>
</track>
<track>
<title>Buyer Experience</title>
<creator></creator>
<location>/shared/flash_video/start2.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/buyer.xml'});]]></info>
</track>
<track>
<title>Seller Experience</title>
<creator></creator>
<location>/shared/flash_video/start3.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/seller.xml'});]]></info>
</track>
<track>
<title>Promoting Your Website</title>
<creator></creator>
<location>/shared/flash_video/start4.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/promoting.xml'});]]></info>
</track>
<track>
<title>:::::HOW TO OPERATE THE FLASH PLAYER:::::</title>
<creator></creator>
<location>/shared/flash_video/start.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/how_to.xml'});]]></info>
</track>
</trackList>
</playlist>

seller.xml

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>
<track>
<title>Intro Powerpoint Overview</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>seller_intro_ppt_overview.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Review of Delta Doors</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>seller_review_of_delta_doors.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Virtual Market Analysis Part 1</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>virtual_market_analysis_part_1.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Competitive Market Analysis</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>competitive_market_analysis.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Virtual Market Analysis Part 2</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>virtual_market_analysis_part_2.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Finding and Responding to Leads Part 1</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>finding_and_responding_to_leads_part_1.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Finding and Responding to Leads Part 2</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>finding_and_responding_to_leads_part_2.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Viewing and Working with Contacts</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>viewing_and_working_with_contacts.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Portfolio Navigation</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>portfolio_navigation.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Processed Leads and Tools Tab</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>processed_leads_and_tools_tab.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>Outro PowerPoint Exit</title>
<creator></creator>
<location>rtmp://69.212.176.158/oflaDemo</location>
<identifier>seller_outro.flv</identifier>
<meta rel="type">rtmp</meta>
</track>
<track>
<title>:::::RETURN TO THE MAIN SCREEN:::::</title>
<creator></creator>
<location>/shared/flash_video/main_screen.jpg</location>
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/startup.xml'});]]></info>
</track>
</trackList>
</playlist>

The rest are pretty much the same, just different flv's. Here is my new problem that I think is possible, but just not sure how to accomplish it.

In the field below, it will load a new XML file...now is there anyway to load another webpage?
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/startup.xml'});]]></info>

Instead of calling an XML, I want to call a .php/.html/.htm/whatever, but a webpage. Could this be done with a "getURL" function? From what I've read you need to declare a function to do that and if thats the case...it can't be done from within the XML file. So what if I make a file called "website.js", type in that function and load that file using:
<info><![CDATA[javascript:loadFile({file:'/shared/flash_video/website.js'});]]></info>

Posted: Thu, 2008-02-28 11:39 AJAX

loadFile() is function that is written to load a new file into the player.

You can put ANY JavaScript that you want in the info element. However, when I want to do lots of things, I like to create a function in the JavaScript on the player page and call that function. Purely a matter of style though. It does save repeating the JavaScript in every track, but that's done by a playlist generator, so no big deal.

To call a new page from JavaScript, use location.href="newpage.html".

Posted: Thu, 2008-02-28 14:52 Pete

@AJAX

Thank you very much!! It worked!!
I used this for my XML and it loaded it right up:

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>
<track>
<title>:::::RETURN TO THE MAIN SCREEN:::::</title>
<creator></creator>
<location>/shared/flash_video/main_screen.jpg</location>
<info><![CDATA[javascript:location.href="http://www.google.com";]]></info>
</track>
</trackList>
</playlist>

Is there any attributes you can use? Like to load into another frame or "_blank"?

On a weird note...since I added this to the XML files...my fullscreen hasn't been working! If you check a few posts up at my PHP file...maybe you can see why? I tried 2 things and it still won't work:
1)downloaded and tried v3.10-v3.15
2)used flashvars s1.addVariable('usefullscreen', 'true');

But I don't know what could be causing this? Any idea?

Posted: Thu, 2008-02-28 19:46 AJAX

You have to use this if you want fullscreen enabled:s.addParam("allowfullscreen","<strong>true</strong>");

linktarget can be: _self, _blank, _top, _parent, or any target that you name yourself (of course, it has to exist).

Posted: Sat, 2008-03-01 19:42 waterox

I've managed to get both the above examples working, which is bloody awesome.
Thank you guys for sharing the results of your hard work!
The real icing on the cake now would be to have thumbnails of album covers opening each tracklist.

I agree with the results of that user testing. The teeny little arrow isnt really intuitive.
Either clicking on an image or the box to change playlists would be much better.

Any ideas for a solution?

Posted: Sat, 2008-03-01 21:25 AJAX

The real icing on the cake now would be to have thumbnails of album covers opening each tracklist.

It's easy. Make sure that you have at least this minimal JavaScript API code:

  <script language="javascript">
    function thisMovie(movieName)
    {
      if(navigator.appName.indexOf('Microsoft') != -1)
      {
        return window[movieName];
      }
      else
      {
        return document[movieName];
      }
    };
  </script>

Then place your images wherever you want them on your page with this code:<img src="image01.jpg" alt="Click Here to load Playlist One" width="60" height="40" onclick="javascript:thisMovie('mpl').loadFile({file:'playlist_one.xml'});" />Use width & height if you need to resize the images, change the image to yours, change the playlist to yours.

Posted: Sun, 2008-03-02 11:47 waterox

Hi, Thanks for the quick reply!

I must apologise, my javascript skills are not strong..

I couldnt get that example to work, but may be making an obvious mistake here.

http://www.yanwhite.com/flash/player/mp3/jw-menu-test.php

Posted: Sun, 2008-03-02 13:01 frameByframe

The player's name ( also known as "movie name" ) in the first line of code, in the javascriptid, and in references to the movie/player ( such as here: thisMovie('moviename/javascriptid') ), must be the same.

Since you've already smacked 'p1' into a JavaScript variable named 'thePlayerId' you can use the JS variable.

Add this to the player codes.addVariable("javascriptid", thePlayerId);It's not strictly required for a single player, but let's not get sloppy.

And then use that same JS variable in your image code:<img src="afraid.jpg" alt="Click Here to load Playlist One" width="300" height="150" onclick="javascript:thisMovie(thePlayerId).loadFile({file:'playlist3.xml'});" />

Posted: Sun, 2008-03-02 22:51 frameBYframe

With a small JavaScript function, you can also have a larger image appear when the user clicks on the thumbnail. That larger image can either be closed with a click or it will be replaced when the next track is selected or it could disappear after, say 5 seconds or so.

See a demo here [url=http://willswonders.myip.org:8085/php/scrolling_div_shuffle.html]Scrolling Div Playlist with Shuffle and Popup Image[/url]. (The images are all squishy, don't let that throw you off, look at the functionality.)

Posted: Mon, 2008-07-07 12:01 Pete

I wanted to bring this thread back to life and see if there is anyway to load another XML from an XML using JavaScript in Actionscript 3 with the new JW Player 4.0? The old method of using ![CDATA[javascript:loadFile({file:'/shared/flash_video/agent.xml'});]] doesn't work anymore.
This is what my XML looks like now, but can't load another XML from within it like I was able to using v.3.16

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
	<trackList>
		<track>
			<title>Testing Movie</title>
			<annotation>0:51</annotation>
			<location>rtmp://mydomain/oflaDemo/tester.flv</location>
		</track>
		<track>
			<title>RETURN TO THE MAIN SCREEN</title>
			<annotation>test</annotation>
			<location>![CDATA[javascript:loadFile({file:'/shared/flash_video/agent.xml'});]]</location>
		</track>
	</trackList>
</playlist>

Posted: Mon, 2008-07-07 13:39 basic

There is no loadFile() function in the v4.0 player.

The v4.0 player uses a different method of loading using sendEvent().

You can see similar code here: http://www.jeroenwijering.com/?thread=11520

To simply load a playlist, the code would be something like this:

      function addPlaylist(newItem)
      {
        var player  = document.getElementsByName(player_id)[0];
        player.sendEvent("LOAD", newItem);
      };

Then call addPlaylist() in your playlist:<location>![CDATA[javascript:addPlaylist({file:'/shared/flash_video/agent.xml'});]]</location>Unfortunately, I don't have tested and working code, but this should be pretty close.

The new JavaScript API is well documented here: http://code.longtailvideo.com/trac/wiki/FlashVars

Posted: Mon, 2008-07-07 15:00 Pete

I'll definitely have a look see, but thank you very much for a starting point!! I'll let you know if I find anything that works.

Posted: Tue, 2008-07-15 13:11 Pete

Ok, I found something that works!!!

I did what basic said and if I add this code:

function addPlaylist(newItem)
{
var player = document.getElementsByName('mpl')[0];
player.sendEvent("LOAD", newItem);
};

where 'mpl' is your player id (make sure to include the quotes around it!!) That's where I was having the problem, didn't have the quotes!!

Then add this in the XML:
<info>![CDATA[javascript:addPlaylist({file:'/shared/flash_video/playlist_letmetry-2_v4.xml'});]]</info>

Be sure to add these flashvars too:

	  s1.addVariable('displayclick',	 'link');
          s1.addVariable('linktarget',       '_self');

Clicking on the screen will change the playlist to the new playlist!! I have some tweaking to do first, then I should be set. Hope this helps someone! Thanks for all the help!!

Posted: Mon, 2009-12-21 22:11 Mcbryan

I written a way that works by editing the playlist.as and controller.as with less than 5 lines of code.

Posted: Mon, 2009-12-21 22:51 Mcbryan

I forgot to add an example:
http://plustv.elementfx.com/Test/FlashTest.php

I'm still working on it so it may be down on times and I need to modify the stylish skin to remove the thumbnail when there is no image (when it's a menu button) but it show's the menu and submenu structure. I think the I have about at least 5 submenus at the most depending on the 'road' taken (not sure what to call the click path between submenus).

Posted: Tue, 2009-12-22 04:49 Mcbryan

I just noticed how many typos I had >.> I've been having trouble lately with random keys not working and it's really thrown me off. Like the right shift and #s 4 and 6 ;_;

Load a playlist from second playlist?

JW Player

AddOns

AdSolution

Bits on the Run

Open Video Ads

Company