[*droplet*] microGallery (place Gallery anywhere)

[Lomex]

Hello,
even if this is the English forum, I ask here once in German. (weil mein Englisch is not so gut)

Bei mir werden nicht alle Bilder angezeigt, die sich im Ordner befinden. Scheint so, als wenn wahllos irgendwelche angezeigt werden. Manchmal werden auch gar keine angezeigt, mit der Meldung das sich keine Bilder im Ordner befinden.

Woran kanns liegen?

[crnogorac081]

I just got it, i needed colobox files

cheers,
Ivan

[Stefek]

Hello Ivan,

what demo do you need exactly?

The Pictures are taken from your MEDIA_DIRECTORY.'/ your_named_subfolder'

If there is anything I can help you with, let me know.

KR,
Christian

[crnogorac081]

Guys, is there a demo somewhere ? I would like to see it in action..

cheers,
Ivan

[noname8]

Couple of challenges for the good coders:

- Sort options DASC, DDESC = ability to sort the images by the file date modified
- Limit n = Ability to show max n qty of  images. Awesome with the date option to show a "showreel" of most new images.
Real deal:
- Paginate n, ability to divide the images with GET queries to multiple pages

[baggi80]

jepp works... thx for the hint 

[dbs]

hi, you could make a div with id="yourdiv" around the droplet and style with css:

Code Select Expand

#yourdiv table{margin: 0 auto;}
untested...

[baggi80]

Hello,

is there a way to center the thumbnail inside the wysiwyg if there ist only one picture in the folder?

thx baggi

[dbs]

the colorbox snippet contains already  the javascript-code (frontend.js).
nothing to do for you.

this

Fatal error: Call to undefined function use_fancy_box()...

is anywhere in a droplet-call (like [[fancybox]]).
delete it. to find maybe in the wysiwyg-content or index.php of your template...

[erutter]

hello! i cant get it work with the colorbox. i insert colorbox into my template, i insert it into the droplet code, but where i have to insert the code in the java script.. where i can find the java script??

Thanks

And is there a way to add slideshow to the ColorBox?

Hello MacSmet,
the way to make use of the ColorBox Slideshow is quite easy.

Change (in Droplet Code) the line $image_show[] to: $image_show[] = "<a href='".$link."' rel='cslide_".$group."' title='".$img_title."'>
in the Java Script add the asterisk * in the selector, like this$("a[rel*='cslide']").colorbox({  

now you will be able to add any group name you want:
&group=1 will work but, &group=birds or &group=books will work also and will make a slideshow group for every single droplet call.

Regards,
Stefek

[mic]

the droplet want work with colorbox.
a link to your site could help.

It isn't online yet. This is local on my NAS.

Ah, wait. I don't think I have colorbox installed, neither for LA nor as single module...

I'll check and report that later. Gotta shoot a little now

Thanks

#m

[dbs]

the droplet want work with colorbox.
a link to your site could help.

[mic]

i test with 1.51 and the code is ok.
the leading <?php is not needed, but the modul remove this for you.

hm, what can be the problem?
droplet-name, desc or comment?

Hey, I just did it again and simply copied the presets for name, desc and comment - and it is all blue

Now I'll see if I can get the gallery as such to work.

You pointed me the right way. Many thanks!

UPDATE: Alas, the gallery won't work.

The frontend spits:

Code Select Expand

Fatal error: Call to undefined function use_fancy_box() in /volume1/web/sandbox_wsb/modules/droplets/droplets.php(29) : eval()'d code on line 2

And that line (first part of file) reads:

Code Select Expand


<?php
/**
 *
 * @category        module
 * @package         droplets
 * @author          Ruud Eisinga (Ruud) John (PCWacht)
 * @author          WebsiteBaker Project
 * @copyright       2004-2009, Ryan Djurovich
 * @copyright       2009-2010, Website Baker Org. e.V.
 * @link http://www.websitebaker2.org/
 * @license         http://www.gnu.org/licenses/gpl.html
 * @platform        WebsiteBaker 2.8.x
 * @requirements    PHP 4.4.9 and higher
 * @version         $Id$
 * @filesource $HeadURL$
 * @lastmodified    $Date$
 *
 * droplets are small codeblocks that are called from anywhere in the template.
 *  To call a droplet just use [[dropletname]]. optional parameters for a droplet can be used like [[dropletname?parameter=value&parameter2=value]]\
 *
 *  1.0.2, bugfix, Reused the evalDroplet function so the extracted parameters will be only available within the scope of the eval and cleared when ready.
 *  1.0.3, optimize, reduce memory consumption, increase speed, remove CSS, enable nested droplets
 *
 */

function do_eval($_x_codedata, $_x_varlist, &$wb_page_data)
{
extract($_x_varlist, EXTR_SKIP);
return(eval($_x_codedata));
}

function processDroplets( &$wb_page_data ) {
// collect all droplets from document
$droplet_tags = array();
$droplet_replacements = array();
if( preg_match_all( '/\[\[(.*?)\]\]/', $wb_page_data, $found_droplets ) )
{
foreach( $found_droplets[1] as $droplet )
{
if(array_key_exists( '[['.$droplet.']]', $droplet_tags) == false)
{


Cheers!
#m

[dbs]

i test with 1.51 and the code is ok.
the leading <?php is not needed, but the modul remove this for you.

hm, what can be the problem?
droplet-name, desc or comment?

[mic]

hi, the droplet-code is ok.
please paste your code here, i'll check it.

Great!

It is the exact code from page #1 of this thread though.

I just added a couple of droplets, but none complained, so I think it is not a problem of Droplet (V1.51)

Code Select Expand


<?php
/*
"microGallery - place Gallery anywhere"
----------------------------------------
@Author: Christian M. Stefan (Stefek) <stefek@designthings.de>
*/

global $MESSAGE;
$output_value ="";
//  check if the 'folder' Parameter is set in the Droplet
if (!isset($folder)):
$output_value = $MESSAGE['MOD_FORM']['REQUIRED_FIELDS'].":<b>microGallery call =></b> <tt>folder={path/to/the/folder}</tt>";
endif;

$img_dir = WB_PATH.MEDIA_DIRECTORY.'/'.$folder.'/';
$img_url = WB_URL.MEDIA_DIRECTORY.'/'.$folder.'/';  

// directory exists --->
if (is_dir($img_dir)):
// open directory and go through the files
$dir = dir($img_dir);

while (FALSE !== $image_file = $dir->read()):

//use jpg, gif and png files only
if (!preg_match('/.+\.(jpeg|jpg|gif|png)$/', $image_file) || 
substr($image_file, 0, 1) == ".") 
continue;
    
   /**
    * Make Array of images for the microGallery if image files exist
    */
// convert filenames into Titles    
$img_title = str_replace(array(".png", ".jpg", ".gif", ".jpeg"), "", $image_file);
$img_title = str_replace("_", " ", $img_title); 
if (isset($img_title) && !empty($img_title)):     
    $link = $img_url.$image_file;    
    $group = isset($group) ? $group : ''; //ignore $group if &group Parameter isn't set in Droplet-Call
    $image_array[] = "<a class='colorbox' href='".$link."' rel='lightbox[".$group."]' title='".$img_title."'>file'".$img_title."'</a>";
    $linkonly[] = $link;
    $image_show[] = "<a class='colorbox' href='".$link."' rel='lightbox[".$group."]' title='".$img_title."'>
    <img src='".$link."' alt='".$img_title."' title='".$img_title."' style='width:auto; height:120px; border:0;'/></a>";
endif;
endwhile;

if(empty($image_show)): //no images in this directory
$output_value = $MESSAGE['MEDIA']['NONE_FOUND'].': (<tt> '.$img_url.' </tt>)';
return $output_value;
endif;

/**
* DISPLAY microGallery
*/
$display =  (isset($display)) ? $display : 'table';
$cssclass = (isset($cssclass)) ? ' class="'.$cssclass.'"' : ''; //&cssclass=yourclass
// check sorting
if((isset($sort) && $display == 'table') || (isset($sort) && $display == 'all')){
if($sort=='ASC') asort($image_show);
if($sort=='DESC') rsort($image_show);
if($sort=='RANDOM') shuffle($image_show);
}
switch ($display):
case 'table': //&display=table OR not-set at all
$picsperrow = (isset($cols)) ? $cols : 4; // Set the amount of pics per row
$output_value = "<table".$cssclass."><tr>";
for ($i=0; $i<count($image_show); $i++):
if (($i > 0) && ($i % $picsperrow == 0))
$output_value .= "</tr><tr>";
$output_value .= "<td>".$image_show[$i]."</td>";
endfor;
while ($i % $picsperrow > 0):
$output_value .= "<td>&nbsp;</td>";
$i++;
endwhile;
$output_value .= "</tr></table>";
break;
case 'all':  //&display=all
if(isset($sort) && $sort=='ASC') asort($image_show);
if(isset($sort) && $sort=='DESC') rsort($image_show);
if(isset($sort) && $sort=='RANDOM') shuffle($image_show);
sort($image_show);
$output_value = "<ul".$cssclass.">";
foreach ($image_show as $image){     
    $output_value .= '<li>'.$image.'</li>';
}
$output_value .= '</ul>';
break;
case 'first':  //&display=first
$output_value =  $image_show[0];
break;
case 'notfirst': //&display=notfirst 
array_shift($image_array); //skip first Element of Array
$output_value = '<ul style="display:none">';
foreach ($image_array as $image){     
    $output_value .= '<li>'.$image.'</li>';
}
$output_value .= '</ul>';
break;

case 'firstlink': //&display=firstlink
$output_value =  $linkonly[0];
break;
endswitch;

// <-------end: if directory exists
else:
// directory doesn't exists --->
$output_value = $MESSAGE['MEDIA']['DIR_DOES_NOT_EXIST'].': (<tt> '.$img_url.' </tt>)';
endif;    
return $output_value;


#m

[dbs]

hi, the droplet-code is ok.
please paste your code here, i'll check it.

[mic]

You may use this Droplet to place a (small)Gallery where ever you like (NEWS Posts etc.).
This droplet, of course, doesn't replace a general image-gallery-module, but it comes in handy if you need to display some pictures from a media-directory without to much effort.

Hi Stefek,

I can't get it to work. When I paste the code into the droplet-editor, the drop gets red immediately and WB complains about invalid code. I can't figure out what is going wrong.

Any help appreciated.

#m

[baggi80]

Okay thx now it works as expected

[dbs]

u can try to comment out this in module colorbox frontend.js:

Code Select Expand

var $gallery, previous, next;

        next = $.fn.colorbox.next;

        $.fn.colorbox.next = function(){
                if($gallery.index(previous) == ($gallery.length - 1)){
                        $.fn.colorbox.close();
                } else {
                        next();
                }
        };


                $gallery = $("a[rel='cslide']");

                $gallery.colorbox({onComplete: function(){
                        previous = this;
                }, onOpen: function(){
                        previous = this;
                }});

this should close slideshow at the end, but sometimes it makes more ... *g*

[baggi80]

Hi,

nice droplet  

I know there ist no developing on this droplet but I have a Problem with the upcoming Gallery when I click a picture and I hope someone can help me.

Example with two Pictures in the folder. When I push the forward button, the galery close. When I open the second Picture and push the backward button it works... pushing the forward button again it close.


Someone idea?

[Stefek]

Anyway you will need to fork it first, won't you?

Forking is a good thing. Look at gitHub.
All functioning teams (dev groups) work with forks in one way or another.

Regards,
Stefek

[dbs]

no, i don't want make a fork, only a test-droplet.

the extra-code should be in the original-droplet, if the code is working good.
for some users it is easier import as change code.

[Stefek]

Yes, of course.
Feel free to fork the code.
That's why its open source.

Regards,
Stefek

[dbs]

hi stefek, i hope we have more as only me. 

maybe other users have ideas/solutions too.

[Stefek]

Hello Frank,

nice one.

I am not working any further on this droplet.
If you want, you can work on a solution where there is another "Setting" for the 'rel'.

Maybe you have the time to go deeper into the Sort problem too.

Kind regards,
Stefek