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:
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.
I’ve tried to use the modifications on my site but I get a 2032 error. I am currently using Jw player with gallery by adding the following to the .class file.
$playerUrl = $urlGenerator->generateUrl(
array(‘href’ => ‘modules/flashvideo/lib/player.swf’),
array(‘forceFullUrl’ => true));
$flashVars = sprintf(‘type=video&controlbar=over&autostart=true&stretching=none&file=%s’,
urlencode($src));
This works but I have to set the player to a fixed size. I would like for the player to automatically fit the video. Should your implementation allow for this?
You’ll need to reference height and width in your flashVars.
If you copied and pasted my code, that might explain the 2032 error since WordPress has a tendency to replace my singe/double quotes with stylized quotes.
I downloaded the file from your link. That is where I got the 2032 error.
I don’t know anything about code. I have reverted back to the original FlashVideoRenderer.class that is included with the G2 Flashmodule. I have made the changes that I indicated above. This allows the videos to play but the player size is fixed based on the following line:
Do you know of a way that I can set this height and width based on the dimensions of the video so that is sized correctly for every video?
Thanks
John
As suggested earlier, you should try referencing the height/width in $flashVars:
$flashVars = sprintf('type=video&controlbar=over&autostart=true&stretching=none&file=%s&height=%s&width=%s#39;,
urlencode($src),$height,$width);
I tried this but it didn’t work. Any other suggestions?
If you could give me a link to sample in question, I could take a look…
My current .class file is here
http://blueskeyes.com/temp/FlashVideoRenderer.class
Here is a link to one movie that is 512×384. This is the size that the player is set to in the .class file. http://blueskeyes.com/gallery/main.php?g2_itemId=29052
Here is a link to a movie that is vertical 288 x 384. I have set the background in the .class file to match the background in my gallery. This makes it appear as though the player is sized correctly but you can tell from the control bar that it is not. http://blueskeyes.com/gallery/main.php?g2_itemId=28979
I think if I understood the syntax I would be able to figure it out but I’m at a total loss.
Thanks for taking the time to look at this. I really appreciate it.
Try tinkering with the following:
var so = new SWFObject("%s", "%s", "100%%", "100%%", "9.0.28.0", "ffffff");
the 2 100%% represent width and height respectively. Telling it to use 100% would make it expand to the size of it’s container, which is currently defined in:
<div id="flashvideo" style="align:left;width:512px; height:384px">
What I would suggest is replace the 2 100%%s above with %s, and stick $width and $height in the correctly location in parameters (basically before $SWFObjectUrl)
Thanks,
I made the suggested change to the var so line.
The $height and $width were added as follows
$SWFObjectUrl, $jsWarning, $playerUrl,
!empty($params[‘id’]) ? $params[‘id’] : ‘movie’, $width, $height, $flashVars, $expressInstallUrl);
I didn’t understand what all of the %s were for. Thanks again for all of your help. I’ve been messing around with this for days. Now everything works the way that I wanted.
Now I remember where I heard about this JW FLV Media Player. It was in the Dreamhost newsletter.
Hi can you help me out im trying to align my JW player by % or px … example 100px to the left do you know the html for that?
You’ll probably need to insert code around the jwplayer object to deal with alignment.
Hi,
In my installation the default g2 player is not playing flv files, (starts a download) can you help fix this problem?
Do you have the Flash Video plugin?
http://codex.gallery2.org/Gallery2:Modules:flashvideo
Yes the flashvideo plugin is installed. Here is the gallery link: http://www.angelav.com/gallery.
Hmmmm, that’s really weird. Usually if it’s detected as an unknown type, instead of automatically redirecting you to download, it opens a page with a Download link. You appear to be using some custom theme. Have you tried 1 of the default themes?
I am using the default matrix theme, with the custom header and footer used from my site, I just added a wmv file and it launches the media player instead. Do check it out and let me know if you have any suggestions.
Sorry it took so long to reply. Looks like you got Gallery2 to play flv files now. 🙂
The problem was with the thumbnail manager, I uninstalled it, ffmpeg then started doing its job, after reinstalling thumbnail manager things are still ok! It was quite an experience I went through!
Warm regards.
I’ve used your instructions in the past to successfully switch out the flash player in Gallery2, but I seem to hitting a brick wall this time around. What’s interesting to note is that the FlashVideoRenderer.class files are different between the two installs, even though the version of the FlashVideo plug-in in both installs of Gallery2 is 1.0.3.
The revision number of the class file that works for me is 15953 and the revision number of the class file I can’t get to work with the JW player is 17580.
Have you had any experience with trying to change out the flash player in Gallery2 on this newer version of class file? My attempts have failed and my search for an answer has been fruitless.
@bcj: I haven’t actually touched any Gallery2 code for some time nor updated to the recent versions.
I know there’s been some changes to JW FLV Player where type=flv should be changed to type=video.
Also, does the jw player code show up on the generated page? That’ll show if you’re actually executing that part of the code or not. If it’s showing up, then you’ll need to find out why that code isn’t displaying the video anymore. If it’s not showing up, you’ll need to trace why it’s not entering the flash video code anymore.
Success at last. Turns out there are a handful of words that changed between versions. Your input was very helpful as I was able to get to a point where the player showed but no video, so that helped me focus my search on why the video wasn’t loading.
Soon as I find some time this week I’ll post my findings. Thanks!
Maybe this will help some people trying to update more recent files:
http://bcjphotography.com/blog/blog/gallery2-with-jw-player/
@bcj: Thanks!
Hi there,
very usefull instructions! Thanks
Is there a way to display the thumbnail of the video also.
Thanks in advance!
hi there,
did you already update yoour gallery2 the same way for mp3?
how to do this?
thx & br,
bjoern
@Bjoern Unfortunately I’ve stopped using Gallery2 for quite some time and don’t really remember much about it anymore. I did get it JW Player working with mp3s and if I recall, there was some way to map it in their admin panel to do that.