Hi

This is a good module, but it really lacks maintenance. That said, I have a request:

I personally think that colorbox is a bad lightbox alternative when it comes to customizing. Much better are fancybox and shadowbox, in my opinion. Now, I know that not everybody will agree with this, so I propose that we should make a dependency-like thing, just as WYSIWYG. This is an alternative text-editor which allows you to type as if it were in Word, but the beauty of it is that you can choose which editor you want to use (ex. tinyMCE)

Maybe we could have it like that: you install media gallery, but you can't use it until you have installed a lightbox (ex. lightbox, colorbox, shadowbox, fancybox) and then you can use that one, if possible with its own presets and features.

Files: 

Comments

Yeah Ive got a project where I'd like to use fancybox style themes, so this would be very handy.

Priority:Major» Normal
Status:Needs work» Active

There is no patch, so nothing to work on.

I'm sorry, what do you mean by 'no patch'? Why would we need a patch?

A) "Needs work" means that a patch that was submitted had an issue and that needs to be addressed before it can be committed. Since there was no patch attached to the issue, there is nothing that "needs work," therefore the issue is "active."

B) The best way to get a contributed module "fixed" is to do so oneself, by submitting the code changes required (a patch), if one is capable of doing so. Module maintainers do not get paid for doing the work, which can be considerable. Having others help with the coding is what open source is all about. If one is not capable of making the change, then one should not become impatient that others don't share the same sense of priority.

Having tried this module with Colorbox, I share your desire to support other alternatives, since Colorbox doesn't work. However, I am not into javascript (or jQuery), so I am not currently capable of investigating the alternatives and coming up with a flexible way to interface with them. Until this module works with Colorbox, or any other alternative, I have to be patient and not install it on any live sites. That's a shame because this is, so far, the only reasonably viable looking gallery module for D7.

You can integrate with Lightbox2 quite easily.

I'm currently doing it with just a hack as I'm just playing around to see if this would work. This needs to be moved to the theme layer, but a simple hack to the module makes it Lightbox2-compatible.

If you add these two lines

  $attributes['rel'] = 'lightframe[gallery]';
  $link_path .= '/lightbox2';

at line 437 of media_gallery.theme.inc this will make the pages open in lightbox2.

In context it would look like:
<code>  $attributes['rel'] = 'lightframe[gallery]';
  $link_path .= '/lightbox2';
  // Create a link around the image
  $item .= empty($variables['no_link']) ? l($image, $link_path, array('html' => TRUE, 'attributes' => $attributes)) : $image;

This will open the node in an iframe.

The main issues with this are that
- with the iframe you don't get the lightbox resize functions, which is one of the main things I like about Lightbox2 over Colorbox.
- you have to strip out all the stuff you don't want and this is a bit of a hassle with the theme I'm using (an Omega subtheme) becuase you have to strip things out of zone--node.tpl.php, region--node.tpl.php, page.tpl.php and then still have to strip some stuff out of the $page variable... and I'm still not there yet. There must be a better way. For some reason I can't get it to recognize the page--node--lightbox2.tpl.php file (see #1232318). Not sure why that isn't working.

So that gets you most of the way there. I think you could create an onclick event that would rewrite the URL to add the '/lightbox2' only when a user clicks on it to differentiate between an actual click from a user (open in lightbox) and a spider (open the page)... even though Google does follow some Javascript now, it would be nice to have the descriptions indexed if it's a bot.

If you like Fancybox, there is some fast but dirty solution:

Add this function to the template.php in your theme folder (replace YOUR_THEME with theme name):

<?php
/**
* Override theme_media_gallery_item() - media_gallery/media_gallery.theme.inc
*/
function YOUR_THEME_media_gallery_item($variables) {
 
$image = $variables['image'];
 
$link_path = $variables['link_path'];
 
$attributes = array();
  if (!empty(
$variables['classes'])) {
   
$attributes['class'] = $variables['classes'];
  }
  if (!empty(
$variables['title'])) {
   
$new_image = str_replace(array('title=""', 'alt=""'), array('', ''), $image);
   
$image = str_replace('/>', ' title="'.$variables['title'].'" alt="'.$variables['title'].'" />', $new_image);;
  }
 
// FANCYBOX HACK
 
preg_match('/sites\/default\/files\/styles\/media_gallery_thumbnail\/public\/([^"]*)"/', $image, $matches);
 
$link_path = 'sites/default/files/styles/media_gallery_large/public/' . $matches[1];
 
$attributes['class'][1] = 'fancybox';
 
$attributes['rel'][] = 'gallery';
 
// FANCYBOX HACK
 
$item = '<div class="media-gallery-item"><div class="top"><div class="top-inset-1"><div class="top-inset-2"></div></div></div><div class="gallery-thumb-outer"><div class="gallery-thumb-inner">';
 
$item .= empty($variables['no_link']) ? l($image, $link_path, array('html' => TRUE, 'attributes' => $attributes)) : $image;
 
$item .= '</div></div><div class="bottom"><div class="bottom-inset-1"><div class="bottom-inset-2"></div></div></div></div>';
  return
$item;
}
?>

Status:Active» Postponed (maintainer needs more info)

Could any of you provide a patch which leaves the choice of lightbox up to the user, defaulting to the current implementation, so no current sites gets broken?

Hello,

I do not understand everything.
I have Colorbox on my website and this module use lightbox. Where can I set params for this lightbox for this module ? How can I do to use colorbox instead? How to adjust the size of the lightbox to the browser size?

Thanks

Status:Postponed (maintainer needs more info)» Active

Would there be any future plans to make other lightboxes available with this module? I have it working fine with the colorbox but I personally much prefer lightbox2 as a display as its cleaner, more reliable and seems to load faster? If there could be an option to select the lightbox built in to the module rather than having such a high dependency on the colorbox module / library then it would be great.

Sorry I cannot help with patches or codes or anything like that as I'm more a user of drupal for my personal site than a developer.

Version:7.x-1.0-beta7» 7.x-1.0-beta8

With Drupal 7.20 this workaround wouldnt work anymore.

The new security improvements will break this fancybox hack.

Now an image is styled first when it is accessed the first time.
As the media_gallery sends an already renderd a tag, we could'nt replace the url anymore.

I couldn't find any function that resolves somthing like http://example.com/sites/example.com/files/styles/thumb/public/IMAGE.png into the original public://IMAGE.png.

So I wrote a function that resolves the rendered path into an relativ path to the public:// folder.
image_style_url should style the image to large an generate the url for the large view.

<?php
/**
* Override theme_media_gallery_item() - media_gallery/media_gallery.theme.inc
*/
function ggp_theme_media_gallery_item($variables) {
 
$image = $variables['image'];
 
$link_path = $variables['link_path'];
 
$attributes = array();
  if (!empty(
$variables['classes'])) {
   
$attributes['class'] = $variables['classes'];
  }
  if (!empty(
$variables['title'])) {
   
$new_image = str_replace(array('title=""', 'alt=""'), array('', ''), $image);
   
$image = str_replace('/>', ' title="' . $variables['title'] . '" alt="' . $variables['title'] . '" />', $new_image);;
  }
 
// FANCYBOX HACK
 
if (!isset($variables['gallery'])) {
   
$url = '';
   
preg_match('|src="([\S]*)"|', $image, $url);
   
$path = ggp_theme_get_file_scheme($url[1]);
   
$link_path = image_style_url('media_gallery_large', $path);
   
$attributes['class'][] = 'fancybox';
   
$attributes['rel'][] = 'gallery';
  }
 
$item = '<div class="media-gallery-item"><div class="top"><div class="top-inset-1"><div class="top-inset-2"></div></div></div><div class="gallery-thumb-outer"><div class="gallery-thumb-inner">';
 
$item .= empty($variables['no_link']) ? l($image, $link_path, array('html' => TRUE, 'attributes' => $attributes)) : $image;
 
$item .= '</div></div><div class="bottom"><div class="bottom-inset-1"><div class="bottom-inset-2"></div></div></div></div>';
  return
$item;
}
function
ggp_theme_get_file_scheme($uri) {
 
$uri = strtok($uri, '?');
  global
$base_url;
 
$prefix = $base_url . '/' . DrupalPublicStreamWrapper::getDirectoryPath();
  if ( !
strncmp( $uri, $prefix, strlen($prefix)) ) {
   
$path = substr($uri, strlen($prefix)+1);
    if(!
strncmp($path, 'style/', 5)){
       
$path = substr($path, 7);
       
$path = strstr($path, '/');
       
$path = substr($path, 1);
    }
    if(!
strncmp($path, 'public/', 6)){
      
$path = substr($path, 7);
     }
    return
$path;
  }
  return
$uri;
}
?>

Would be good if hook_media_gallery_item gets the stream URL of the file and builds the img tag itself

Status:Active» Needs work
StatusFileSize
new910 bytes

i invested some time to give the independence a hug. :)

In my theme i now use this theme function to include fancybox support (fancybox module)

<?php
/**
* Override theme_media_gallery_item() - media_gallery/media_gallery.theme.inc
*/
function ggp_theme_media_gallery_item($variables) {
 
$image = $variables['image'];
  if (!empty(
$variables['title'])) {
   
$image[0]['#title'] = $variables['title'];
   
$image[0]['#alt'] = $variables['title'];
  }
 
debug($image);
 
$rendered_image = render($image);
 
$link_path = $variables['link_path'];
 
$attributes = array();
  if (!empty(
$variables['classes'])) {
   
$attributes['class'] = $variables['classes'];
  }
 
/*if (!empty($variables['title'])) {
    $new_image = str_replace(array('title=""', 'alt=""'), array('', ''), $image);
    $image = str_replace('/>', ' title="' . $variables['title'] . '" alt="' . $variables['title'] . '" />', $new_image);;
  }*/
  // FANCYBOX HACK
 
if (isset($variables['gallery'])) {
   
$link_path = image_style_url('media_gallery_large', $image[0]['#file']->uri);
   
$attributes['class'][] = 'fancybox';
   
$attributes['rel'][] = 'gallery';
  }
 
$item = '<div class="media-gallery-item"><div class="top"><div class="top-inset-1"><div class="top-inset-2"></div></div></div><div class="gallery-thumb-outer"><div class="gallery-thumb-inner">';
 
$item .= empty($variables['no_link']) ? l($rendered_image, $link_path, array('html' => TRUE, 'attributes' => $attributes)) : $rendered_image;
 
$item .= '</div></div><div class="bottom"><div class="bottom-inset-1"><div class="bottom-inset-2"></div></div></div></div>';
  return
$item;
}
?>

The patch is a first step into this type of hierarchy
media_gallery => lightbox independent
media_gallery_fancybox => fancybox stuff
media_gallery_colorbox => colorbox stuff

REMEMBER Patch is WIP

Valkum,

Could you explain the process of applying your work around? I've been building a responsive website, and thus far, Media Gallery (and more specifically, colorbox) has been the one hold-out component.

My understanding is that the patch will provide the edits to the gallery module itself, and that I should use the above code to incorporate fancybox into my theme?

Thanks so much for your work!

i'm not sure if my work will help to make media_gallery responsive.
With the code from #11 you can overwrite the theme function for galleries, to work with the fancybox module.
But here is a little bug in my code posted in #11:

    $link_path = image_style_url('media_gallery_large', $path);

should be
    $link_path = image_style_url('media_gallery_large', 'public://'.$path);

In #12 i rewrote some parts of media_gallery to run lightbox independent. It was supposed to be pulled into the module. But it is just some work, not finished. Hoped that a maintainer would dig into this.

i think the best for your purposes would be my workaround for Drupal 7.21+ (in post #11) .

Any update?