CMS Made Simple Forums

Posted: **Thu Feb 03, 2005 8:01 pm**

Hi everybody out there!

First of all, I'd like to say this is a GREAT cms, simple, powerful and straightforward (I think this is the right word for what I mean, you've to excuse me since I'm Italian and my English could not be very good...

)

I needed a very simple gallery for CMSMS and, since I wasn't able to find something that fits my needings, I decided to write something very simple: it is, infact, not a module, but only a special "tag" that shows your images uploaded with CMSMS image manager.

[size=18px]-- EDIT: see below for an improved version --[/size]

This small script produces a simple table with image - description rows, where description is the content (no parsing) of a text file with the same name of the image but with the .txt extension or, if this doesn't exist, the file name. The link opens the full-size image in a popup with the sized of the image (more or less

).
There are some config options: $dir is the subdirectory of uploads/images/ where images you want to show are stored, the other ones I think are quite clear. In regexp filters it's better to leave "thumb_" and "editor_" because files like these are generated by the image manager.

I haven't tested it very much, but it seems to work.

INSTRUCTIONS:
Create a new custom tag, call it something like "gallery" (or whatever you want), past the code in the code-area, customize the settings, save it and use it in the content with {gallery} or the name you gave to it.
Currently, you need a new tag for each gallery you want to show, since I don't know how to get parameters in these plugins. (Is there any method?)

I haven't any demo to show, since the whole site I'm developing in on my hard-disk: please, try it and say what do you think

Bye, Federico

[/b]

Posted: **Fri Feb 04, 2005 1:39 pm**

Thanks

Yes, I found the bug yesterday evening after posting this

This should be the correct code:

Code: Select all


// ===== CONFIG =====
// === FILE ===
// = Image directory =
$dir = "mygallery";
// = Valid extensions =
$types = array('jpg', 'jpeg', 'gif', 'png');
// = Exclude files =
$exclude = array('nottoshow.jpeg');
// = Exclude with regexp (PCRE) =
$exclude_regexp = array('#^editor_#', '#^thumb_#');
// === APPEARENCE ===
// = Table class =
$table_class = 'mygallery';
// = Thumbnail TD class =
$tb_td_class = 'mg_thumb';
// = Description TD class =
$de_td_class = 'mg_descr';
// END CONFIG



$filter = "#^(.+)\.(".implode($types,'|').")$#i";

$upath = "./uploads/images/{$dir}/";
$path = realpath("./uploads/images/{$dir}").'/';

if (empty($path)) return;

$d = dir($path);

echo "\n<table class=\"{$table_class}\">\n";

while ($f = $d->read()) {

if (filetype($path.$f) != 'file') continue;

if (in_array($f, $exclude)) continue;

if (!preg_match($filter, $f)) continue;

foreach ($exclude_regexp as $regexp)
if (preg_match($regexp, $f)) continue 2;

$size = @getimagesize($path.$f);

if (is_array($size)) $sizestr = ',width='.($size[0]+20).',height='.($size[1]+20);
else $sizestr = '';

echo "\t<tr>\n\t\t<td class=\"{$tb_td_class}\">\n\t\t\t".
"<a href=\"javascript:void(window.open('{$upath}{$f}','','resizable=no,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,fullscreen=no,dependent=no{$sizestr}'))\" title=\"Full-size image\">".
"<img src=\"{$upath}thumb_{$f}\" alt=\"\" /></a>\n\t\t</td>\n\t\t";

$pieces = explode('.', $f);
$pieces[count($pieces)-1] = 'txt';
$descf = implode('.', $pieces);

if (file_exists($path.$descf)) $descr = implode('', file($path.$descf));
else $descr = $f;

echo "<td class=\"{$de_td_class}\">\n\t\t\t\t{$descr}\n\t\t</td>\n\t</tr>\n";

}

$d->close();

echo "</table>\n";

Posted: **Fri Feb 04, 2005 5:18 pm**

New improved version

Now you need only one plugin, since it takes parameters:

dir -> image directory
types -> comma-separed list of valid extensions
exclude -> comma-separed list of excluded files
exclude_regexp -> comma-separed list of exclusion regexp

show_descr -> 'yes' shows the descriptions column, 'no' hides it

open_image -> 1: open image in a popup (javascript)
2: in a new window/tab (target=_blank)
3: in the self window/tab

table_class -> css class of the table
tb_td_class -> css class of the thumbnail cell
de_td_class -> css class of the description cell

If these parameters are not set, they default to values set in plugin code.
All params are optionals, default for "dir" is uploads/images/ (if not set in the code).

So paste the code into a new plugin, save it as "gallery" or whatever you want and call it in a content page

Code: Select all

{gallery_or_what dir="gallery/city" table_class="myclass"}

adding/changing/removing params as you want.

Code: Select all

/* PARAMETERS:
dir             -> image directory
types           -> comma-separed list of valid extensions
exclude         -> comma-separed list of excluded files
exclude_regexp  -> comma-separed list of exclusion regexp

show_descr      -> 'yes' shows the descriptions column, 'no' hides it

open_image      -> 1: open image in a popup (javascript)
                   2: in a new window/tab (target=_blank)
                   3: in the self window/tab

table_class     -> css class of the table
tb_td_class     -> css class of the thumbnail cell
de_td_class     -> css class of the description cell

If these are not set default to values set below
*/
extract($params);
// ===== DEFAULT CONFIG =====
// === FILE ===
// = Image directory =
$cdir = "";
// = Valid extensions =
$ctypes = array('jpg', 'jpeg', 'gif', 'png');
// = Exclude files =
$cexclude = array('nottosee.jpg');
// = Exclude with regexp (PCRE) =
$cexclude_regexp = array('#^editor_#', '#^thumb_#');
// === APPEARENCE ===
// = Table class =
$ctable_class = 'gallery';
// = Thumbnail TD class =
$ctb_td_class = 'g_thumb';
// = Show descriptions =
$cshow_descr = 'yes';
// = Description TD class =
$cde_td_class = 'g_descr';
// === LINKS ===
// = Open images in: =
// 1 -> popup (javascript)
// 2 -> new window/tab (target=_blank)
// 3 -> self window/tab
$copen_image = 1;
// END CONFIG

if (!isset($dir)) $dir = &$cdir;

if (isset($types)) $types = explode(',', $types);
else $types = &$ctypes;

if (isset($exclude)) $exclude = explode(',', $exclude);
else $exclude = &$cexclude;

if (isset($exclude_regexp)) $exclude_regexp = explode(',', $exclude_regexp);
else $exclude_regexp = &$cexclude_regexp;

if (!isset($table_class)) $table_class = &$ctable_class;

if (!isset($tb_td_class)) $tb_td_class = &$ctb_td_class;

if (!isset($show_descr)) $show_descr = &$cshow_descr;

if (!isset($de_td_class)) $de_td_class = &$cde_td_class;

if (!isset($open_image) || !is_int($open_image) || $open_image < 1 || $open_image > 3) 
$open_image = &$copen_image;

$filter = "#^(.+)\.(".implode($types,'|').")$#i";

$upath = "./uploads/images/{$dir}/";
$path = realpath("./uploads/images/{$dir}").'/';

if (empty($path)) return;

$d = dir($path);

echo "\n<table class=\"{$table_class}\">\n";

while ($f = $d->read()) {

if (filetype($path.$f) != 'file') continue;

if (in_array($f, $exclude)) continue;

if (!preg_match($filter, $f)) continue;

foreach ($exclude_regexp as $regexp)
if (preg_match($regexp, $f)) continue 2;

$size = @getimagesize($path.$f);

if (is_array($size)) $sizestr = ',width='.($size[0]+20).',height='.($size[1]+20);
else $sizestr = '';

switch ($open_image) {
case 1:
$url= "<a href=\"javascript:void(window.open('{$upath}{$f}','','resizable=no,".
"location=no,menubar=no,scrollbars=no,status=no,toolbar=no,fullscreen=no,".
"dependent=no{$sizestr}'))\" title=\"Full-size image\">";
break;
case 2:
$url = "<a href=\"{$upath}{$f}\" title=\"Full-size image\" target=\"_blank\">";
break;
case 3:
$url = "<a href=\"{$upath}{$f}\" title=\"Full-size image\">";
break;
}

echo "\t<tr>\n\t\t<td class=\"{$tb_td_class}\">\n\t\t\t".$url.
"<img src=\"{$upath}thumb_{$f}\" alt=\"\" /></a>\n\t\t</td>";

$pieces = explode('.', $f);
$pieces[count($pieces)-1] = 'txt';
$descf = implode('.', $pieces);

if (file_exists($path.$descf)) $descr = implode('', file($path.$descf));
else $descr = $f;

if ($show_descr == 'yes')
echo "\n\t\t<td class=\"{$de_td_class}\">\n\t\t\t\t{$descr}\n\t\t</td>";

echo "\n\t</tr>\n";

}

$d->close();

echo "</table>\n";

As usual, not very tested

Any suggestion? Please try it and say what do you think about it. Thanks very much

Fred

Posted: **Sun Feb 06, 2005 12:58 am**

Nice job Fred

I have added to my site and it works well (as long as images have been uploaded via the Image Manager, otherwise no thumbs)

Any progress on the change to allow columns to be specified? Or can I go for it?

Posted: **Mon Feb 07, 2005 9:46 pm**

Maybe the code from this Image Gallery script could be modified.
ImageGallery

Posted: **Tue Feb 08, 2005 11:17 am**

Greg wrote:Maybe the code from this Image Gallery script could be modified.
ImageGallery

Really nice, i will modify it

and integrate on CMSMS

Posted: **Wed Feb 09, 2005 5:15 pm**

KevinR wrote:Nice job Fred

I have added to my site and it works well (as long as images have been uploaded via the Image Manager, otherwise no thumbs)

Any progress on the change to allow columns to be specified? Or can I go for it?

Thanks

If I understand what you asked for, I think this simple change is something like what you want: now, with the param "columns" you may specify how many columns you want to be displayed: thumb cell( + descr cell, optional) = 1 column

Code: Select all

/* PARAMETERS:
dir             -> image directory
types           -> comma-separed list of valid extensions
exclude         -> comma-separed list of excluded files
exclude_regexp  -> comma-separed list of exclusion regexp

show_descr      -> 'yes' shows the descriptions column, 'no' hides it

columns         -> the number of image columns of the table

open_image      -> 1: open image in a popup (javascript)
                   2: in a new window/tab (target=_blank)
                   3: in the self window/tab

table_class     -> css class of the table
tb_td_class     -> css class of the thumbnail cell
de_td_class     -> css class of the description cell

If these are not set default to values set below
*/
extract($params);
// ===== CONFIG =====
// === FILE ===
// = Valid extensions =
$ctypes = array('jpg', 'jpeg', 'gif', 'png');
// = Exclude files =
$cexclude = array('prev_r_01_medium.jpeg');
// = Exclude with regexp (PCRE) =
$cexclude_regexp = array('#^editor_#', '#^thumb_#');
// === APPEARENCE ===
// = Image columns number =
$ccolumns = 1;
// = Table class =
$ctable_class = 'screenshots';
// = Thumbnail TD class =
$ctb_td_class = 't';
// = Show descriptions =
$cshow_descr = 'yes';
// = Description TD class =
$cde_td_class = 'd';
// === LINKS ===
// = Open images in: =
// 1 -> popup (javascript)
// 2 -> new window/tab (target=_blank)
// 3 -> self window/tab
$copen_image = 1;
// END CONFIG

if (isset($types)) $types = explode(',', $types);
else $types = &$ctypes;

if (isset($exclude)) $exclude = explode(',', $exclude);
else $exclude = &$cexclude;

if (isset($exclude_regexp)) $exclude_regexp = explode(',', $exclude_regexp);
else $exclude_regexp = &$cexclude_regexp;

if (!isset($table_class)) $table_class = &$ctable_class;

if (!isset($tb_td_class)) $tb_td_class = &$ctb_td_class;

if (!isset($show_descr)) $show_descr = &$cshow_descr;

if (!isset($de_td_class)) $de_td_class = &$cde_td_class;

if (!isset($open_image) || !is_int($open_image) || $open_image < 1 || $open_image > 3) 
$open_image = &$copen_image;

if (!isset($columns) || !is_int($columns) || $columns < 1) 
$columns = &$ccolumns;

$filter = "#^(.+)\.(".implode($types,'|').")$#i";

$upath = "./uploads/images/{$dir}/";
$path = realpath("./uploads/images/{$dir}").'/';

if (empty($path)) return;

$count = 0;

$d = dir($path);

echo "\n<table class="{$table_class}">\n";

while ($f = $d->read()) {

if (filetype($path.$f) != 'file') continue;

if (in_array($f, $exclude)) continue;

if (!preg_match($filter, $f)) continue;

foreach ($exclude_regexp as $regexp)
if (preg_match($regexp, $f)) continue 2;

$size = @getimagesize($path.$f);

if (is_array($size)) $sizestr = ',width='.($size[0]+20).',height='.($size[1]+20);
else $sizestr = '';

switch ($open_image) {
case 1:
$url= "<a href="javascript:void(window.open('{$upath}{$f}','','resizable=no,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,fullscreen=no,dependent=no{$sizestr}'))" title="Full-size image">";
break;
case 2:
$url = "<a href="{$upath}{$f}" title="Full-size image" target="_blank">";
break;
case 3:
$url = "<a href="{$upath}{$f}" title="Full-size image">";
break;
}

$count++;
if (($count-1) % $columns == 0) echo "\t<tr>\n";
echo "\t\t<td class="{$tb_td_class}">\n\t\t\t".$url.
"<img src="{$upath}thumb_{$f}" alt="" /></a>\n\t\t</td>";

$pieces = explode('.', $f);
$pieces[count($pieces)-1] = 'txt';
$descf = implode('.', $pieces);

if (file_exists($path.$descf)) $descr = implode('', file($path.$descf));
else $descr = $f;

if ($show_descr == 'yes')
echo "\n\t\t<td class="{$de_td_class}">\n\t\t\t\t{$descr}\t\t</td>\n";

if ($count % $columns == 0) echo "\t</tr>\n";

}

if ($count % $columns != 0) echo "\t</tr>\n";

$d->close();

echo "</table>\n";

Posted: **Fri Feb 11, 2005 3:37 am**

fredp wrote: If I understand what you asked for, I think this simple change is something like what you want: now, with the param "columns" you may specify how many columns you want to be displayed: thumb cell( + descr cell, optional) = 1 column

Frederick, you are a champion - that is exactly what i needed.

Now I have no excuse not to finish off the Gallery by adding my comment/descriptions files.

Thanks for the code.

Posted: **Fri Feb 11, 2005 4:01 pm**

Thanks very much

(also to everyone who tried this little script

)

CMS Made Simple Forums

[my work] Simple image gallery

[my work] Simple image gallery

[my work] Simple image gallery

Improved

[my work] Simple image gallery

[my work] Simple image gallery

[my work] Simple image gallery

[my work] Simple image gallery

[my work] Simple image gallery

[my work] Simple image gallery