module request: Page List "image" option

[Marty Walker]

Hi all,

Following on from this thread: http://processwire.c...st-image-label/

I'd like to sponsor a module that gives me (and any PW user too) the option to display image thumbnails in the page list. I know you can specify which fields to display in the page list in Templates > Advanced.

Because I do a bit of work for artists this would be great option for me (and probably others) to have. I'd like it to work with Antti's Thumbnails module too.

Please get in touch if you're interested: martin@smd.net.au

Regards

Marty

[Soma]

I think , since I'm the orginator of this, I'll give it a try to make something with a module.

[ryan]

Count me in to help if needed. I think this may be one that belongs in the core, though have avoided it thus far since it gets the core involved in specific fieldtype output. But this may be an okay compromise to make if done directly in ProcessPageList. Other than that, I think that a module is definitely a good way to do it too.

[Soma]

Here it is a first test version.

Got it working with regular image fields, or thumbnail cropimages fields.

You can specify any image field using the image field name in the advanced template setting for page label. To output an thumbnail (from the Thumbnail module) just use the dot notation. fieldname.thumbnailname (as specified in the thumbnail field settings)

There's some option on this module for controlling the size of image and the container size, padding, colors.

https://github.com/s...eListImageLabel

Edit: Added support for multiple image fields. It will always take the first image.

[Marty Walker]

Philipp for a 'first test version' this is awesome!

Regards

Marty

[Marty Walker]

Hi Philipp,

I've only noticed two tiny things that I can't work out. I set a border colour which I can't get to show up around the thumbnail. And is there any way I can remove the comma that appears after the thumbnail?

This is such a great module.

Regards

Marty

[Soma]

Hey smd, glad it works well for you.

I just pushed an update. Fixed border and removed comma after thumbnail.

[ryan]

Great module Soma! I really like having this functionality, and you've done a nice job putting it together. It's easy to see how useful this is seeing it in action--I will be using this for sure.

A few comments:

1. On the module edit screen, I get a bunch of notices about undefined variables. Probably because I'm in debug mode, but wanted to mention it still.

2. I see the defaults in the .module file, but they weren't populated in my config screen, so I was confused about whether the fields needed to be populated or not. If they don't, maybe adding a $field->collapsed = Inputfield::collapsedBlank; to the optional fields would clarify they are optional. You might also add a $field->notes = "If left blank, a default will be provided"; or something like that.

3. When displaying a page that has no image, it shows a broken image. I think it'd be better if it showed a placeholder (WillyC's face?) or just the box with no image in it.

[Soma]

Thanks Ryan!

About the defaults. How can I get the defaults in the getModuleConfigInputfields function? I wasn't able to access them from there. How is the simplest way to handle it?

[ryan]

Add this to the top of your getModuleConfigInputfields() function. This should also solve the undefined variable notices:

$data = array_merge(self::$defaults, $data); 

[Soma]

Add this to the top of your getModuleConfigInputfields() function. This should also solve the undefined variable notices:

$data = array_merge(self::$defaults, $data); 

Ahh cool. That works only if the var $defaults is static. Well I don't understand enough why, but It works! Thanks Ryan.

Is it correct that I can't merge the defaults to a local ($this->key) in the init() and have it available in the hook "addImageLabel" function? Is that because it is a hook. I had to put the merging (foreach loop) in the function to get it work.

[Soma]

3. When displaying a page that has no image, it shows a broken image. I think it'd be better if it showed a placeholder (WillyC's face?) or just the box with no image in it.

Hmm, I can't see any broken image when there's none on the field. It doesn't output anything if there's no image when I test. Although looking at my own code I can't see why, cause it should. So it seems the only reason is because ($v instanceof Pageimage) does fail if there's no image.

Edit: Even bigger HMM, ok now I see it. It only happens with "multiple" images fields.

Edit2: Ok I fixed all, and have added new option to specify an No-Image Text and text color. Also the module options are populated with the defaults at first run. May need deinstall and reinstall to have a default install.

Just commited an update:

https://github.com/somatonic/PageListImageLabel

[Soma]

Sorry for the triple post.

Again. I'm testing with if there's not image populated. It doesn't work same with single image fields.

I'm doing a check

if(($v instanceof Pageimage) || ($v instanceof Pageimages)){
...

If it's a multi mage field (Pageimages) it returns true and the magic happens even if the field is empty.

If it's a single image field (Pageimage) it doesn't return true if the field is empty.

So it doesn't return the "no-image" text as I wanted.

Have you any idea why?

[ryan]

Is it correct that I can't merge the defaults to a local ($this->key) in the init() and have it available in the hook "addImageLabel" function? Is that because it is a hook. I had to put the merging (foreach loop) in the function to get it work.

PW populates your config variables to the module in the time between __construct() and init(). So when init() is called, your config variables have already been populated to the module. As a result, the __construct() is a good place to populate defaults. In your case, you could do this in your __construct():

foreach(self::$defaults as $key => $value) $this->set($key, $value); 

If it's a multi mage field (Pageimages) it returns true and the magic happens even if the field is empty.

If it's a single image field (Pageimage) it doesn't return true if the field is empty.

I don't think that a Pageimage (singular) is applicable here since all image fields are multi-image fields behind the scenes. The existence of a single image field is just a type of output formatting used on the front end of your site. I believe output formatting is turned off in the case of your module, so you should be able to assume that all image fields are multi image fields (Pageimages). As a result, I would perform the check like this:

if($v instanceof Pageimages && count($v)) {
   // ...
}

[Marty Walker]

Hi Philipp,

Just wondering: is there's a way (apart from setting a image width in the module's css) to affect the scale of the FieldtypeCropImage thumbnail?

Regards

Marty

[Soma]

I don't think that a Pageimage (singular) is applicable here since all image fields are multi-image fields behind the scenes. The existence of a single image field is just a type of output formatting used on the front end of your site. I believe output formatting is turned off in the case of your module, so you should be able to assume that all image fields are multi image fields (Pageimages). As a result, I would perform the check like this:

if($v instanceof Pageimages && count($v)) {
// ...
}

Outputformatting is turned on! I had to turn it off to get it to work with testing only for "Pageimages". With the OF turned on, it is not possible with single image field. If the image field isn't populated, it will never be true wether with Pageimages nor with Pageimage.

So it's all a bit wierd. So I have OF turned off.

But strange thing is, then I have to test again inside the if($v instanceof Pageimages){..} routine for if(count($v) && $v instanceof Pageimages){..} to test for if it's a multi or a single, to then call it with first() or without if it's single. Like this:

if(count($v) && $v instanceof Pageimages){
$thumb_url = $page->$field->first()->size($size[0],$size[1])->url;
} else if(count($v)) $thumb_url = $page->$field->size($size[0],$size[1])->url;

Don't really understand why.

[Soma]

Hi Philipp,

Just wondering: is there's a way (apart from setting a image width in the module's css) to affect the scale of the FieldtypeCropImage thumbnail?

Regards

Marty

I knew you would ask this question. No it's not possible cause the crop images aren't regular PW images. At least not without changing the Thumbnail module or write my own functions to resize the croped image. Have to further investigate and ask apeisa or ryan if there would be an easy way. For now it would only be possible over the css.

[Marty Walker]

That's cool. Not a big deal at all.

Thanks!

[Soma]

Good news for your Marty. I got the resizing working for crop images! I did some magic resizing using PW ImageSizer class. It now generates a extra thumbnail of the thumbnail using the size you specify in the module settings. They get named "widthxheight_thumbnail_imagename.jpg".

I just commited an update. Let me now if any issue arises.

[diogo]

This is great Soma!! works wonderfully here

[Soma]

Thanks diogo.

I just recognized that I forgot to remove a testing code in the resize function for crop images. I got it fixed and commited.

Only drawback is that for the resize of the crop images it does it every time you load the tree, so there could be, depending on the size of the thumbnails, quite some overhead in generating those. Since I can't use size() function of PW it doesn't check if the resized file already exists. I could do a check too, but it would not work when updating the croped image, as it would be named the same and thus not update in the tree view.

[ryan]

Don't really understand why.

Soma, if I'm reading it right, the else condition could never occur. We already know that $v is an instance of Pageimages, because the earlier if() statement confirmed that. So the only test here is count($v). If the first one fails, the second one (in the 'else') has to as well.

if(count($v) && $v instanceof Pageimages){
   $thumb_url = $page->$field->first()->size($size[0],$size[1])->url;
} else if(count($v)) $thumb_url = $page->$field->size($size[0],$size[1])->url;

As a result, the above could be reduced to this:

if(count($v)){
   $thumb_url = $page->$field->first()->size($size[0],$size[1])->url;
}

If you want to test that the second 'else' could never be called, try using your original code segment, but doubling the size of the thumb_url in the 'else' condition. That way you have a landmark (a larger image):

if(count($v) && $v instanceof Pageimages){
   $thumb_url = $page->$field->first()->size($size[0],$size[1])->url;
} else if(count($v)) $thumb_url = $page->$field->size($size[0]*2,$size[1]*2)->url;

[Soma]

Ok now.... I almost was going to jump! Grrrr

I thought that something is weird all the time. The problem was that I used a image field that was skrewed, because at some point I changed the inputfield use "crop image", but the fieldtype was still "image" and not "cropimage". That made all the testing,coding a little difficult, unexpected behavior etc. Oh dear.

Edit:

I just tested again and removed unessesary code. Will just commit the update to github.