smd_slimbox

Bloke · 2007-02-06 12:12:53

jstubbs wrote:

Is it possible to use your plugin with the stm_javascript plugin

It wasn’t… but it is now :-)

I’ve given smd_slimbox_inc a major overhaul in v0.2. Key features:

You can still use jsdir and cssdir as before
If you prefer to change locations of files or rename things you can now take advantage of a new option scripts. It takes up to 3 arguments, separated by commas; one for each script that is required by the plugin. Although you can skip modules (for example if you load them elsewhere… more in a minute), you have to specify them in this order: mootools JS file, slimbox JS file, slimbox CSS file. OK, technically speaking the CSS can go anywhere, so the key thing to remember is that when the page is rendered, mootools.js MUST appear before slimbox.js.
You can mix and match jsdir, cssdir, scripts and skip to tell it how you lay out your file system and how you work best within TXP. The only stipulation is if the total number of scripts you give to smd_slimbox_inc is not 3, it will complain.
If you wish to load javascript or CSS “outside” the tag, e.g. from txp:stm_javascript or txp:css you can do that. Just tell smd_slimbox_inc how many files you have managed yourself using the skip option.

So, for example, you could do this:

<txp:js n="mootools" />
<txp:js n="slimbox" />
<txp:css n="slimbox" />
<txp:smd_slimbox_inc skip="3" />

In essence, you must satisfy smd_slimbox_inc that you are aware of the existence of the 3 scripts. How you choose to notify it of this fact is up to you.

Another example:

<txp:js n="mootools" />
<txp:smd_slimbox_inc skip="1" cssdir="/myCss" scripts="/myScripts/slimbox.js" />

Unfortunately it’s not possible to embed the output of txp:stm_javascript or txp:css directly in the attributes of the scripts tag. That would be way cool. If you really really want to do it though, I’ve built the plugin so that you can hack it by using PHP and calling the tag directly, like this:

<txp:smd_slimbox_inc cssdir="/myCss" scripts="/myScripts/mootools.js, <txp:php>echo js(array('n' => 'slimbox'));</txp:php> />

Messy, but powerful! See Wet’s excellent post on tags in tags for more.

Also in this release, after a few hours chatting with wouaren last night, I’ve decided to reduce the amount of tag soup in the output. One new option has been added: wraptag which is the tag you wish to wrap each thumbnail “cell” with. It defaults to ‘nothing’, i.e. no tag at all (previously each cell was <div class="cell">). Practical exmaples might be wraptag="div", wraptag="li" or wraptag="p". Also, a lot of the default classes are now empty and do not appear in the page. They were not really necessary as you could get a CSS handle on them all without needing an explicit class name.

A consequence of this is your CSS or tag options may have to change when you upgrade, if you wish to keep it how you had it before. Sorry to mess you about, but the new output style is a lot meaner and leaner, requires less tag options for sensible output and is still highly controllable through CSS (examples in the plugin doc).

So now, instead of:

<div class="cell"><a href="blah"><img src="thumb1" /></a></div>
<div class="smd_slimbox_nav"><a class="smd_slimbox_next" href="?pg2">Next</a></div>

the default output is:

<a href="blah"><img src="thumb1" /></a>
<a class="smd_slimbox_next" href="?pg2">Next</a>

There is still a hard-coded <span> around the caption/alt because otherwise it’s just free-floating text and the page does not validate. I’ve also retained the default class names for the two Next/Prev links simply because they can then be easily differentiated from the other “a” tags around the thumbnails, without having to supply any more plugin options.

These changes should hopefully not cause you too many problems, but let me know if I’ve been a little over-zealous with the optimisations. Surrounding the plugin with <ul class="smd_slimbox"> and giving an option of wraptag="li" gives pretty much the same output as before, except now it’s a fancy unordered list instead of a series of divs. Much neater!

So without any more waffle, here’s smd_slimbox v0.2

I’ve also uploaded a separate version of mootools with the transitions if you want that functionality. The old version of Slimbox/mootools (v0.83) is still availble in smd_slimbox_v0.12 if you’re having compatibility problems with other plugins and the new v1.0 mootools framework.

Feedback welcome as ever. See ya!

Last edited by Bloke (2007-02-06 12:17:07)

Papuass · 2007-02-06 23:13:02

Great plugin, I have just migrated from bas_lightbox pugin.

After installing your plugins, I ran some queries to update my posts with images:

MAKE BACKUP BEFORE!
I did and had to use it – messed up one querie :)

UPDATE textpattern SET Body=replace(Body,'<txp:bas_lightbox id="','
<txp:smd_slimbox imageid="');
UPDATE textpattern SET Body_html=replace(Body_html,'<txp:bas_lightbox id="','
<txp:smd_slimbox imageid="');
UPDATE textpattern SET Body_html=replace(Body_html,'</txp:bas_lightbox>','
</txp:smd_slimbox>');

Working like a charm.

Last edited by Papuass (2007-02-06 23:13:36)

joel · 2007-02-11 19:17:44

where do I edit the caption text “Image xx of xx”?
I would like to change the language for this.

Thanks for a great plugin! :)

Vitruvius · 2007-02-12 09:57:28

I’ve finally had a chance to play with this plugin – and its great :) –

It turns out I was a little confused about what it actually did.

I’d love it if your powerful category selection code could be put to work to output kind of a mix between image_index and category_list (type=image). An index of image categories, with image categories listed and one (or more) thumbnails from each category. It would kind of be the page before the gallery proper. The main advantage would be that as image categories are added, the output would just include them. Having negate and other selection in the tag would enable the the filtering of misc image categories etc.

Anyway – this is a fine plugin as it stands – thanks again :)

SH

Bloke · 2007-02-12 20:22:10

joel wrote:

where do I edit the caption text “Image xx of xx”?
I would like to change the language for this.

Not in the plugin unfortunately; that has to be changed in Christophe’s code. Try looking in the comments or the forums (the ‘Get Help’ link from his page) and see if anyone else has mentioned about changing the language.

(if you’re a coder, have a look at line 140 of slimbox.js; in v1.3, it’s hard-coded there and you can change the text between the ' ' marks).

Vitruvius wrote:

I’d love it if your powerful category selection code could be put to work to output kind of a mix between image_index and category_list (type=image).

Ah, I see what you’re getting at, and now your previous post makes more sense :-p

Neat idea. So do you mean you could sort of offer a “here is a sample of what’s in all my galleries” and then when you click on one or more of the catgeories/thumbnails it takes you to a page that shows all the images in that category and from there you can do slimbox or however else you wish to display them?

Interestingly enough, the thing that tells the code to use slimbox is simply the use of rel="slimbox-groupname" so if I were to offer an option to suppress that bit, you’d have all the power of the category/id/negation available to make an image gallery that simply showed limit thumbnails with links to full-sizers. No idea where (if anywhere) we could go from there!

Ideally you’d want a combination, I guess? Perhaps some way of using if_different on a category that fed its name to a cut-down version of smd_slimbox that could then trim that category down using negation if required. Quite how/if it would use the ?fieldname options I don’t know; need to think about it.

I’m not very good with if_different yet; all the times I’ve used it I’ve just nicked someone else’s code and hacked it to work in my situation without really knowing how it works! If I suss out how it passes its parameters to other plugins/how I read that info into my plugins, it might spark some ideas that lead to a new plugin or a mod to this one.

If you’ve got any more thoughts on where you’d like to take this, share them with me (probably offline if it starts deviating too far from the plugin core; get hold of me via my website and we can mail/MSN/AIM from there if you like). It might turn out that such a tag should really be something that the core image_index/category_list should be able to do, but lack of subcategory implementation is holding it back?

btw, there’s nothing in the plugin to stop you having more than one image gallery per page, so it may be fairly easy for me to rip out the existing code and make it output the thumbs based on some external tag’s category/id output. The tricky part is how do I offer you the ability to do “whatever you want” from there? (e.g. you might want to drill down to subcats, or pass control to another plugin, or show another page, or whatever). If I can crack that from a technical coding perspective (probably through trying to fathom the image_index core code), and get some idea of what people might want to do from there, it might lead us somewhere cool…

Last edited by Bloke (2007-02-12 20:24:50)

benjibot · 2007-02-13 14:44:41

I just picked up this plugin yesterday after finally giving up on writing my own quick n’ dirty lightbox/slimbox category plugin (it’s been a while since I last coded PHP). It’s exactly what I needed, and has a few extra functions I hadn’t thought about, but might very well use. Kudos.

I’m having a slight problem though. Currently I’m in the very early stages of a redesign of a site I built a few years ago and running Textpattern locally to test as much as I can before uploading to the server. So, I’m in development mode to catch any error messages and when I run smd_slimbox I get the following at the top of the page:

<txp:smd_slimbox category="category" groupname="groupname" /> Undefined variable where on line 276.

(I’m almost positive that’s the line number, but I don’t have my PowerBook here to test it.)

The images load just fine below, and the slimboxing works as advertised. Should I just ignore it, knowing that when I switch back to live mode it’ll disappear? What’s going on in that where statement setup? I took a peek at it, but as I said earlier my PHP skills have gone all soft now that I switched over the Txp instead of a hacked together homebrew system.

lee · 2007-02-13 16:13:46

Stef, any chance of ordering images by id, something like <txp:smd_slimbox image_order_id=“24,26,19,21,25,18,27,28,29,30,20,17,23” />, so that the images are displayed in the order shown.

Or maybe make imageid respect the order of the ids as put into the plugin attribute.

Cheers
Lee

Last edited by lee (2007-02-13 16:17:42)

Bloke · 2007-02-13 22:19:38

benjibot wrote:

Undefined variable where on line 276.

D’oh, a misplaced . was causing that. As you say, it was only a warning and caused no functional difference, but it’s nice to have a plugin give no errors even in debug! Thanks for the catch.

lee wrote:

any chance of ordering images by id…

Yes, there is now. It’s stupidly hard (read: awkward) to do. After going to great lengths to keep the order you specify as far as possible in the code, it was always destroyed by the database call itself. According to the docs, by default MySQL will “always display [retrieved data] in the order in which it was stored in the table.” Bah!

But since I know the order you specified stuff in, and keep it that way in the code, I just added an option that trawls through the output from the database and reindexes it in the order you specified! It’s not particularly efficient so with long lists of images you might find performance suffers, but it works. If anybody has any better algorithms, please share…

If you want to run it in this mode, specify orderby="fixed" and a list of images using imageid. It makes no sense (as far as I can see!) to fix the order of stuff specified by category, so this option only works if you add imageid to the mix.

Couple of things to be aware of: if you supply orderby="fixed" as an option with other categories and other orderby clauses, any imageid list you supply will automatically be shown first before everything else. Had to make a decision on this one and figured if you’re going to great lengths to fix the list of images it must be for a reason, so your list wins the supremacy battle. Also note that ‘fixed’ ignores :asc or :desc modifiers :-)

Give v0.21 a whirl and see how you get on.

joel · 2007-02-13 22:21:27

I’ve discovered a strange issue on IE6 and 7 recently. The dark png-overlay doesn’t fill the screen when loading the full image. Everything else seems fine though.

Any ideas?

lee · 2007-02-13 22:25:26

Fantastic!!! Tested and working – many thanks.

lee · 2007-02-13 22:28:49

joel wrote:

I’ve discovered a strange issue on IE6 and 7 recently. The dark png-overlay doesn’t fill the screen when loading the full image. Everything else seems fine though.

Any ideas?

Works in IE6 for me.

joel · 2007-02-13 22:32:52

I run windows on paralells on a mac. It shouldn´t make any difference though.

Textpattern CMS

Textpattern CMS support forum

#25 2007-02-06 12:12:53

Re: smd_slimbox

#26 2007-02-06 23:13:02

Re: smd_slimbox

#27 2007-02-11 19:17:44

Re: smd_slimbox

#28 2007-02-12 09:57:28

Re: smd_slimbox

#29 2007-02-12 20:22:10

Re: smd_slimbox

#30 2007-02-13 14:44:41

Re: smd_slimbox

#31 2007-02-13 16:13:46

Re: smd_slimbox

#32 2007-02-13 22:19:38

Re: smd_slimbox

#33 2007-02-13 22:21:27

Re: smd_slimbox

#34 2007-02-13 22:25:26

Re: smd_slimbox

#35 2007-02-13 22:28:49

Re: smd_slimbox

#36 2007-02-13 22:32:52

Re: smd_slimbox

Board footer