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

Forums

/

How to use preview pictures with a playlist?

11 replies [Last post]

Hello,
I would like to use the playlist version together with no autostart but a preview piscture.
I changed the playlist.xml to put in prewiew pictures.
But when I open the site with the player only the picture appears for the one video which is preselected.
When I klick in the playlist on another File theres no prewiew picture.
The same when I klick again on the File wich was selected before and did show the image.
Theres noc image anymore.
I have no idea where's the problem :(
Many thanks for your help.
Enrico

please post a link to your testpage (or at least your page code and playlist)
else it is a guesssing game ;)

I have no testpage yet.
Only on my desktop.

playlist.xml:

<playlist version="1" xmlns="http://xspf.org/ns/0/">
<trackList>

<track>
<title>LST beim Jumpen</title>
<creator>morpheus74</creator>
<location>video.flv</location>
<image>LST.jpg</image>
</track>

<track>
<title>Bashen</title>
<creator>morpheus74</creator>
<location>video.flv</location>
<image>Bashen.jpg</image>
</track>

<track>
<title>MTA</title>
<creator>morpheus74</creator>
<location>video.flv</location>
<image>MTA.jpg</image>
</track>

</trackList>
</playlist>

html:

<html>
<head>

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

</head>
<body bgcolor="black">

<h3 align="center"><font color="white">Unsere Videos vom Bashen, Jumpen und einfach nur Spaß haben.</font></h3>
<p>Um das Video zu starten, darauf klicken oder Video aus der Playlist wählen.</p>
<p>Erneutes Klicken stoppt die Wiedergabe.</p>
<p>Download der Videofiles über den Button rechts in der Playliste (neben dem Videotitel)</p>

<p id="player2"><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("flvplayer.swf","playlist","400","500","7");
s2.addParam("allowfullscreen","true");
s2.addVariable("file","playlist.xml");
s2.addVariable("displayheight","300");
s2.addVariable("backcolor","0x000000");
s2.addVariable("frontcolor","0xCCCCCC");
s2.addVariable("lightcolor","0x557722");
s2.addVariable("autostart","false");
s2.write("player2");
</script>

</body>
</html>

there one thing more:

even as the var autostart is false the video begins to play when I select a line in the playlist. should not the preview picture be shown first and only by clicking the play button in the player the video has begin to play?

i have tested your code/playlist (using a mediaplayer.swf, should make no difference though)
and it seems to be perfect!
this seems to be the way the player works...
when you click on an item it will play -
but NOT select a preview, and wait for one more click - BUT it will show the image AFTER playing...
you can use the pitures in the playlist though, by setting
s2.addVariable("thumbsinplaylist","true");

if you want two clicks to show a movie, you will have to make your own custom playlist using html/css/javascript to recreate the player showing a preview and waiting for a click to start - please see these [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/]demos[/url] for such methods...

Many thanks!!! :d

This does what I want to have. it's better than having 2 clicks :d

[quote="andersen"]s2.addVariable("thumbsinplaylist","true");

hi there,
i am also using your little swfmediaplayer for playing some mp3s. thanks for that.

i seem to have the same "problem".
the pictures in the player are only showing up AFTER the song was completely cached. how can i change this to the picture is shown BEFORE the song is starting to cache&play.

i am using myspace, so dont know how to transcribe the s2.addvariable to it.
maybe you can help.
it lookes like this currently:

<object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="180" width="450" data="http://www.fileden.com/files/2007/6/28/1221249/mp3player.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.fileden.com/files/2007/6/28/1221249/mp3player.swf" />
<param name="flashvars" value="&file=http://www.fileden.com/files/2007/6/28/1221249/playlist.xml&dheight=180&width=450&displaywidth=180&bufferlength=5&shownavigation=true&lightcolor=0xFFFFFF&frontcolor=0xCCCCCC&backcolor=0x000000&repeat=list&autostart=true&shuffle=false" />
</object>

thank you!

edit/:ps. adding just "thumbsinplaylist=true" to the flashvarsvalue doesnt seem to work..

Your pictures show up as soon as I select a track from your playlist.

Your playlist is missing the first line, which should be:

<?xml version="1.0" encoding="UTF-8"?>

and there are some small errors in your flashvars.

<param name="flashvars" value="file=http://www.fileden.com/files/2007/6/28/1221249/playlist.xml&width=450&displaywidth=180&height=180&displayheight=180&bufferlength=5&lightcolor=0xFFFFFF&frontcolor=0xCCCCCC&backcolor=0x000000&repeat=list&autostart=true&shuffle=false" />

(displayheight was mis-pelled and shownavigation is only for the imagerotator.)
Your embed code will give you a display area 180x180, with the playlist on the right, and no control bar.

great, thanks for your fast support!

i did like you said, but the issue is still the same here:

ok,
i am loading the webpage, since autostart is enabled,
the first song starts, but no picture at all.
now when i click on the second song,
the picture is indeed directly shown,
BUT it is the picture of the FIRST song!
when you click on the 3rd song, the picture of the 2nd is shown, and so on..

starting the webpage,
when you wait until the first song is fully cached,
the picture is shown then correctly.
when clicking on the second song then,
it is the same, no picture until it is fully cached..

greets

If you're not on a social networking site such as Myspace which requires you to use <embed> code, try the SWFObject method of instantiating the JW Player.

Put this in the <head> section of yur HTML doc.

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

  <script type='text/javascript'>
    function createPlayer()
    {
      var s1 = new SWFObject('http://www.fileden.com/files/2007/6/28/1221249/mp3player.swf', 'playlist', '450', '180', '9');
          s1.addParam('allowScriptAccess',   'never');
          s1.addParam('allowNetworking',     'internal');
          s1.addVariable('width',            '450');
          s1.addVariable('height',           '180');
          s1.addVariable('displaywidth',     '180');
          s1.addVariable('displayheight',    '180');
          s1.addVariable('file',             'http://www.fileden.com/files/2007/6/28/1221249/playlist.xml');
          s1.addVariable('overstretch',      'false'); // expands to fit h or v  "false" -will stretch them to fit
          s1.addVariable('bufferlength',     '5');
          s1.addVariable('showdigits',       'true');
          s1.addVariable('autostart',        'true');
          s1.addVariable('repeat',           'list');
          s1.addVariable('shuffle',          'false');
          s1.addVariable('showicons',        'true');
          s1.addVariable('backcolor',        '0x000000'); // face of buttons
          s1.addVariable('frontcolor',       '0xCCCCCC'); // button symbols & playlist text
          s1.addVariable('lightcolor',       '0xFFFFFF'); // highlighted playlist item
          s1.addVariable('screencolor',      '0x000000'); // screen background color
          s1.write('player');
    };
  </script>

</head>

Change/add this to your <body> tag:

<body onload="createPlayer();">

Put this where you want the player to appear:

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

eh, thanks, but i am only on myspace.
so you get the same issue?
if it is a bug i can wait a little till its fixed :)..

so meanwhile there is no way/trick around it?

I don't know anything about MySpace. Are other users having the same problem? Have you checked in the MySpace topic in these forums?