Using JW FLV player, but playlists don't work

[volcs0]

I got the JW_FLV media player to work, and it is terrific - I like being able to seek through songs.

The problem? Playlists don't work. It only plays the first song and then stops.

When I switch back to the original player, the playlists work.

Maybe there is something wrong with the way the playlist is generated. I've checked out the XSPF specs, and I don't see anything wrong with it.

Any other ideas?

Thanks.

[volcs0]

Well, it seems to be the player. I can advance through the playlist, so I think it is OK. The first song autostarts. But it will never advance from one song to the next.

Ideas?

[volcs0]

OK. got it. Maybe this will help someone.

1. Download the FLV player here:

http://www.jeroenwijering.com/?item=JW_FLV_Player

I used 4.2

Place player.swf and swfobject.js in this folder:

Code: Select all

/var/subsonic/jetty/webapp/flash

2. Open and edit:

Code: Select all

/var/subsonic/jetty/webapp/WEB-INF/jsp/webPlayer.jsp

Add this to the <script> section (or something like it):

Code: Select all

<script type="text/javascript">
   var so = new SWFObject('/embed/player.swf','mpl','470','470','9');
   so.addParam('allowscriptaccess','always');
   so.addParam('allowfullscreen','false');
   so.addParam('flashvars','&playlist=bottom');
   so.write('player');
</script>


3. Take out this line:

Code: Select all

<c:url var="playerUrl" value="/flash/xspf_player.swf?playlist_url=${playlistUrl}&autoplay=true&autoload=true"/>


and replace it with:

Code: Select all

<c:url var="playerUrl" value="/flash/player.swf?playlist_url=${playlistUrl}&autostart=true"/>


Note that you are mainly just changing the name of your flash player to the new FLV one.

4. Replace the <embed> tag with this:

Code: Select all

    <embed src="${playerUrl}" quality="high" bgcolor="#E6E6E6" name="xspf_player" allowscriptaccess="sameDomain"
           type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
           align="middle" height="${height}" width="${width}" flashvars="file=${playlistUrl}&repeat=list&autostart=true&playlist=none&searchbar=false&autoscroll=false&displaywidth=130&overstretch=true&thumbsinplaylist=false&showicons=false&fullscreen=false"></embed>


The "repeat=list" was the variable that was need to enable the playlist to go from one item to the next. Without it, it just plays one song.

5. Save and close.

6. Open and edit

Code: Select all

/var/subsonic/jetty/webapp/WEB-INF/jsp/xspfPlaylist.jsp

Change the <track> section to:

Code: Select all

<track>
<location>${streamUrl}</location>
<image>${coverArtUrl}</image>
<title>${song.musicFile.metaData.artist} - ${song.musicFile.title}</title>
<meta rel="type">mp3</meta>
</track>


7. Reload your Subsonic page. Note that you do not need to stop and restart your Subsonic instance.

8. Enjoy your new player .


I know a lot of what I did is probably redundant/superfluous, but I'm just happy to get it working finally, and I don't want to play with every last variable. Feel free to post here or email or PM me with questions about this. Also, I read somewhere that the FLV player will be auditioned in 3.6, so this may all be moot in a few weeks.

[Kaniass]

You can see this topic: http://forum.subsonic.org/forum/viewtopic.php?t=1265

It seems to work for them but I did their procedure and doesn't work anymore

Please try and let us know.

Kaniass

[volcs0]

You can see this topic: http://forum.subsonic.org/forum/viewtopic.php?t=1265

It seems to work for them but I did their procedure and doesn't work anymore

Please try and let us know.

Kaniass

Yup. That was my starting point for this adventure. The settings in that thread do not work. The modifications I've made above do work. Perhaps the code in that thread was specific for earlier versions of either JF FLV media player (eg. version 2) or an earlier version of Subsonic. In any case, that I have outlined above should work.

[Kaniass]

Yep but unfortunately not working for me
The player is displayed but..... empty.

An idea?

[volcs0]

Yep but unfortunately not working for me
The player is displayed but..... empty.

An idea?

Did you follow my steps exactly as outlined above in my post? The directions in that linked thread will not work for the software versions I posted. I also had a blank player for a long time - until I got the flash vars just right - and I put the correct javascript in the top of my file. Go back and make sure you did everything according to my instructions. If that doesn't work, let me know.

Also, I read somewhere in these forums that this player will be included as an option in the next version of Subsonic, so it might be worth waiting for that.

[Kaniass]

I redo it again => Still the same

My webPlayer.jsp:
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="iso-8859-1" %>

<html>
<head>
<%@ include file="head.jsp" %>
<title>Subsonic</title>

<c:set var="width" value="600"/>
<c:set var="height" value="155"/>

<script type="text/javascript" src="<c:url value="/script/scripts.js"/>"></script>
<script type="text/javascript" language="javascript">

function detach() {
popupSize("webPlayer.view?detached=", 'player', ${width + 20}, ${height + 60});
location.href = "playlist.view?";
}

</script>

<%-- For JW FLV Web Player --%>
<script type="text/javascript">
var so = new SWFObject('/embed/player.swf','mpl','470','470','9');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','false');
so.addParam('flashvars','&playlist=bottom');
so.write('player');
</script>
<%-- End For JW FLV Web Player --%>

</head>

<body class="bgcolor2" <c:if test="${model.detached}">onload="window.focus();window.moveTo(300, 200);"</c:if>>

<c:if test="${not model.detached and not model.default}">
<table><tr>
<td style="padding-right:2em"><div class="back"><a href="playlist.view?"><fmt:message key="webplayer.back"/></a></div></td>
<td style="padding-right:2em"><div class="forward"><a href="javascript:detach()"><fmt:message key="webplayer.detach"/></a></div></td>
</tr></table>
</c:if>

<c:url var="playlistUrl" value="/xspfPlaylist.view">
<%-- Hack to force Flash player to reload playlist. --%>
<c:param name="dummy" value="${model.dummy}"/>
</c:url>

<%-- For JW FLV Web Player --%>
<c:url var="playerUrl" value="/flash/player.swf?playlist_url=${playlistUrl}&autostart=true"/>
<%-- End JW FLV the Web Player --%>


<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
width="${width}" height="${height}">
<param name="allowScriptAccess" value="sameDomain"/>
<param name="movie" value="${playerUrl}"/>
<param name="quality" value="high"/>
<param name="bgcolor" value="#E6E6E6"/>

<%-- For JW FLV Web Player --%>
<embed src="${playerUrl}" quality="high" bgcolor="#E6E6E6" name="xspf_player" allowscriptaccess="sameDomain"
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
align="middle" height="${height}" width="${width}" flashvars="file=${playlistUrl}&repeat=list&autostart=true&playlist=none&searchbar=false&autoscroll=false&displaywidth=130&overstretch=true&thumbsinplaylist=false&showicons=false&fullscreen=false"></embed>
<%-- End JW FLV the Web Player --%>

</object>

<c:if test="${model.detached}">
<p style="text-align:center;margin-top:1em">
<a href="javascript:self.close()">[<fmt:message key="common.close"/>]</a>
</p>
</c:if>

</body>
</html>

My xspfPlaylist.jsp

<?xml version="1.0" encoding="utf-8"?>
<%@ include file="include.jsp" %>
<%@ page language="java" contentType="text/xml; charset=utf-8" pageEncoding="iso-8859-1" %>

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

<c:forEach var="song" items="${model.songs}">

<sub:url value="/stream" var="streamUrl">
<sub:param name="path" value="${song.musicFile.path}"/>
</sub:url>

<sub:url value="coverArt.view" var="coverArtUrl">
<sub:param name="size" value="200"/>
<c:if test="${not empty song.coverArtFile}">
<sub:param name="path" value="${song.coverArtFile.path}"/>
</c:if>
</sub:url>

<track>
<location>${streamUrl}</location>
<image>${coverArtUrl}</image>
<title>${song.musicFile.metaData.artist} - ${song.musicFile.title}</title>
<meta rel="type">mp3</meta>
</track>

</c:forEach>

</trackList>
</playlist>

I am desperate but never mind I will wait the next version !

Kaniass

[volcs0]

If you want to PM me your email address, I'd be happy to send you my modified files.

[volcs0]

If you want to PM me your email address, I'd be happy to send you my modified files.

I tried sending you the files, but I got this error:

XXXXXX@XXXXX.XXX.XXX (your email address here)
No space left on device:
error while writing to tmp/1227100833.28955.XXXX.XXXX.XX:
retry timeout exceeded

Here are my files below, just as I have them.

webPlayer.jsp

Code: Select all

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="iso-8859-1" %>

<html>
<head>
    <%@ include file="head.jsp" %>
    <title>Subsonic</title>

    <c:set var="width" value="600"/>
    <c:set var="height" value="155"/>

    <script type="text/javascript" src="<c:url value="/script/scripts.js"/>"></script>
    <script type="text/javascript" language="javascript">

        function detach() {
            popupSize("webPlayer.view?detached=", 'player', ${width + 20}, ${height + 60});
            location.href = "playlist.view?";
        }


   
    </script>


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


   <script type="text/javascript">
   var so = new SWFObject('/embed/player.swf','mpl','470','470','9');

   </script>


</head>

<body class="bgcolor2" <c:if test="${model.detached}">onload="window.focus();window.moveTo(300, 200);"</c:if>>

<c:if test="${not model.detached and not model.default}">
    <table><tr>
        <td style="padding-right:2em"><div class="back"><a href="playlist.view?"><fmt:message key="webplayer.back"/></a></div></td>
        <td style="padding-right:2em"><div class="forward"><a href="javascript:detach()"><fmt:message key="webplayer.detach"/></a></div></td>
    </tr></table>
</c:if>

<c:url var="playlistUrl" value="/xspfPlaylist.view">
    <%-- Hack to force Flash player to reload playlist. --%>
    <c:param name="dummy" value="${model.dummy}"/>
</c:url>
<c:url var="playerUrl" value="/flash/xspf_player.swf?playlist_url=${playlistUrl}&autoplay=true&autoload=true"/>

<c:url var="playerUrl" value="/flash/player.swf?playlist_url=${playlistUrl}&autostart=true"/>


<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
        codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
        width="${width}" height="${height}">
    <param name="allowScriptAccess" value="sameDomain"/>
    <param name="movie" value="${playerUrl}"/>
    <param name="quality" value="high"/>
    <param name="bgcolor" value="#E6E6E6"/>
    <embed src="${playerUrl}" quality="high" bgcolor="#E6E6E6" name="xspf_player" allowscriptaccess="sameDomain"
           type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
           align="middle" height="${height}" width="${width}" flashvars="file=${playlistUrl}&repeat=list&playlist=none&autostart=true&searchbar=false&autoscroll=false&displaywidth=130&overstretch=true&thumbsinplaylist=false&showicons=false&fullscreen=false"></embed>
</object>
<c:if test="${model.detached}">
    <p style="text-align:center;margin-top:1em">
        <a href="javascript:self.close()">[<fmt:message key="common.close"/>]</a>
    </p>
</c:if>

</body>
</html>


xspfPlaylist.jsp

Code: Select all

<%@ include file="include.jsp" %>
<%@ page language="java" contentType="text/xml; charset=utf-8" pageEncoding="iso-8859-1" %>

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

<c:forEach var="song" items="${model.songs}">

<sub:url value="/stream" var="streamUrl">
<sub:param name="path" value="${song.musicFile.path}"/>
</sub:url>

<sub:url value="coverArt.view" var="coverArtUrl">
<sub:param name="size" value="200"/>
<c:if test="${not empty song.coverArtFile}">
<sub:param name="path" value="${song.coverArtFile.path}"/>
</c:if>
</sub:url>

<track>
<location>${streamUrl}</location>
<image>${coverArtUrl}</image>
<title>${song.musicFile.metaData.artist} - ${song.musicFile.title}</title>
<meta rel="type">mp3</meta>
</track>

</c:forEach>

</trackList>
</playlist>


[Kaniass]

Thank you for your help but it doesn't work anymore.
I dont know, maybe, its because I am on Vista.

I give up

[aphuey]

Would anyone be open to me seeing their implementation of the FLV Player on their site? My interest is piqued but I'd like to see it before I take the time to implement it (not even sure that I'm capable of implementing, but I might give it a shot). Even just a screenshot would be great!

Thanks!
Ben

[gillespam]

Would anyone be open to me seeing their implementation of the FLV Player on their site? My interest is piqued but I'd like to see it before I take the time to implement it (not even sure that I'm capable of implementing, but I might give it a shot). Even just a screenshot would be great!

Thanks!
Ben

There you go :

- The track being played is the first one - with the grey background.
- The track with the white background is selected (mouse pointer on it, only the cursor doesn't appear).

Neat features :
- You can scroll throught the playlist loaded in the player with your mouse wheel.
- Clicking the artwork in the player will pause/resume playing.

I followed those instructions (server = linux) and it worked like a charm - I kept the custom colors as they matched the theme I choosed.

[koboabe]

I was able to get the player embedded, but I cannot view playlists

when i hit pause the player shows album art, but otherwise it is just an empty black screen

how do I enable the file list and album art like the screenshot above

my xspfplaylist is below

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<%@ include file="include.jsp" %>
<%@ page language="java" contentType="text/xml; charset=utf-8" pageEncoding="iso-8859-1" %>

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

<c:forEach var="song" items="${model.songs}">

    <sub:url value="/stream" var="streamUrl">
        <sub:param name="path" value="${song.musicFile.path}"/>
    </sub:url>

    <sub:url value="coverArt.view" var="coverArtUrl">
        <sub:param name="size" value="200"/>
        <c:if test="${not empty song.coverArtFile}">
            <sub:param name="path" value="${song.coverArtFile.path}"/>
        </c:if>
    </sub:url>

        <track>
<location>${streamUrl}</location>
<image>${coverArtUrl}</image>
<title>${song.musicFile.metaData.artist} - ${song.musicFile.title}</title>
<meta rel="type">mp3</meta>
</track>

</c:forEach>

    </trackList>
</playlist>


[koboabe]

so I got it sorted out
this does not work with JW FLV Player 4.2, but it is working great with 3.16
Thanks