Nidhi16 / galleriffic

Automatically exported from code.google.com/p/galleriffic
0 stars 0 forks source link

Embed Video Instead of an Image into Galleriffic #249

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
What steps will reproduce the problem?
I've tried embedded a .mov file instead of a image file into the <li> tag but 
the video shows up on every slide instead of just the designated slide. Also, 
the video won't play once embedded.

What is the expected output? What do you see instead?
I'd like the video to only appear when the appropriate thumbnail is clicked and 
play when clicked.

What version of the product are you using? On what operating system?
Galleriffic 2.0 on Mac Version 10.6

Please provide any additional information below.
Thanks in advance for the help.

Original issue reported on code.google.com by meganale...@gmail.com on 11 Oct 2011 at 7:22

GoogleCodeExporter commented 8 years ago
I know these issues posted are old but i found myself here many times trying to 
find this exact fix and everywhere else on the internet.. I searched and 
searched to no avial. BUT, I have good news! After about 2 days of pulling my 
hair out i finally found a fix. By combining Colorbox and Gallerific (jQuery 
Plugins) I have come up with a makeshift video/image gallery using gallerific's 
wonderful dynamic interface. I am proud to say that i have solved all my 
problems. 

What i now have as a result is a thumbnail image of each video at the side, 
when a thumbnail image is clicked gallerific shows a screenshot of the video 
with a play button watermark (like you would see on a youtube video before 
pressing play) upon clicking this screenshot it opens colorbox (with the 
parameter iframe: true) and displays the video! from there i can customize 
everything still that both plugins allow for no problem! 

The only problem is my circumstance is very specific to the project i am 
working on as i am a full time web designer doing a project for a client. i 
have outputted all my galleriffic thumbs and images dynamically from a database 
that holds the thumb image, full image, and video link. therefore its all in a 
for loop with a bunch of php.

To make this short for the people who are too impatient to read this or 
ungrateful for the fix i will not be posting my fix publicly. 

ALTHOUGH, if you would like some idea on how to do this yourself you can email 
me at jturner22.nait@gmail.com with a subject line something along the lines of 
"GALLERIFFIC/COLORBOX HELP" and i will be more than willing to share my 
modified jquery.galleriffic.js file and the other required info to make it 
work, As i said before i was here 2 days ago with the same issue. Been there 
done that. I know how it feels and i'm here to help!

Thank you,
-Jason Turner

Original comment by jturner2...@gmail.com on 2 Nov 2012 at 8:23

GoogleCodeExporter commented 8 years ago
In jquery.gallerific.js search for "clickHandler: function (" (line 111) 

clickHandler: function(e, link) {
    this.pause();

    if (!this.enableHistory) {
        // The href attribute holds the unique hash for an image
        var title = $(link).attr('title');
        if(title.match(/youtube/g)){

            $.fancybox({
            'padding'       : 0,
            'autoScale'     : false,
            'transitionIn'  : 'none',
            'transitionOut' : 'none',
            'title'         : 'teste',
            'width'     : 680,
            'height'        : 495,
            'href'          : title.replace(new RegExp("watch\\?v=", "i"), 'v/'),
            'type'          : 'swf',
            'swf'           : {
            'wmode'        : 'transparent',
            'allowfullscreen'   : 'true'
            }
            });

        }else{
        var hash = $.galleriffic.normalizeHash($(link).attr('href'));
        $.galleriffic.gotoImage(hash);
        }

        e.preventDefault();
    }
},

Original comment by rodmi...@gmail.com on 14 Jul 2015 at 5:09