Feature request for [[it_gallery]] droplet (with code solution)

[digitalbricks]

Hello Ralf,

please tag this issue as feature request with low priority because it is no real issue. The [[it_gallery]] works great with the functions provided after installing imageTweak. But there is one thing that could be better, maybe.

My scenario:

I have multiple [[it_gallery]] calls on one page, that means i have multiple gallerys on one single page. Everything works well but ALL images across ALL galleries where grouped into one single fancybox group. I use it on a product page for presenting product images and this cross-gallery-grouping causes the behavior, that after all images of item 1 were displayed, fancybox just jumps to the images of item 2 - then item 3, item 4 and so on.

Thoughts

This grouping into one single group is because the rel-attribute on the anchor element is always the same. So it would be better to be able to specify (optional) a gallery id in the [[it_gallery]] call.

Solution

After some investigation in the imageTweak code and some try and error i get a working solution for this usecase. Even using git for local version control, i am not familiar with git pull requests and so i will write down the code changes in the following lines. If you want, please transfer it to the next imageTweak version - i think it can be helpful for other users.

The [[it_gallery]] droplet, starting line 21, added PARAM_MEMBERID

  $params[imageTweakGallery::PARAM_FOLDER] = (isset($folder)) ? $folder : '';
  $params[imageTweakGallery::PARAM_MEMBERID] = (isset($memberid)) ? $memberid : '1'; //ADDED

Note: Now we are able to specify a groupmember-id in droplet call for user defined image grouping, e.g. [it_gallery?folder=FOLDER_IN_MEDIA_DIR&width=PIXEL&memberid=1]]

File modules/image_tweak/class.gallery.php, starting line 161

class imageTweakGallery {

    const PARAM_CSS = 'css';
    const PARAM_FOLDER = 'folder';
    const PARAM_MEMBERID = 'memberid'; //ADDED
    const PARAM_RECURSIVE = 'recursive';
    const PARAM_WIDTH = 'width';

    private $params = array(
            self::PARAM_CSS => true,
            self::PARAM_FOLDER => '',
            self::PARAM_MEMBERID => '1', //ADDED
            self::PARAM_RECURSIVE => true,
            self::PARAM_WIDTH => 200
            );

File modules/image_tweak/class.gallery.php, starting line 379

$memberid = $this->params[self::PARAM_MEMBERID]; //ADDED
        if (!file_exists($temp_path_zoom)) {
            try {
                mkdir($temp_path_zoom, 0755, true);
            }
            catch(ErrorException $ex) {
                $this->setError(sprintf('[%s - %s] %s', __METHOD__, __LINE__, sprintf(tweak_error_mkdir, $temp_path_zoom, $ex->getMessage())));
                return $this->show();
            }
        }

File modules/image_tweak/class.gallery.php, starting line 494

$items[] = array(
                        'is_first' => ($start && (empty($start_file)) || ($fileinfo->getBasename() == $start_file)) ? 1 : 0,
                        'class' => media_filename($this->params[self::PARAM_FOLDER]),
                        'title' => isset($description_array[$fileinfo->getBasename()]) ? $description_array[$fileinfo->getBasename()] : '',
                        'zoom' => array(
                                'url' => $temp_url_zoom.$fileinfo->getBasename(),
                                'width' => $zoomWidth,
                                'height' => $zoomHeight
                        ),
                        'memberid' => $memberid, //ADDED
                        'preview' => array(
                                'url' => $temp_url_preview.$fileinfo->getBasename(),
                                'width' => $previewWidth,
                                'height' => $previewHeight
                        )
                );

Note: Now we are able to access memberid in the dwoo(?) template

File modules/image_tweak/htt/frontend.gallery.lte, starting line 22

<div class="it_gallery">
    {* get first image of the gallery really prompt it as first image! *}
    {foreach $gallery image}
      {if $image.is_first == 1}
        <a href="{$image.zoom.url}" title="{$image.title}" class="fancybox" rel="group{$image.memberid}"><img src="{$image.preview.url}" width="{$image.preview.width}" height="{$image.preview.height}" alt="{$image.title}" /></a>
      {/if}
    {/foreach}
    {foreach $gallery image}
      {if $image.is_first == 0}
        <a href="{$image.zoom.url}" title="{$image.title}" class="fancybox" rel="group{$image.memberid}"></a>
      {/if}
    {/foreach}
  </div>

Note: I added the class "fancybox" to the anchor element (this is used for triggering fancybox) and modified the rel-attribute in order to group images using the forwarded memberid. Triggering the fancybox by class "fancybox" is already set up in it_gallery.jquery - no need to change anything

Summary

Maybe this looks a little bit weird but at the end there is only the need of adding five lines and modifying two lines. Of course the line numbers mentioned above will vary in your files because of the additions i made.

If you find it useful please feel free to implement it in further versions of imageTweak. Maybe the work could done be easier or better - i am not a programmer.

If you have any question, don't hesitate to ask them – gladly also in german ;-)

Kind regards
André

[hertsch]

Wow, thank you for this feature request!

It is planned to develop imageTweak as an extension for the new (coming soon) kitFramework. As a filter for the different CMS it will work like now and optimize images on the fly. In addition the imageTweak extension should act as an interface and enable the creation of many different galleries. This concept is already realized for a kitFramework FacebookGallery extension.

Anyway: I will grab and realize your feature request.

Regards
Ralf