I checked out the 6--1 branch, installed it on my D6-10 + CCK + filefield + imagefield on which I have a node type with 1 (multiple-) imagefield. The galleria style plugin comes up in the styles and when selecting it, the view is spitting out the right tpl code for this multiple imagefield.

So far so good but now I'm stuck with an issue. The main image with the pager is alright and uses the imagecache preset I selected in views, but the unordered list with the multiple images is not ok. The imagecache preset is not respected here and actually, I would like to use another preset for which I have not found any setting where I can set this.

Find attached a screenshot where you will see the unordered list with the way to big images and the main image below.


juroon’s picture

Exactly what I was trying to describe in #439286 among all my other questions, except you did a much better job explaining what's going on.

toemaz’s picture

Ok, so let's try to help out each other. I just started to look into it again. I'll give it 2 hours max. Fingers crossed.

juroon’s picture

I'm curious to know how it went for you, toemaz. I won't have a chance to work on it until tomorrow or the next day, but will definitely give it another go. I'm wondering what can be done with css, and I'll probably try taking the css from the demo and see what that does. I do believe it's taking the correct imagecache thumb image, because the resolution changes when I chose a different preset.


maulwuff’s picture

i am stuck at the same situation.
as a first step, remove all "#container #midden_wrapper #inhoud" from the galleria.css,
this will make things more handy to work further on it ;)

maulwuff’s picture

Title:Getting it to work with imagecache» fix css styling
maulwuff’s picture

even better result with the following css, taken from the galleria homepage and added some styling for overall width and the nav-links

.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px} /* MSIE bug */


juroon’s picture

Thanks maulwuff, that certainly cleaned things up a lot. However the same problems remain.

I'm wondering if you can tell us if we can expect this module to work with imagecache? Imagecache was included in the original title of this issue. Did you change it because imagecache isn't happening? It's nice how your css defined the thumbs, but imagecache is pretty important, at least to me, and I assume the original poster. As it stands now, it's not clear if there's any way to set one imagecache preset to handle the thumbs and another to handle the display image.

Currently, if you set an imagecache option in the view under Fields and Content: Content type, it is reflected in both the thumbs and the display image. Nor have I found any choice to set in views that will allow the setting for the content type field display to take over either.

Are we looking at the wrong module if we need imagecache?

Also, I'm wondering exactly what the difference will be between this module and Views Slideshow. Will it mainly be the transparency on the thumbnails, or are there some other clear differences?

Thanks for the help!

maulwuff’s picture

first of all, I am not the maintainer of this module ;)

but to answer your question: imageCache is used, as you choose the preset to show in the galleria.

galleria is able to work with one list of images and creates the thumbs by scaling down these images for the thumbs.

I know there is a setting at the (pure) galleria module, to provide 2 lists of images, but I don't think this is supported in views galleria right now. Why is this important? Better page loading time?

views galleria uses galleria to build a gallery with thumbs,
views slideshow uses "any-thing" and blends the whole "any-thing". I have not looked at it any closer

but all these questions are OT on this issue.

juroon’s picture

Thanks, maulwuff. I thought since you changed the name on this issue, maybe you were somehow associated more with the project. In any case you apparently have your head into it way more than I do.

Maybe we should open another issue for the imagecache question, since this one has changed. I don't know how these things work. Clearly your very useful response has more to do with CSS and people ought to be able to find that, but the original question about imagecache still remains.

Anyway... since we're here now, I'll answer your question about why it's important to have two different imagecache presets. For one thing you might want a different frame on your thumbs than you have on your display image, or you might want a watermark or brand on the display image. For another, I'm finding people like to have control over how their thumbs are cropped. Imagecache allows you to do a blanket crop for all your thumbs, but if it that shows up with only a chunk of sky or something for a few images, you can change the ones you need to change.

I'm not sure exactly how it affects page loading though, and I wonder about that. If Galleria has to crop the images every time, then that probably would be another reason to prefer two different presets. Image quality on the thumbs might be another consideration. If you're compressing thumbs off an already compressed imagecache image, it's going to be a lossy process.

These things probably don't matter for a lot of people, but for photographers and artists it's a big deal. And, since Galleria is so pretty, it's going to attract that type of user.

toemaz’s picture

Status:Active» Needs review
new2.15 KB

#6 worked perfectly for me. Thanks maulwuff
I'll put this issue on 'needs review' because the patch needs testing.

toemaz’s picture

new246.21 KB

After applying the patch in #10 and some specific css theme tweaking, this is what I get. Not bad!
However, I do have one issue left which I hope someone can reproduce:

On Win/IE8, the main image does not display after the page load. Only after clicking on one of the thumbs, the main image pops up up. When checking the source before clicking one of the thumbs, the expected html is missing:

<div class="galleria_container"><div class="galleria_wrapper"><img src="http://mydomain.com/sites/mydomain.com/files/imagecache/field_thumb/_DSC4707%2000.jpg" class="replaced" title="Next image >>" style="cursor: pointer;"/></div><span class="caption" style=""/></div>

So only after clicking one of the thumbs, javascript is actually outputtting the galleria_container code.

aries’s picture

Version:» 6.x-1.x-dev
Assigned:Unassigned» aries

Hi guys, thanks for your reviews, i'd like to let you know i'm on solving this bug :)

toemaz’s picture

Thanks for the update aries. I'm looking forward to test your improvements.

toemaz’s picture

Status:Needs review» Reviewed & tested by the community

As posted in issue http://drupal.org/node/465240#comment-1648712 , the patch attached at #10 seems to be ok.

toemaz’s picture

I have this view up and running on a production site but I do have an issue with IE: the main image is not shown when the document is loaded. Only once you clicked on the thumbnail. Anybody the same problem?

aries’s picture

I'll check it this weekend, thank you for your patience.

Boobaa’s picture

I couldn't apply the patch, so rerolled it myself - included a small i18n fix in galleria_options.js.

jweedman’s picture

What if I want the main image ABOVE the thumbnails? Is this possible? I'm a php hack, but I know just enough to be dangerous. So if it entails manipulating the module itself, please be descriptive. Any help would be GREATLY appreciated.

/******* Update ********/
Fixed it! It's not the best, because I'm hacking the original code, which means module updates will stink... but.....

To clarify, I've created a view that outputs a page. On this page, the main image was being put below the ul of the thumbnail images. To me, it seems logical that the main image would go above. The weird thing is that the view outputs a div with an id of 'main_image', but doesn't print anything out to it. On the other hand, jquery.galleria.js (in the module directory) appends a couple of divs and spans where the main image was being spit out, UNDER the ul. It threw me because there's no evidence of a div after the ul in the '.tpl.php' file views_galleria is using (again, in the module directory).

SO... if you study jquery.galleria.js some more, there is a function that supplies options to your gallery. In the commented section at the top of the js file you'll find "@options
insert: (selector string) by default, Galleria will create a container div before your ul that holds the image. You can, however, specify a selector where the image will be placed instead (f.ex '#main_img')".

Long story short - underneath the function($options), you see the following:

// set default options
var $defaults = {
insert      : '.galleria_container',
history     : true,
clickNext   : true,
onImage     : function(image,caption,thumb) {},
onThumb     : function(thumb) {}

This tipped me off, because the div being appended AFTER the ul had a class of 'galleria_container'. So I changed that to:

         var $defaults = {
insert      : '#main_image',
history     : true,
clickNext   : true,
onImage     : function(image,caption,thumb) {},
onThumb     : function(thumb) {}

And viola. Seems to be working well. Let me know if there's a way to override this js file in the local directory of my drupal install, so that I'm not having to change this in every updated module version. Thanks!


c0psrul3’s picture

wonderful... thanks x 10

aquila’s picture

works perfectly, and this is a patch to a real showstopper for this module!