smd_gallery: super-flexible gallery generator

Bloke · 2009-02-24 11:25:18

OK, smd_lib is patched v0.35 (zipped)

koobs · 2009-02-24 11:37:46

WOW! Top marks for a speedy bug fix

Thanks Stef

maniqui · 2009-02-24 16:14:08

Hi Bloke,
you may like to include the following tip as an example on plugin help. It’s an stripped down version of the one I posted on the faux bug report.
In fact, this can also be an example on smd_if plugin…

The following code will let you output rows of images, each row containing the same amount of images.
You may find it useful if you need to output rows of thumbnails (or any other thing), where each thumbnail has a different height. Usually, you may want to have thumbnails floated side by side, but if they have different heights, the output may get really messed.
Creating rows of images will let you float your thumbnails and then “clear” (applying overflow:hidden; height:100% to the row) the row, getting a tidier and neater output.

The following code will output rows of 3 images each row.

 <txp:smd_gallery category="animals">
<!-- we open the first row -->
  <txp:smd_if field="{counter}" operator="eq" value="1">
    <div class="photo-row">
  </txp:smd_if>

<!-- we start to spit the images -->
    <a href="{url}">
       <txp:thumbnail id="{id}" />
    </a>

<!-- if the counter is divisible by 3, and it's not the first image (1 = first loop) and it's not the last image ({totalimages} = last loop), close the row and open a new one -->
  <txp:smd_if field="{counter},{counter},{counter}" operator="divisible,not,not" value="3,1,{totalimages}">
    </div>
    <div class="photo-row">
  </txp:smd_if>

<!-- if this is the last image (last loop), close the div -->
  <txp:smd_if field="{counter}" operator="eq" value="{totalimages}">
    </div>
  </txp:smd_if>
  </txp:smd_gallery>

Bloke, feel free to revise it and do a re-wording of my explanation to fit your humorous style. :)

Edit: there was something wrong with the snippet: {maximages} will work fine if you aren’t using a limit attribute. But if you are using it, then results/maths won’t be as expected. It’s better to use {totalimages}, which matches the value of limit attribute (or, if not limit attribute, it matches the maximages value).

Last edited by maniqui (2009-02-25 05:55:01)

Bloke · 2009-02-24 16:24:09

Nice example, thanks maniqui. I’ll see if I can shoe-horn it into either the smd_gallery or smd_if plugin help next time I update one of them.

On a pseudo-related note I haven’t decided how much the new thumbnail dimensions in the database will affect the plugin. Should make things a little simpler (perhaps faster) because I can just read the dimensions directly from the database instead of having to use PHP to discover the sizes. But it might have a wider impact on the plugin attributes, so I’ll leave the dust to settle for a while before I go any further.

Last edited by Bloke (2009-02-24 16:24:52)

joebaich · 2009-02-24 16:38:55

Hey Julian,

Magic! I was scratching my head and pondering how to do almost exactly that when, ‘H E Y P R E S T O’, your post appeared. How do you do that? It’s uncanny.

Most grateful!

Joe

maniqui · 2009-02-24 16:48:00

You are welcome, Joe.
I must confess I borrowed the “algorithm” from a Django snippet at work.

Glad there exists smd_if and smd_gallery, so I could easily convert that snippet to TXP.
Bloke deserves all the credit.

joebaich · 2009-02-24 17:26:18

Yep, the Bloke deserves much credit for all he does for the community. Smd_gallery has been a great enabler for me. I like the way you integrated smd_if with it. All the prizes aren’t awarded for originality; adaption is a great thing.

Slightly off the topic, did you know that Adrian Holovaty, co-inventor of Django, named it after Django Rheihardt, the legendary Belgian jazz guitarist? Like txp_bloke, Adrian is disgustingly talented too. I often wonder if I should have paid more attention at school, read more books or something.

Last edited by joebaich (2009-02-24 17:28:26)

maniqui · 2009-02-25 05:58:59

@joebaich:

there was something wrong with the snippet above: {maximages} will work fine if you aren’t using a limit attribute. But if you are using it, then results/maths won’t be as expected. It’s better to use {totalimages}, which matches the value of limit attribute (or, if not limit attribute, it matches the maximages value).

@Bloke:

could you please confirm that {totalimages} always equals the limit attribute? And, if no limit, then it’s equal to the total amount of images fetched/outputted?

Thanks.

Last edited by maniqui (2009-02-25 06:02:29)

the_ghost · 2009-02-25 08:35:33

But would it be nessary to resave very image so thumbnail sizes insert to database?

Bloke · 2009-02-25 14:22:17

maniqui wrote:

could you please confirm that {totalimages} always equals the limit attribute? And, if no limit, then it’s equal to the total amount of images fetched/outputted?

I concur.

With no limit, {maximages} equals {totalimages} equals total number of matching images from your criteria
With limit, {maximages} equals total number of images across all pages, and {totalimages} is equal to your limit attribute

The offset jams a slight spanner in the mechanism but I think the totals still remain true. At least, they’re supposed to. If you find they don’t please let me know.

mark.adams82 · 2009-02-26 11:48:41

Hi, thanks for the great plugin – it serves me very well.
The only sticking point I am having at the moment is (possibly very stupid, but..) when I add the pageform attribute to the gallery tag, the output is fine in terms of functionality, however it is injected into the thumbnail ul and is not surrounded by li’s. This obviously breaks validation and due to styling, breaks layout.
Like I say, its probably very simple to sort out, but I’m going demented trying to work a solution. Any help greatfully received!

My tag is as follows

EDIT : Looks like I have eventually answered my own question, will post solution in case it can help anyone else keep some hair:

Specify wraptag and class implicitly as attributes in the tag, rather than hard-coding the ul class=“gallery” as I did above.
>>
<txp:smd_gallery category=“wedding-gallery” wraptag=“ul” class=“gallery” form=“article_gallery” pageform=“gallery_nav” limit=“10” />

Last edited by mark.adams82 (2009-02-26 12:08:30)

progre55 · 2009-02-26 22:33:58

Bloke:

I am hard at work on my other projects (ie calendar project etc.), but to add another item to the list, I now need your brilliance regarding a slideshow gallery and how to create this effect …

I need the background of the website to change in concert with the images that are being displayed in the slideshow …. I know I can do this with flash, but I would rather not go down that road … I also know I can create this effect on a clickable image … but again this is not what I am looking for …

I am hoping you may have something in your bag of tricks :)

By the way, let me know if you need more input regarding the calendar plug in (just curious if you thought the custom date thing could be implemented soon or is this way off on your todolist) …

progre55

Textpattern CMS

Textpattern CMS support forum

#373 2009-02-24 11:25:18

Re: smd_gallery: super-flexible gallery generator

#374 2009-02-24 11:37:46

Re: smd_gallery: super-flexible gallery generator

#375 2009-02-24 16:14:08

Re: smd_gallery: super-flexible gallery generator

#376 2009-02-24 16:24:09

Re: smd_gallery: super-flexible gallery generator

#377 2009-02-24 16:38:55

Re: smd_gallery: super-flexible gallery generator

#378 2009-02-24 16:48:00

Re: smd_gallery: super-flexible gallery generator

#379 2009-02-24 17:26:18

Re: smd_gallery: super-flexible gallery generator

#380 2009-02-25 05:58:59

Re: smd_gallery: super-flexible gallery generator

#381 2009-02-25 08:35:33

Re: smd_gallery: super-flexible gallery generator

#382 2009-02-25 14:22:17

Re: smd_gallery: super-flexible gallery generator

#383 2009-02-26 11:48:41

Re: smd_gallery: super-flexible gallery generator

#384 2009-02-26 22:33:58

Re: smd_gallery: super-flexible gallery generator

Board footer