Hello. First, I want to give you a big THANK YOU!!! For this solution: https://www.drupal.org/node/2335639 (making Flickr videos play in the Colorbox). This is really fabulous. Next I want to apologize, I'm three weeks late in responding to you. It's not personal, just other stuff interfering from getting back to this.

I tested it and it very nearly works. I understand the glitch you mentioned, about navigating across videos within the colorbox causing it to open the page in Flickr. No problem, I can live with that, I will just remove the navigation buttons in Colorbox via CSS. :)

Related to that though, I'm having problems in getting the other videos to open when I click on them. Take a look at this page: http://www.emeraldglendoves.com/gallery/videos

I filtered out my videos on Flickr, so only the videos appear on this page, giving me four videos. When I click any one of them, it launches the first video. I'm really confused because the URL displayed is correct when you hover over the thumbnail. But when you click on the image, it always resorts back to the first one. I have cleared the caches, and my browser cache, to no avail. It loads the correct thumbnail number (for instance, 3 of 4), but it still always falls back to displaying the first video instead of the one in the URL. Any ideas?

Thanks again for making this work.

CommentFileSizeAuthor
#4 multiple_videos_playing_in_colorbox-2361483-4.patch1.65 KBlolandese

Comments

lolandese’s picture

lolandese commented

Hi Cindy,

Good catch. I haven't tested with multiple Flickr videos on one page.

I confirm it happening also on the sandbox site that offers a clean install always of the latest dev. Always the first found video on the page is used when opening subsequent videos in Colorbox, even when:

  • videos are rendered as single objects
  • different Flickr source accounts are used
  • videos are divided between node content and blocks.

I also tried to disable (by code) flickr_colorbox.js to see if that had some influence, but nothing.

Best is to use the same method as you used last time. See if you are able to use only HTML to make two different videos on the same page open in Colorbox. When you provide me that snippet, I will likely be able to adjust the module code.

It will be hard to find similar issues on the web as I haven't seen any examples anywhere of playable Flickr videos opened inside Colorbox. It seems we are the first web application offering this. You might consider posting the issue in the Flickr API group.

Thanks.

cindyr’s picture

cindyr commented

Aha! It's the id of the div, "myFlickrVideo": it needs to be unique for each video. You can see the sample working HTML code here: http://www.emeraldglendoves.com/content/flickr-colorbox-test

Here is your current code:

<div style="display: none;">

<div id="myFlickrVideo">

<object width="480" height="270" type="application/x-shockwave-flash" data="https://www.flickr.com/apps/video/stewart.swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param value="intl_lang=en-US&photo_secret=ce3d512cfe&photo_id=8732370682&hd_default=false" name="flashvars">
<param value="https://www.flickr.com/apps/video/stewart.swf" name="movie">
<param value="#000000" name="bgcolor">
<param value="true" name="allowFullScreen">
<embed width="480" height="270" type="application/x-shockwave-flash" src="https://www.flickr.com/apps/video/stewart.swf" flashvars="intl_lang=en-US&photo_secret=ce3d512cfe&photo_id=8732370682&hd_default=false" bgcolor="#000000" allowfullscreen="true">
</object>
</div>
</div>
<span class="flickr-wrap">

<a class="colorbox-inline init-colorbox-inline-processed cboxElement" target="_blank" rel="gallery-all" title="" href="https://www.flickr.com/photos/emeraldglendoves/8732370682/?width=480&height=280&inline=true#myFlickrVideo">

<img class=" flickr-photo-img image-style-none" title="IMG_0510" alt="IMG_0510" src="https://farm8.staticflickr.com/7363/8732370682_ce3d512cfe_m.jpg" typeof="foaf:Image">
</a>

Change those two lines to refer to unique div id's for each video. Maybe append the "myFlickrVideo" with the video ID number? So instead you'd have the following two lines for the first video:

 <div id="myFlickrVideo8732370682">
...
<a class="colorbox-inline init-colorbox-inline-processed cboxElement" target="_blank" rel="gallery-all" title="" href="https://www.flickr.com/photos/emeraldglendoves/8732370682/?width=480&height=280&inline=true#myFlickrVideo8732370682">

and for the second video on the page:

 <div id="myFlickrVideo14792425783">
...
<a class="colorbox-inline init-colorbox-inline-processed cboxElement" target="_blank" rel="gallery-all" title="" href="https://www.flickr.com/photos/emeraldglendoves/14792425783/?width=480&height=280&inline=true#myFlickrVideo14792425783">
lolandese’s picture

lolandese commented

Oops. Yes. Of course. I didn't get to that. Very good.

I'll try to roll your suggestions into a patch over the weekend to be reviewed. Feel free to do it if you have time. It shouldn't be that hard now that we know the answer. If you look at the patch from the other issue, you know where the code is to adjust. Make sure to git clone instead of using the dev. It produces a cleaner patch.

Thanks. Thumbs up ... of both hands.

lolandese’s picture

lolandese commented
Status: Active » Needs review
StatusFileSize
new multiple_videos_playing_in_colorbox-2361483-4.patch1.65 KB

Patch uses the unique Flickr "photo" ID instead of a static value, thus giving a different 'id' attribute for each video.

  • lolandese committed 493e43a on 7.x-1.x authored by cindyr 
    Issue #2361483 by cindyr: Fixed: Multiple videos always play the first...
lolandese’s picture

lolandese commented
Status: Needs review » Fixed

Tested with Flickr Filter:

[flickr-photoset:id=72157645975819760, size=s, num=8, media=all, sort=random, count=false, mintitle=999, minmetadata=999, heading=none]
[flickr-photoset:id=72157632700097642, size=s, num=20, media=all, sort=random, count=false, mintitle=999, minmetadata=999, heading=none]

Committed with attribution.

cindyr’s picture

cindyr commented

Sorry, I got sidetracked by Drupageddon. Tested, and it works. You're awesome! THANK YOU.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.