Creating a video gallery, from thumbnail to lightbox video
| Project: | Lightbox2 |
| Version: | 6.x-1.9 |
| Component: | Miscellaneous |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Jump to:
Hello guys
I'm working on a video gallery and I can't find the solution to my problem, after many tests.
Based on a custom content-type "Video", with a title, a .flv filefield and a thumbnail imagefield, I'm creating a view to display all the video of the website. I want to display the thumbnail image (resized with imageCache), then on a click play the video with Lightbox effect. I know it's been done, so I'm confident a solution exists. The view is a node-type view. I retrieved the video field as the "path to the file" and excluded it from the display, so I can use this path to write my own ouput of the thumbnail field, which is :
<a href="[field_video_fid]" rel="lightvideo[Videos]">[field_thumbnail_fid]</a>
So the link is correct, but on the click it starts displaying the lightbox during half a second then show the flv file inside the browser as text, with undecipherable caracters. I can display the video directly without any Lightbox effect, with the "as Flash video" format, but I found no way within a lightbox...
Modules used :
- Drupal 6.12
- Lightbox2 1.9
- CCK last -dev (because of the Flash player)
- Views 2.5
- SWF Embed 1.0
- Flashy last -dev (no official release yet, but stable)
- getId3 1.2 (last release - used to retrieve video size)
Maybe my method isn't correct, or I missed a detail. If I used Flashy, it's because the video are self-hosted (light traffic, own videos, free player). Please help !

#1
Ok, now for some unknown reasons - maybe a "flush all caches", documentation reading so the link is better written now, and many more tests with views - the flash appears within a lightbox normally, but I have no playback...
I think I found out why : when viewving the node (node/id) without lightbox, the html for the flash player looks like this :
<object type="application/x-shockwave-flash" data="/skyzone/sites/all/modules/flashy/videoPlayer.swf" height="240" width="320"><param value="true" name="allowFullScreen"><param value="maintainAspectRatio=true&video=http://localhost:8080/[client-name]/sites/default/files/videos/cheezipuffs.flv" name="flashvars"></object>It's embedded within
<object>markup, thanks to SWF Embed module.But within the lightbox, through the view, the code changes to :
<embed type="application/x-shockwave-flash" src="/skyzone/sites/all/modules/flashy/videoPlayer.swf?file=http://localhost:8080/[client-name]/sites/default/files/videos/jumps_3.flv" id="flvplayer" name="flvplayer" bgcolor="#ffffff" quality="high" wmode="transparent" allowfullscreen="true" height="400" width="600">Does anybody know how to alter this behavior ? Or know a simple solution to display a few (max. 10) self hosted videos already converted to flv ?
#2
I'm trying to to nearly exactly the same thing, with the same install details - only difference is that I'm not using flash video, rather allowing .mov, .mpg etc, so the
<object>issues above don't applyUsing the Image Attach field, I'm Rewriting the output of the field to:
<a href="[field_filefield_fid]" rel="lightvideo[Videos]">[iid]</a>which is triggering lightbox, but then disappears and fails to play.
DJebbz, how did you rewrite your link to make it work? Any other Views tweaking needed?
#3
Well, I didn't manage to make it... So now I'm displaying my videos one by one normally. Furthermore, I don't use SWF Embed + Flashy, I changed to SWF Tools + Flow Player 3.
You can specify the video player under Lightbox, maybe it works for the Flow Player 3 player run by SWF Tools ? I can't try, because the site's already online, but maybe you could give it a try.
Maybe it comes from the width and height not hard-coded in the output of the field : the Lighbox documentation talks about lightvideo[group|width:300px; height: 200px;].
Hope this helps
#4
Well, I managed to get it working (of sorts) after a lot of tinkering.
Now using SWF Tools and Flowplayer 3, as well as everything above
Referencing the relevant Filefields in Views > Fields with Format 'URL to File', and Exclude from Display
Then, using the image attach thumbnail, rewrote the output of the field to:
<a href="[field_videolink_value][field_filefield_fid]" rel="lightvideo">[iid]</a>This is working well for me, thanks for your help man
#5
i am trying that, too
flowplayer is not working for me. JW player does. any hints about the flowplayer3?
#6
No, I've given up on flowplayer and am now just playing my .mov videos in Quicktime within the Lightbox overlay. Not perfect, but still a pretty good experience wtih the overlay video from thumbnails
#7
did you manage to play a swf in lighbox?
#8
I didn't try, I'm only using .mov. I'll try to test and report back
#9
Hi DjebbZ
Would you mind posting a link to the site that you are building using these modules? I am looking for a solution that is very much the same as you are working on for my companies site.
Thank you.
#10
Subscribing
#11
+1 o/
#12
i finally used LIGHTWINDOW and included it in my code. that was no problem. example: http://www.artwaves.de/landmark
works great and supports swf natively.
#13
I should have answered long ago to #9. Here's the website, with videos displaying normally (I gave up about Lightbox) : www.skyzoneprod.com
#14
So I managed to get my thumbs linked to my FLV videos and trigger the lightbox.
Modules:
- Views
- SWF Tools: JW Player 4
- Lightbox2
- CCK
Views Fields:
1. Content: Video Upload: Excluded from display and set Format as URL to file. (make sure this field is above the View Thumb field)
2. Content: Video Thumbnail: Rewrite the output of this field:
<a href="[field_video_fid]" rel="lightvideo">[field_video_thumb_fid]</a>Format: set to only display thumbnail image.
Test page: http://new.imedge.biz/testvideo
Issue:
When I click on the image thumbs in my gallery, the lightbox opens and the option to download my FLV appears.
Question:
How do I trigger the FLV to play in the lightbox using the Rewrite I have provided above? My player is JWPlayer 4