Support from Acquia helps fund testing for Drupal Acquia logo

Comments

acouch’s picture

Status: Active » Closed (won't fix)

Thanks for posting this. I have been able to get this working on a previous version of galleriffic but haven't tried it recently.

I'm marking this as "won't fix" since I'm not going to support this functionality.

However I'd encourage people to help and post solutions here if they find them.

vatavale’s picture

Any progress, Joshua?

Berliner-dupe’s picture

main slide image open in lightbox2 is interesting for me too?

Have you news Joshua?

Jukebox’s picture

Status: Fixed » Closed (won't fix)

I know this is an old thread but I managed to get it to work. Modify jquery.galleriffic.js, around line 632:

// Construct new hidden span for the image
var newSlide = this.$imageContainer
.append('<span class="image-wrapper current"><a href="'+imageData.image.src+'" class="lightbox-processed" rel="lightbox"></a></span>')
.find('span.current').css('opacity', '0');
				
newSlide.find('a')
	.append(imageData.image)
	.click(function(e) {
		e.preventDefault();
		Lightbox.start(this, false, false, false);
	});

This should open up lightbox and prevent the slideshow from advancing.

Jukebox’s picture

Status: Closed (won't fix) » Fixed
acouch’s picture

Status: Closed (won't fix) » Fixed

Thanks. I updated the documentation to include this snippet.

Status: Fixed » Closed (fixed)

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

fg86’s picture

Hi all, I would like to know if there is a way to integrate lightbox's prev and next buttons with galleriffic. I mean that when I enlarge a photograph with Jukebox's edit, I should be able to see prev and next buttons over the image.

Thanks!

Jukebox’s picture

I believe the previous and next buttons appear when you hover over the image.

EDIT: Normally, this would be true, but in calling Lightbox in this way, the navigation buttons have a "display: none;" css property applied. I have not looked into why this happens.

Jukebox’s picture

Version: 6.x-1.0-rc3 » 6.x-1.x-dev
Category: support » feature
Status: Closed (fixed) » Needs review
FileSize
1.05 KB

Created a patch for this issue (first patch ever, woohoo!).

Note: This patch does not correct the loading animations that may appear. A simple "display: none;" css on these animations is the quickest way to hide them.

acouch’s picture

@Jukebox thanks and congrats! will review as soon as i get a chance.

fg86’s picture

Thanks Jukebox and sorry for the delay. I'll give it a shot then I'll write you back.

fg86’s picture

Just tried to edit the CSS properties, but there's something wrong in the way the thumb calls the large image, I suppose. Prev and next buttons appear only for two images, seems that the large images are loaded only in the moment I call them... when I enlarge a single image, no prev and next buttons appear but when I enlarge two images then these buttons appear but only for the two images I enlarged... I would like to have a lightbox[group] including every single image of my gallery... but I don't know how can I make this happen...

iancu35’s picture

@Jukebox I tried to use colorbox and drupal 7 version of views galleriffic

I replaced "lightbox" with "colorbox" word in jquery.galleriffic.js, using your lines codes (orginal line codes are similar in drupal 7 and drupal 6 versions).

For slide image, I set Formatter: colorbox.

It stoped the gallery function but clicking on the slide image, do nothing/don't open any colorbox pop-up.

any clue,
thks.

iancu

wthomas’s picture

I have followed the instruction given for integrating Litebox2 with Views Galleriffic (it seems). When the main image is clicked, it does open the litebox, but only at the same size as the main image. The field "image", in views, has "litebox2 galleriffic ->original" but does not open the original (this image would easily fit to the screen).

Is there something I am missing? Your help is appreciated. (I am using Drupal 7)

hejeva’s picture

I implemented this and found a few issues.

One I was opening up the same size image instead of bigger.
The line where imagesrc.replace is I replace with gallerific with another imagecache of my site. You would need to change this line to your site specific image cache preset.

Lightbox does work, but the load icon spun forever. I couldn't figure out how to stop that. So I switched Colorbox.

Hope it helps someone..

				// Construct new hidden span for the image
				var imagesrc = imageData.image.src;
				imagesrc = imagesrc.replace("node-gallery-maingallerific", "Average-Image-size");

/* Lightbox2 				
				var newSlide = this.$imageContainer
					.append('<span class="image-wrapper current"><a href="'+imagesrc+'" class="lightbox-processed" rel="lightshow" ></a></span>')
					.find('span.current').css('opacity', '0');
				
				newSlide.find('a')
					.append(imageData.image)
					.click(function(e) {
						e.preventDefault();
						Lightbox.start(this, false, false, false);
					});
*/

				var newSlide = this.$imageContainer
					.append('<span class="image-wrapper current"><a href="'+imagesrc+'?width=500&height=500"  class="colorbox" ></a></span>')
					.find('span.current').css('opacity', '0');
				
				newSlide.find('a')
					.append(imageData.image)
					.click(function(e) {
						e.preventDefault();
						$('a.colorbox').colorbox({width:817, height:500});
					});
EvanDonovan’s picture

I'm working currently on code to get the image to open in Colorbox on Drupal 7. I'll share back the module once it's done, though it may not be the best approach since I thought I needed to implement a separate menu callback to get it to work (for rendering the full-size image).

EvanDonovan’s picture

@hejeva: I am working with the 7.x version of Views Galleriffic and the way that I was adding the Colorbox was creating conflicts with the core code that handles slide change events. The image was getting inserted into the DOM multiple times.

I was trying to do it in a separate JS though, rather than in the JS that actually builds the slide markup. Does it have to be added to that JS? (I didn't want to hack the module.)

If it does have to be added to the JS for the slide markup, where specifically does the code that you have added in here go?

Thanks.

EvanDonovan’s picture

A co-worker of mine sorted out the issue we were having with our implementation. Hopefully, we can post our code shortly.

AdmiralSenn’s picture

I am having the same problems with Lightbox not allowing the larger images to be displayed and presenting the endless spinning logo.

At one point I had Lightbox triggering the correct sizes but I am completely unable to figure out how, and it only worked one time. Most likely the recent updates I performed broke it.

The logo issue did not appear in the Views preview screen, but the image resize problem does. I also had issues getting Colorbox to cooperate and Lightbox seems to do what I want better, so switching modules isn't really an option for me.

EvanDonovan, any update yet?

stoltoguzzi’s picture

@EvanDonovan, any progress on this example rendering the fullsize images in colorbox an using d7

Would be very nice if you could share this?

kirilius’s picture

I am also very interested in this feature

kirilius’s picture

Up!

kirilius’s picture

Version: 6.x-1.x-dev » 7.x-1.x-dev

Updating the version as the same is also valid for D7

m.stenta’s picture

I'm starting to put together a patch for this. The previous attempts in this issue were helpful in understanding the possible approaches, but they did lack one big detail: they are loading the same slide image in the Lightbox window, rather than an enlargement. This makes sense because there is only one image URL available (the slide image), so the size is constrained by that.

The attached patch adds a new Views Galleriffic Row style option called "Lightbox URL field", which allows you to load up the URL of a larger image. Note that in most cases you will need the Image URL Formatter module (http://drupal.org/project/image_url_formatter) in order to get an Image field's file URL.

Additionally, I added a simple "click to enlarge" link under the gallery slide, which links to the new large image. This is just a temporary solution for providing simple "enlarge image" functionality to Views Galleriffic. I need this (today) for a project I'm working on. The attached patch is meant for use in a distribution (built with Drush Make), but also as a starting point for coming to a fully-working Lightbox2 solution.

The next steps to making this fully-Lightbox2-functional (in my mind):

1. Include this new image URL in the JavaScript.
2. Combine it with one of the approaches listed above to make it work with Lightbox2.
3. Hide the "click to enlarge" link (via CSS or JS perhaps), or make another option to determine if that should be displayed instead or along with the Lightbox2 functionality.

m.stenta’s picture

Update: the previous patch was missing part of the changes. Here is the full one.

NOTE: Please read the full comment in #25 above. This patch does not solve this issue. It is just a first step.

m.stenta’s picture

Status: Needs review » Needs work

This should be "Needs Work".

LeeHle’s picture

hey AdmiralSenn

Did you get any help with this? if so please could you share :)

mitchelljj’s picture

Issue summary: View changes
FileSize
2.46 KB

I have created a patch based on comment #16 except that it is changed so that the image that is sent to the colorbox popup is the original full sized image instead of the cropped image. You may need to adjust the "imagesrc = imagesrc.replace("/styles/galleriffic_slide/public", "");" command based on your site configuration.

mitchelljj’s picture

revising the patch from #29

mitchelljj’s picture

revising the patch from #29 again

mitchelljj’s picture

revising the patch from #29 again

mitchelljj’s picture

revising the patch from #29 again

mitchelljj’s picture

added to the "jquery.galleriffic.js33.patch" file to do the following:
1.) Made the popup lightbox mobile responsive based on the browser size.
2.) Added navigation arrows within the popup lightbox along with the total number of images within the popup

This new patch is uploaded and called: magnific-popup-for-galleriffic.patch

mitchelljj’s picture

Improved formatting of Patch #34

someguy9’s picture

Issue summary: View changes
Status: Needs work » Closed (fixed)
FileSize
18.21 KB
someguy9’s picture

mitchelljj’s picture

updating the magnific-popup-for-galleriffic2-with-custom-modifications.patch file because applying the patch failed

mitchelljj’s picture

someguy9’s picture

someguy9’s picture

someguy9’s picture

mitchelljj’s picture