Updated Gallery2 to Use JW FLV Media Player

So this little exercise started with the fact I was introduced to the JW FLV Media Player a few weeks back. Today, I wanted to share an flash video and thought it would be a good time to hack Gallery2 to use this flv video player.

If you’ve seen flash videos in my Gallery before, you’ve noticed it was using the default G2flv (Gallery2 Flash Video) player:

G2flv Player

One of the things I disliked about it was that it didn’t have a full screen mode, and it’s double-size feature behaved differently in IE and Firefox.

So I downloaded the latest version of JW FLV Media Player (currently at 4.3) and uploaded into the libs folder: /modules/flashvideo/lib

Then I had to modify modules/flashvideo/classes/FlashVideoRenderer.class to tell it to use the new flv player. I would highly recommend you back up that file before you modify it. Here’s a copy of what my resulting FlashVideoRenderer.class looks like: FlashVideoRenderer.class using JW FLV Media Player.

I’ll explain the changes I made.

I disabled forceSessionId as the url generated wasn’t like by the script. I’m guessing it did not like the ‘?’. I also added a pointer to the new .js file and updated the playerUrl.

$urlGenerator =& $gallery->getUrlGenerator();
$src = $urlGenerator->generateUrl(
        array('view' => 'core.DownloadItem',
              'itemId' => $entity->getId(),
              'serialNumber' => $entity->getSerialNumber()),
        array('forceFullUrl' => true,'forceSessionId' => false,
              'htmlEntities' => false));
list ($width, $height, $title) =
        array($entity->getWidth(), $entity->getHeight(),
              $item->getTitle());
GalleryCoreApi::requireOnce(
    'lib/smarty_plugins/modifier.markup.php');
$title = smarty_modifier_markup($title, 'strip');
 
/* Default player: G2flv.swf */
$swfObjectUrl = $urlGenerator->generateUrl(
        array('href' => 'modules/flashvideo/lib/swfobject.js'),
        array('forceFullUrl' => true));

$playerUrl = $urlGenerator->generateUrl(
        array('href' => 'modules/flashvideo/lib/player.swf'),
        array('forceFullUrl' => true));
$flashVars = 'flvUrl=' . urlencode($src) . '&Width=' . $width .
            '&Height=' . $height . '&title=' .
            urlencode($title);
$extraAttr = '';

This remaining was basically following the instructions on JW FLV Media Player on how to use their code. I also added another paragraph where I would put the fallback code (e.g. Download Movie). If you prefer that to only show up when the item could not load, I would suggest putting the %s in the paragraph above.

return sprintf(
    '<div id="flashvideo">
 
        <p id="%s" %s%s></p>
        <p id="fallback">%s</p>
 
        <script type="text/javascript" src="%s"></script>
        <script type="text/javascript">
        var s1 = new SWFObject("%s","player","%s","%s","9");
        s1.addParam("allowfullscreen","true");
        s1.addParam("allowscriptaccess","always");
        s1.addParam("flashvars","file=%s");
        s1.write("%s");
        </script>
 
    </div>',
 
    !empty($params['id']) ? $params['id'] : 'movie',
    !empty($params['class']) ?
        ' class="' . $params['class'] . '"' : '', $extraAttr,
    $fallback, $swfObjectUrl, $playerUrl, $width,
    $height, $src,
    !empty($params['id']) ? $params['id'] : 'movie');

I’ll probably update my Gallery2 mp3 audio player to use this new player some time in the future.