Randomland's Drupal Module

[zourtney]

I changed the Francine pages which I have updated to use the [rlimg] syntax to display pictures. It's not the most awesomest of solutions to embedding images in posts, but it's workable. Maybe I'll go back and edit a few posts at some point. I need to upload more Francine pictures, too.

[zourtney]

Check out this site's image block (nevermind the content, I was trying to remember the program name 'msconfig').
http://www.sevenforums.com/tutorials/1401-startup-programs-change.html

I still think our block is better because we don't embed text in the image. If we changed our "view details" link to be a caption instead, it would be easier for the spiders to associate the text with the image. But anyway, I like their next/prev option in the popup. Perhaps that's one of those thin/thickbox slideshows that I never messed with. Anyway, just another idea.

[Nick]

Yeah, that is some version of the lightbox/thinkbox thing I think. Ours does all that too, it just looks different. You are limited to the images on the current page for sideshowing. But I am sure there is a way around that.

[zourtney]

Viewing the images on the current page as a slideshow would be cool for most pages...like camping stories, bike tree howtos, etc.

[Nick]

Its automatic in the lightbox. If you move your mouse to the right or left of the image pop-up you will get next/previous arrows.

[zourtney]

This Randomland Drupal module is still plugged in and working, but I found a major bug. The nice floating imagebox (seen here, for example) does not display properly in browsers other than Firefox...though I thought sure I tested it!

It seems that:
a) if a float style is applied, it is ignored
b) if not floated, the black background goes to 100% width

...Actually, I just tested on IE at home and it seems that only the center style is being cranky. I had different results with both IE and Chrome at work. Anyway, apparently I have stuff to fix with the [rlimg] module. Yay?

[zourtney]

So, I was wanting to update the style on this little rlimg image block we have everywhere. I started to, but somewhere in Drupal, my CSS is getting eaten and the style is getting messed up. You can see it on the front page; just look at the kitty pictures. The border is supposed to be uniform, MUCH smaller, and the exterior border will look rounded (in Mozillas) once I get the padding issues figured out.

[zourtney]

Well, I mostly fixed up my rlimg module's styling. The problem was either in my understanding of CSS subclassing, or Drupal's implementation of it (I think Drupal is smashing all stylesheets into one at run time). But, no one really cares.

There are only two remaining problems...or wait, three...or foura few problems:

• Each rlimg block has an overly large bottom margin (see Tentin' on the Ten-Ten for a good example)
• Each rlimg block says "Caption text goes here" instead of actually having a caption. I'm thinking I'll pull this from the node's "teaser" field, if possible.
• And I forgot to actually test whether or not the double-quote escaping is working
• no one has told me if it is too ugly to use or not
• Lightbox (thickbox?) in-page navigation is not working...you know, it's supposed to have those left and right arrows so you can go to other images on the page.
  

[Nick]

Drupal is aggregating them all into one css file, otherwise IE refuses to get all of our style files. It has a limit of 10 or 20 css files or something dumb. Without the css smasher I think the site uses 25 or 30 files.

[zourtney]

which seems like an absurd amount of css, but yeah. Sometimes I want to rewrite the current theme from scratch. But most of the css is probably coming from modules anyway.

So, I'm thinking of making an rlimggrid type thing to extend this module. I had been setting up grids of images with code like this:

Code Select Expand

[rlimg xxx][rlimg xxx][rlimg xxx][rlimg xxx][rlimg xxx][rlimg xxx]

The problem with this is that Safari and IE were extending the each image's div to the width of the parent. Firefox, on the other hand, just lined them all up horizontally. Anyway, I tried this:

Code Select Expand

<div style="overflow: hidden">
    <div style="float: left">[rlimg xxx]</div>
    <div style="float: left">[rlimg xxx]</div>
    <div style="float: left">[rlimg xxx]</div>
    <div style="float: left">[rlimg xxx]</div>
</div>

This appears to give the proper grid-like setup in all browsers I've tried. As a niceness, it'll fit as many on a row as it can. This, therefore, plays nicely into our "fluid" layout.

Making an rlimggrid would allow you to style the background of the containing div and customize the look further. As is (see Tentin'), there's a bunch of padding between the blocks -- I'd prefer a black background with less padding.

[Nick]

Nice. We could use that in the gallery and make it more fluid and conform more with the rest of the site's look.

[zourtney]

That could be nice.

I was thinking, if I wanted to go crazy, we could make a slightly different version that would auto-paginate. Just give it a maxRows x maxCols size, or something? But that's a ways off still...I got to fix that dang caption first and foremost.

[zourtney]

By the way, the parameter you can pass to the rlimg module is the imagecache preset. This will tell it which version (size) of the image to display. The available imagecache presets can be seen here, for admin users. By default, it uses preset 'Thumbnail'.

For example, if you wanted to display the 1024x version, you would call it like this:
[rlimg xxx | 1024px_wide]

[zourtney]

The module now displays "teaser" text as the caption.

Drupal's a poople and is caching that stuff, so if you edit a description and it doesn't seem to be updating, go to Admin>Performance and click "clear caches."

One final note: when you save a node with no teaser text, it tries to auto-generate it from the node's body text. If you wish it to be blank, throw a blank <p></p> in there (or similar). All HTML is parsed out at runtime. It's a hack, but it'll work until I make an admin page.

[Nick]

Thats cooler then a barrel of cucumbers in mid October! Now I just need to write some articles so I can put it to use.