Integrate with lightbox

Well, I've just added this modification to the module for a project I'm working on. First I modified theme_node_images_view function:

function theme_node_images_view($node, $teaser, $page, $format = NULL) {
  if (arg(2) == 'image_gallery' || empty($node->node_images)) return;

  $output = '';
  $i = 0;
  
  // Add Ligthbox JS.
  $path = drupal_get_path('module', 'node_images');
  drupal_add_js($path.'/wpmod/lightbox.js');
  drupal_add_css($path.'/wpmod/lightbox.css');

  // set maximum number of images for teaser/body
  $view = ($teaser ? 'teaser' : 'body');
  $count = variable_get('node_images_'.$view.'_images_'.$node->type, 2);
  if (isset($count) && $count === 0) return;
  if (!$format) {
    $format = variable_get('node_images_'.$view.'_format_'.$node->type, 'thumbs');
  }

  foreach((array)$node->node_images as $id=>$image) {
    $description = check_plain($image->description);
    $pattern = '<img src="%path" alt="%description" />';
    $thumb = strtr($pattern, array('%path'=>file_create_url($image->thumbpath), '%description'=>$description));
    $fullsize = strtr($pattern, array('%path'=>file_create_url($image->filepath), '%description'=>$description));

    if ($info = getimagesize($image->filepath)) {
      $width = $info[0] + 36;
      $height = $info[1] + 36;
    }
    else {
      $width = 420;
      $height = 315;
    }

	if ($format == 'thumbs') {
/*	
      $output .= '<a href="javascript:void(0);" title="'.$description.'" onclick="window.open(\''.
      file_create_url($image->filepath).'\', \'\', \'height='.$height.',width='.$width.'\');">'.$thumb.'</a> ';
*/
// Modify link input to be recognized by Lightbox.
		$output .= '<a title="'.$description.'" rel="lightbox" href="'.file_create_url($image->filepath).'">'.$thumb.'</a> ';
    }
    else {
      $output .= $fullsize.' ';
    }
    if ($count>0 && ++$i >= $count) break;
  }
  return $output;
}

I included the js and the css and modified the link element. Then, of course, I added the lightbox library files to the Node Image module's folder. I don't know if this is the cleanest way to do it, but it worked fine for me.

I'm about to do something similar to use thickbox.

What would make all lives a lot easier:
extract the creating of the a-tag and the img-tag into a theme-able function, then everybody could care just about the presentation of 1 tumbnail and not about the html-structure to present the thumbs.

As a small improvement to soflete's nice piece of code, I added the node title to the lightbox links so that you can move backwards and forwards between all images of the node without closing the lightbox:

// Modify link input to be recognized by Lightbox.
$output .= '<a title="'.$description.'" rel="lightbox[' .$node->title. ']" href="'.file_create_url($image->filepath).'">'.$thumb.'</a> ';
    }

I also found it necessary to copy the images directory from the lightbox module across to the subdirectory within the node image module's directory (soflete called it wpmod).

The Node Image + Lightbox combo is so good that I am abandoning IMCE.
--
Andy

At http://drupal.org/node/139349#comment-248708 I've posted a patch that would also have fit here.

Just to let you know, I've implemented this patch along with many others and uploaded a new module here: http://drupal.org/node/150904.

These are the things incorporated:

* H3rnand3z & ray007 ('please help with thickbox modification' - http://drupal.org/node/139349)
* mad-admin & soflete ('Integrate with lightbox' - http://drupal.org/node/116515)
* Vallenwood ('Highly Enhanced Thumbnail generation - supersedes "Keep fixed thumnail size" - http://drupal.org/node/147538)
* terrybritton ('Altering the image gallery layout.' - http://drupal.org/node/135572 - *you will need his css file*)
* subspaceeddy ('div not closed in theme_node_images_gallery($element)' - http://drupal.org/node/145220)
* also further modifications by subspaceeddy to switch between lightbox, thickbox and default, and an ability to alter position of node body on 'Imaqe Gallery' page.