Extend pageImage

[Gi∂vanni]

Hi, my name is Giovanni and i've been lurking this site for some time. I'm currently building a site base on PW with 100+ pages and when done i'll be happy to share some of my ideas, to se what's good and what could have been done better

I'm here to ask, what would be the best way to add a function to the PageImage class?

I'd like to be able to do something like $image->size(100, 100)->greyscale();

Any suggestion?

Thank you in advance!

[Wanze]

Hi Giovanni and welcome!

This is a very interesting first question

You can write an autoload module which adds the greyscale method with a Hook to the PageImage class.

Check out the /site/modules/Helloworld.module for examples.

I have never used these hooks which extend a class with methods, but it would be something like this:

Edit: I don't know if you can access variables from the Pageimage class inside the makeGreyscale method. So sample code below

could be completely wrong. Ryan, Soma, Apeisa, Nik, Teppo etc. where are you?

//In your module...

public function init() {
  $this->addHook('Pageimage::greyscale', $this, 'makeGreyscale'); 
}

//This is only sample code...
public function makeGreyscale(HookEvent $event) {
  
  $img = $event->object;
  
  //Make a new image file that is greyscale. Otherwise you could apply your image filter directly to $img
  $basename = basename($img->basename(), '.' . $img->ext());
  $basename .= '-greyscale.' . $img->ext();
  $filename = $img->pagefiles->path() . $basename;
  $greyscale = clone $img;
  $greyscale->setFilename($filename);
  //Make it greyscale
  //...
  $event->return = $greyscale;
}

[Soma]

Wanze why, you're already here

This is correct. Just the hook function would be like this.

    public function greyscale(HookEvent $event){
        $img = $event->object;
        $arg1 = $event->arguments[0];
        // do things with image

        // return image object for chaining
        $event->return = $event->object;
    }
 

Which would allow you to do things like:

echo $im->size(10,0)->greyscale('arg1','arg2')->url;

[Wanze]

Ah very nice some thanks Soma, know I know what $event->object is

I know that Hooks are awesome but have not really figured out how everything works behind the scenes.

ProcessWire is the best real life example in terms of Software Design

Updated my first post.

But what if I actually want a new image generated and not modify the existing Pageimage object?

I could clone the $img and then return the "new" Imagesize object, like in my post above.

But this would need some checking if a greyscale image already exists and in this case don't filter again.

[Soma]

Yeah, you'd have to do the whole procedure like the Pageimage size() does.

Depending on what you want to manipulate, maybe you don't need additional image generated...

Anyway, If it's about greyscale a image, I would do it like this in CSS: http://jsfiddle.net/KDtAX/487/ , but maybe not a solution in all scenarios, Opera and Safari5 doesn't seem to work.

Edit: Also if you want to have it like $image->size(100, 100)->greyscale(); you already resize and get a new image with size() so why generate one again?

[Wanze]

Or if it needs to be created server-side, a standalone module that takes the Pageimage object as argument and simply returns the url to the greyscale image:

$greyscale = $modules->get('Greyscale');
$greyscaleImage = $greyscale->execute($image); //$image would be the Pageimage object
echo "<img src='{$greyscaleImage}' alt=''>

[Gi∂vanni]

So, addHook automagically add the method to the pageImage object.

I thought hooks where a defined set (like render, save and so on...).

I was blown away by the power of PW as CMF, but i'm on the way to get blown away by the power of module development!

I considered client side generation of the image, with css or a js/canvas solution, but integrating the functionality in PW just has that The Right Way™ feeling.

Also, i need to show 70+ images per page and this could be too much for the client side.

Thank you so much, this is often regarded as a vibrant and helping community, now i can confirm that!

[Soma]

Yes addHook is to add a new method to whatever you like. addHookProperty is to add a property to the object.

addHookAfter/Before is hooking into events like save etc.

You could also go with something like

$page->image->greyscale(100,100)->url;

and just leave out the size() and do it in greyscale. Endless possibilities.