Previous / Next photo brower, a la Flickr

I wrote some code that can be put in a block to show previous / next photos like flickr does. Check it out here.

1. Upload these two photos somewhere on your site. They show the first and last pictures:
   • 
   • 
2. Create a ‘PHP code’ block with the following code:
   
   $nid));

   $previous=0;
   $next=0;
   $tmp_prev=-1;
   $terms = taxonomy_node_get_terms_by_vocabulary($node->nid, _image_gallery_get_vid());
   if ($terms) {
   $term = array_pop($terms);
   $res = db_query("SELECT n.nid FROM {term_node} t INNER JOIN {node} n ON t.nid=n.nid WHERE n.status=1 AND n.type='image' AND t.tid=%d ORDER BY n.sticky DESC, n.created DESC", $term->tid);

   $tot_num = db_num_rows($res);
   for($i=0; $i nid)) {
   $previous=$tmp_prev;
   }
   $tmp_prev=$nidvalue;
   }

   $prev_node = node_load(array('nid' => $previous));
   $next_node = node_load(array('nid' => $next));

   $prev_th = ($previous == -1) ? '' : l(image_display($prev_node, 'thumbnail', array('width' => '120', 'height' => '120')),'node/'.$prev_node->nid, array(), null, null, FALSE, TRUE);
   $next_th = ($next == 0) ? '' : l(image_display($next_node, 'thumbnail', array('width' => '120', 'height' => '120')),'node/'.$next_node->nid, array(), null, null, FALSE, TRUE);
   $output = '';
   $output .= '

   ';
   $output .= '
   ';
   $output .= '

   ';
   $output .= '

   ';
   $output .= '

   ';

   $output .= '

   ' . $prev_th . ' ' . (($previous == -1) ? ' ' : l('Previous','node/'.$prev_node->nid, array(), null, null, FALSE, FALSE)) . '

   ' . $next_th . ' ' . (($next == -1) ? ' ' : l('Next','node/'.$next_node->nid, array(), null, null, FALSE, FALSE)) . '

   ' . $tot_num . ' photos in this album.

   ';
print $output;
}
}
?>


3. Change the code where it says:
   
   $prev_th = ($previous == -1) ? '' : l(image_display($prev_node, 'thumbnail', array('width' => '120', 'height' => '120')),'node/'.$prev_node->nid, array(), null, null, FALSE, TRUE);
   $next_th = ($next == 0) ? '' : l(image_display($next_node, 'thumbnail', array('width' => '120', 'height' => '120')),'node/'.$next_node->nid, array(), null, null, FALSE, TRUE);

   
   to the place where you uploaded the files.

4. You need to make the block only show on image pages. So you need to check the ‘Show if the following PHP code returns TRUE (PHP-mode, experts only).’ radio button. Caveat: The warning here means it. If you misconfure something, you may not be able to get into your site. This code works for me. Your milage may vary.
   
1);
if (arg(0) == 'node' && is_numeric(arg(1))) {
$nid = arg(1);
$node = node_load(array('nid' => $nid));
$type = $node->type;
if (isset($types[$type])) {
$match = TRUE;
}
}
return $match;
?>

5. Save the block and you should be good to go.
6. Mine is slightly styled with
   
.image_browser td {
padding: 5px 0 0 5px;
}


If this doesn’t work for you feel free to mail me. If it works for you and there is a better way, I’d love to hear about that too.

Advertisements