Wilt u een gastenblog schrijven voor UpService?

Wanneer u onderstaande gegevens invult nemen we zo spoedig mogelijk contact met u op.

Bedrijfsgegevens - invullen verplicht

Gallery en CGFeedback

De Gallery module is een eenvoudige en gebruiksvriendelijke gallerie, album module voor CMS Made Simple. De Gallery module wordt regelmatig verbeterd, op het moment dat er een nieuwe versie uit is, zie je deze in de modulemanager van het CMSMS admin gedeelte voorbijkomen.

Sinds Gallery 1.1 is het mogelijk om de Gallery module te koppelen aan de CGFeedback module, dit gaat via het fileid veld. Deze blog legt uit hoe dat in zijn werk gaat.

Wat is fileid

fileid : is een unieke waarde (primary key) die voor iedere afbeelding binnen Gallery in de database wordt opgeslagen.

Wanneer je via {Gallery} de module aan een pagina toevoegd wordt er een php-programma uitgevoerd die de database gegevens ophaalt en deze in een (smarty-)template plaatst. Met behulp van deze template wordt alles op het scherm zichtbaar.

Een typisch fragement uit een Gallery template is:

{foreach from=$images item=image}
    <a href="{$image->file}" title="{$image->title}"><img src="{$image->thumb}" alt="{$image->title}" /></a>
{/foreach}

Vanaf Gallery 1.1 kan je in een template dus ook: {$image->fileid} gebruiken.

Het koppelen van CGFeedback aan Gallery

Voor het koppelen van CGFeedback (een generieke module voor opmerkingen / feedback) aan Gallery heb ik dankbaar gebruik gemaakt van . Het eindresultaat is: dat bezoekers van mijn website nu commentaar kunnen plaatsen bij foto's uit de Gallery module.

Voor een uitgewerkt voorbeeld zie:

http://www.ctrl-esc.net/fotolog/

Stap 1: Installeren van modules

  • installeer via "Module Manager" CGFeedback + afhankelijkheden
  • installeer via "Module Manager" Gallery

Stap 2: Configureren van modules

  • Maak op z'n minst 1 album aan binnen de Gallery module
  • Voeg 1 extra veld toe aan Calguys Feedback Module:
    + ga naar Content -> CalguysFeedback module -> Fields
    + Noem dit veld "fileid"

Stap 3: Installeren van "function.gallerydetail.php" plugin

De Gallery module maakt voor het weergeven van grote foto's gebruik van een floatbox (Jquery JavaScript library). Het is mogelijk om het feedbackformulier ook in deze floatbox op te nemen maar ik vond het makkelijker om de grote foto op een eigen pagina te plaatsen en hieronder de {CGFeedback} module aanroep te plaatsen.

Om dit mogelijk te maken heb ik een plugin gemaakt "function.gallerydetail.php" deze dient in $web_root/plugins geplaatst te worden:

<?php

    #CMS - CMS Made Simple copyright notice

    function smarty_cms_function_gallerydetail($params, &$smarty) {
       
       //print "<h1>* gallerydetail</h1><br>\n";
       
       if (!function_exists('MyGetModuleInstance')) {
           function &MyGetModuleInstance($module) {
               global $gCms;
               
               if (isset($gCms->modules[$module]) &&
                   $gCms->modules[$module]['installed'] == true &&
                   $gCms->modules[$module]['active'] == true) {
                       return $gCms->modules[$module]['object'];
               }
               
               // Fix only variable references should be returned by reference
               $tmp = FALSE;
               return $tmp;
           }
       }
       
       ###########################################################################
       # globals
       ###########################################################################
       
       global $gCms;
       
       $gallery = MyGetModuleInstance('Gallery');

       if ($gallery == FALSE) {
           return false;
       }
       
       $db = &$gCms->db;
       $smarty =& $gCms->GetSmarty();
       
       // @todo dynamic sorting


       ###########################################################################
       # defaults
       ###########################################################################
       
       $debug = '0';
       
       ###########################################################################
       # get querystring values + override defaults
       ###########################################################################

       if (isset($params['image']) && is_numeric($params['image']) ) {
           $image = $params['image'];
       } else {
           return false;        
       }
               
       ###########################################################################
       # program
       ###########################################################################
       
       // get all information about the current image
       
       $galleryinfobyid = $gallery->_Getgalleryinfobyid($image);
       $galleryinfobypath = $gallery->_Getgalleryinfo($galleryinfobyid['filepath']);
           
       // assing galleryinfo data
       
       $onerow                     = new stdClass();
       $onerow->fileid             = $galleryinfobyid['fileid'];
       $onerow->galleryid          = $galleryinfobypath['fileid'];
       $onerow->defaultfileid      = $galleryinfobyid['defaultfile'];
       $onerow->active             = $galleryinfobyid['active'];
       $onerow->main_path          = $galleryinfobypath['filepath'];
       $onerow->sub_path           = $galleryinfobypath['filename'];
       $onerow->full_path          = $onerow->main_path. '/'. $onerow->sub_path;
       $onerow->filename           = $galleryinfobyid['filename'];
       $onerow->supersizer_image   = 'uploads/images/Gallery/'. $onerow->full_path. $onerow->filename;
       $onerow->image              = '/uploads/images/Gallery/'. $onerow->full_path. $onerow->filename;
       $onerow->thumb              = '/uploads/images/GalleryThumbs/'. $onerow->fileid. '-1.jpg';
       $onerow->title              = $galleryinfobypath['title'];
       $onerow->comment            = $galleryinfobypath['comment'];

       $galleryfiles               = _Getgalleryfiles($onerow->full_path);
       $onerow->total_count        = count($galleryfiles);
       
       // assign gallerydetail_files
       
       $counter = '0';
       $last = ($onerow->total_count -1);
       $counter_plus_one = '1';
       $counter_minus_one = '-1';
       $gallerydetail_files = array();
       
       foreach ($galleryfiles AS $value) {
           
           $multirows = new stdClass();
           
           // we have a match
           
           if ($value['fileid'] == $image) {
                           
               $next_value = $galleryfiles[$counter_plus_one];
               $prev_value = $galleryfiles[$counter_minus_one];
               
               if ($next_value['fileid'] && ($counter != $last) ) {
                   $onerow->next_fileid    = $next_value['fileid'];
                   $onerow->next_filename  = $next_value['filename'];
                   $onerow->next_filepath  = $next_value['filepath'];          
                   $onerow->next_image     = '/uploads/images/Gallery/'. $onerow->full_path. $onerow->next_filename;
                   $onerow->next_thumb     = '/uploads/images/GalleryThumbs/'. $onerow->next_fileid. '-1.jpg';
               }
               
               if ($prev_value['fileid'] && $counter != 0) {
                   $onerow->prev_fileid    = $prev_value['fileid'];
                   $onerow->prev_filename  = $prev_value['filename'];
                   $onerow->prev_filepath  = $prev_value['filepath'];          
                   $onerow->prev_image     = '/uploads/images/Gallery/'. $onerow->full_path. $onerow->next_filename;
                   $onerow->prev_thumb     = '/uploads/images/GalleryThumbs/'. $onerow->prev_fileid. '-1.jpg';
               }
               
               $multirows->is_current = '1';        
                 
           } else {
               $multirows->is_current = '0';            
           }
           
           // assign the rows
           
           $multirows->fileid      = $value['fileid'];
           $multirows->filename    = $value['filename'];
           $multirows->filepath    = $value['filepath'];
           $multirows->counter     = $counter;
           $multirows->position    = $counter_plus_one;
           $multirows->galleryid   = $value['galleryid'];
           
           $multirows->image       = '/uploads/images/Gallery/'. $onerow->full_path. $multirows->filename;
           $multirows->thumb     = '/uploads/images/GalleryThumbs/'. $multirows->fileid. '-1.jpg';
           
           $gallerydetail_files[]  = $multirows;
                   
           $counter++;
           $counter_plus_one++;
           $counter_minus_one++;
       }
       
           
       //print "<pre>\n";
       //print_r($onerow);
       //print_r($gallerydetail_files);
       //print "</pre>\n";
       
       
       $smarty->assign('gallerydetail', $onerow);
       $smarty->assign('gallerydetail_files', $gallerydetail_files);
           
       return;
       
       
    }

    ################################################################################
    # subroutines
    ################################################################################

    /* taken and modified from Gallery.module.php */

       function _Getgalleryfiles($path)
       {
          $path = trim($path,"/");
          $output = array();
           global $gCms;
           $db = &$gCms->db;
          $query = "SELECT
                            g1.*, CONCAT(g2.filepath,?,g2.filename) AS thumb
                         FROM
                            " . cms_db_prefix() . "module_gallery g1
                         LEFT JOIN
                            " . cms_db_prefix() . "module_gallery g2
                         ON
                            g1.defaultfile = g2.fileid
                         WHERE
                            g1.filepath=? AND g1.active = '1'
                                   ORDER BY g1.fileorder, g1.filename DESC";                              
                                   
          $result = $db->Execute($query, array('/'.IM_PREFIX,$path));
          if ( $result && $result->RecordCount() > 0 )
          {
            while ( $row=$result->FetchRow() )
            {
               $output[] = $row;
            }
          }
          if ( !$result )
          {
             echo 'ERROR: ' . mysql_error();
             exit();
          }
          return $output;
       }

    /**
    * smarty_cms_help_function_gallerydetail: cmsms help function
    */

    function smarty_cms_help_function_gallerydetail() {

     ?>
     
     <h3>What does this do?</h3>
     
     <p>
     This extension is made for the "Gallery" module. It can be used to list a single image by "fileid".
     </p>
     
     <h3>How do I use it?</h3>
     
     <p>
     Just insert the tag into your template/page like:
     <code>{gallerydetail image=$fileid_in}</code>
     </p>
     
     <h3>What parameters does it take?</h3>
     
     <p>
     image: $fileid_in (numeric)
     </p>
     
     <h3>@todo</h3>
     
     <p>
     - extend documentation <br />
     - add sorting options <br />
     - add support to listall by categoryname / title <br />
     </p>
     
     
     <?php
     
     
    }

    /**
    * smarty_cms_about_function_gallerydetail: author and history information
    */

    function smarty_cms_about_function_gallerydetail() {
       ?>
       <p>Author: Arnoud</p>
       <p>Version: 1.0</p>
       <p>
       Change History:<br/>
       None
       </p>
       <?php
    }

    ?>

Stap 4: Aanmaken van Global Content Block met hierin {gallerydetail} aanroep

  • Ga naar Content -> Global Content Blocks (GCB)
  • Voeg GCB toe noem deze gallerydetail
  • Zet WYSIWYG op uit
  • Plak in het content veld de volgende code:
{if $smarty.get.fileid}
{assign var=fileid_in value=$smarty.get.fileid}  
{gallerydetail image=$fileid_in}
{/if}

<pre>
<p>{$gallerydetail|print_r}</p>
<p>{$gallerydetail_files|print_r}</p>
</pre>

Stap 5: Maak een nieuwe pagina aan en plaats hierin GCB

  • Maak een nieuwe pagina aan: Content -> Pages -> Add New Content
  • Plaats in het content veld de onder stap 4 gemaakte GCB:

Mijn pagina heb ik gallery genoemd en deze is te bekijken via: http://mijn-web-site.nl/index.php?page=gallery ! onthoud de url van deze pagina.

Stap 5: Modificeren van Gallery templates

Om de CGFeedback module te kunnen koppelen aan de Gallery module moeten er nog een aantal wijzigingen gemaakt worden in de template van Gallery.

  • Ga naar Content -> Gallery -> [Templates] tab
  • Als voorbeeld maak ik wijzigingen in de Fancbox templates

Het volgende fragement:

<a class="group" href="{$image->file}" title="{$image->title}" rel="gallery"><img src="{$image->thumb}" alt="{$image->title}" /></a> <br />

Verander ik in:
! letop de url (index.php?page=gallery) die je in de vorige stap onthouden hebt komt hier terug.

<a class="group" href="{$image->file}" title="{$image->title}" rel="gallery"><img src="{$image->thumb}" alt="{$image->title}" /></a> <br />   
   <a href="/index.php?page=gallery&fileid={$image->fileid}">Place feedback</a>

Aan de onderkant van de pagina voeg ik toe:

{if !$image->isdir}
<h1>Feedback</h1>

{gallerydetail fileid=$images.0->fileid}
{CGFeedback key1="Gallery" key2=$galleryinfobyid.galleryid action='summary'}
{/if}

Tot slot

Bovenstaande voorbeeld is erg basic en met name geschikt voor de gevorderde CMSMS gebruiker met doorzettingsvermogen.

Mobiele site UpService

Offerte aanvragen

Download ons offerte aanvraagformulier na het invullen kunt u deze op onze offerte aanvraag pagina uploaden.