Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

All other Modules

Discuss all other Modules here.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

gallery "style" module


Go to End
Reply

9 Posts   1763 Views

Avatar
JPG

5 July 2010 at 2:21am Community Member, 53 Posts

Does anyone know if there is a gallery style module or even if it is possible to tweak the existing ones (eg uncle cheese's) to use in the following way...

I want to create a kind of profile page for an artist, withing the page I want some copy about them and some images for examples of work.... This thing is I need this to be able to be amended in the backend (via uploading images etc) the same way that the mention gallery module works???? Also I want the menu for the gallery to work with my pre-made Jquery menus.

Any ideas - much appreciated...

J

Avatar
Bambii7

5 July 2010 at 9:20pm Community Member, 254 Posts

If your doing a few sites that need collections of images of some description its definitely worth getting to know uncle cheese's DataObjectManager. I've used the filedataobjectmanager class to feed images into slide show pro or shadow box thumbs. Taking the time to do it yourself means its much easier to customise image resizing for thumbnails and/or larger full size images.

The following is the most complicated part about implementing it (I did this a few days ago for use with the shopping module, you might want to call it GalleryImageObject....)

<?php
class ProductImageObject extends DataObject
{

   static $default_sort = "SortOrder";
   
   static $db = array (
   );

   static $has_one = array (
      'ProductImage' => 'Image'
   );
   
   public function getCMSFields_forPopup()
   {
      return new FieldSet(
         new FileIFrameField('ProductImage')
      );
   }
   
   public function Thumbnail()
   {
      return $this->ProductImage()->CroppedImage(120,120);
   }
   
   
   public function Large()
   {   
      return $this->ProductImage()->CroppedImage(300,300);
   }
   
}
?>

With a class like above, if you need captions of links wrapped around your images you can just add fields to $db and add the appropriate form field to the popup function.
Then on your gallery page add a has many relationship to the above dataobject, and uncle cheese's FileDataObjectManager, which I found difficult getting my head round the first time I used it.

class Product extends Page {
   
   static $has_many = array (
      'ProductImages' => 'ProductImageObject',
   );
   function getCMSFields() {
      $fields = parent::getCMSFields();

      // Allow Multiple Images
      $manager = new FileDataObjectManager(
         $this, // Controller   
         'ProductImages', // Source name
         'ProductImageObject', // Source class
         'ProductImage', // File name on DataObject
// this array was left in from the last time I used this manager (i think)
         array(
            //'Name' => 'Name',
            //'Caption' => 'Caption',
            //'Category' => 'Category'
         ), // Headings
         'getCMSFields_forPopup' // Detail fields (function name or FieldSet object)
         // Filter clause
         // Sort clause
         // Join clause
      );
      $manager->sort = 'SortOrder';
      $manager->sort_dir = "ASC";
      $manager->setAllowedFileTypes(array('jpg','gif','png'));
      $manager->setBrowseButtonText("Upload");
      $manager->setGridLabelField('Name');
      $manager->setPluralTitle('Product Images');
      
      $fields->addFieldToTab("Root.Content.ProductImages", $manager);

      return $fields;
   }

}

Then on my Product.ss page or for you ArtistGalleryPage.ss I have.

   <div id="ThumbNails">
<% control ProductImages %>
         <img src="{$Thumbnail.Filename}" alt="{$Large.Filename}" />
<% end_control %>
</div>

You could just have
<% control ProductImages %>
         $Thumbnail
<% end_control %>

But I was using the alt attribute for a javascript function.
I hope that helps. The FileDataObjectManager is awesome, mainly because it gives you a little thumbnail of the image in the admin.
And if you add
SortableDataObject::add_sortable_class('ProductImageObject');
to yoursite/dataobjectmanager/_config.php
you can drag and drop your images around to reorder them in the future, very useful!

Avatar
JPG

6 July 2010 at 1:43am Community Member, 53 Posts

Thanks Bambii7 - that looks like some v.helpful (at the very least looks like it will keep me up for a few days!) - sorry was a bit vague in description before but this is an example of the "kind" of thing that I am looking to acomplish, as I said before this menu style (image and jquery rollover/text but with the ability the amend both in the back-end plus with the selected page giving some kind of <i>light box</i> style gallery...

example: [url]http://www.i-donline.com/i-spy[/url]

Avatar
Bambii7

6 July 2010 at 11:32am Community Member, 254 Posts

Wow very very cool site.
I think I kinda understand. You want an image based menu? And a light box gallery for each page?

I did this site a month or so ago http://seatinglogic.com/home/outdoor-airport/silver-surf/ its not finished, but you can see the shadow box being used. I can dig the code up if you want it, but it was very similar to the code I posted earlier.

Then for an image based menu I'd imagine you'd give Page a
$has_one('MenuImage'=>'Image');
That will bind one image to the page in the database. Then to allow administrators to upload a new image add

function getCMSFields() {
$fields = parent::getCMSFields();
$fields->addFieldToTab("Root.Content.Main", new FileIFrameField('ProductImage'));
return $fields;
}

Then use something like this for your menus.

<% control Menu(2) %>
   <li class="$LinkingMode">
   <a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levela">
$MenuImage
</a>
   </li>
<% end_control %>

I hope thats helping.

Avatar
JPG

6 July 2010 at 10:18pm Community Member, 53 Posts

Thanks Bambii7 - that would great (to see the code), you seem to know exactly what I am trying to achieve - when I get the site and running would love hear what you think. I like the gallery in your example - not entirely sure how I will fully achieve mine - maybe a Jquery image gallery - this should work okay with the DataObjectManager(?). If not I can (as you stated) use an image based menu and a light box gallery for each page.

This is my first SS site (have been using ModX in the past) a client requested it and so far have been quite happily surprised with it. Think that I nearly converted...

Much thanks...

Avatar
UncleCheese

7 July 2010 at 12:41am 4085 Posts

Remember that DataObjectManager is a backend tool and jQuery lightbox gallery is a frontend tool, so they're totally disparate and independent of each other.

You can use the ImageGallery module, but if you have specific needs it might get in your way. If you want what it does, however, you'll be up and running faster than you can imagine.

Otherwise, I'd use an ImageDataObjectManager and create your own templates and controllers for your gallery.

Avatar
Bambii7

7 July 2010 at 8:40am Community Member, 254 Posts

I haven't used other ObjectManagers besides this FileDataObjectManager, but I'd imagine UncleCheese would know what he's on about :)

I had to go through the code and make sure I didn't have any sensitive data in there. I changed a few things to try and make the code more readable.

I used the GalleryHolderPage.ss on this site http://www.mitchellstoutarchitects.co.nz/residential which may be of use to you.

Attached Files
Avatar
Bambii7

7 July 2010 at 8:55am Community Member, 254 Posts

p.s. that gallery is dependent on the DataObjectManager Module and SWFUpload module. And I didn't test it after I made the changes sorry, but it should work

Go to Top