Image input field resizing on upload

[Gabi]

Hi,

I made a slideshow from a repeater with two text fields and an image field. I set the imageSizerOptions['cropping'] = true in config.php, but the images were not cropped on upload. So my uploaded images ended with aspect ratios of the originals.

I dug in the code to find that in /wire/modules/Inputfield/InputfieldImage/InputfieldImage.module, ___fileAdded function, the image gets resized in two passes, first the width, then the height. It seemed to me that this is like telling PW to ignore the 'cropping' option. So I replaced lines 41-53 from InputfieldImage.module

        if($this->maxWidth && $pagefile->width > $this->maxWidth) {
            $pagefile2 = $pagefile->width($this->maxWidth);
            unlink($pagefile->filename);
            rename($pagefile2->filename, $pagefile->filename);
            $pagefile->getImageInfo(true); // force it to reload it's dimensions
        }

        if($this->maxHeight && $pagefile->height > $this->maxHeight) {
            $pagefile2 = $pagefile->height($this->maxHeight);
            unlink($pagefile->filename);
            rename($pagefile2->filename, $pagefile->filename);
            $pagefile->getImageInfo(true);
        }

with

        if (($this->maxWidth && $pagefile->width > $this->maxWidth) || ($this->maxHeight && $pagefile->height > $this->maxHeight)) {
          $target_width = $this->maxWidth ? $this->maxWidth : 0;
          $target_height = $this->maxHeight ? $this->maxHeight : 0;
            $pagefile2 = $pagefile->size($this->maxWidth, $this->maxHeight);
            unlink($pagefile->filename);
            rename($pagefile2->filename, $pagefile->filename);
            $pagefile->getImageInfo(true); // force it to reload it's dimensions
        }

I don't know if my logic is right, but it seems to work for me.

What do you think?

[Soma]

Cropping option is meant for when using size(100, 100) on images on front end. You changed the max width and max height resizing which isnt meant to crop but limit image sizes the user uploads. So it's all fine as it is.

[Gabi]

Thanks for your answer.

So, new questions:

1. Why is better to have the 'cropping' setting ignored at upload time? Or what are the problems avoided by ignoring the 'cropping' setting? I thought that if I put this setting in config.php it will be regarded as a general preference, in the back end as well as in the front end.

2. Regardless of the cropping setting, why is better to resize the images in two passes (first, the width, and if the heigth is still greater than the limit, the heigth)? In the end they're all going to $pagefile->size().

3. For my slideshow I needed 550x261px images that would purposefully not be used elsewhere. With my modification I could upload them, they would be cropped on upload and then could be used as is. What would be the right processwirish way to set it?

Don't get me wrong, I only want to understand the way ProcessWire works and the reasoning behind some coding decisions. I love ProcessWire and the way it stands out of the way giving you tools for your work. Thing is, I'm a beginner and often find myself hesitating between all the tools given by PW.

Thanks for your time.

[Soma]

1. The upload max width and height setting is a way to avoid having the user upload 4000x10000px images. Remember it's a "max" size setting not a "thumbnail" setting. See it more as a original image that should be un-cropped. This keeps it flexible and simple to start with and if you maybe want to change the image size you still have the original image. Note that there's also several API calls in the image file to check for original and variations.

Theres modules or simple ways for creating cropped images

- as per Thumbnails module http://mods.pw/1b 

- or to requires a certain format http://processwire.com/talk/topic/3476-fixed-image-size/?p=34110 (add "min" size settings to image fields)

- or a way to resize images on upload using simple module http://processwire.com/talk/topic/3718-lots-of-images-to-resize-timeout-in-frontend/?p=36291

2. Again it's not meant as a cropping setting for uploaded images. It works this way that if you set width "1000" and height "500" the image upload will be resized either in with or height or both depending on which side is larger than 1000px or 500px. That's why it checks both separate, at least I think so.

3. Most of the times you upload images and on output in the template file you generate the image size $image->size(520,261)->url and it will only create it if it's not already found and it will also recognize your crop settings. It creates a new copy and names it with the size you specify beside the original. This is the most straight forward way to work with images and there's not much more about it. But the system still allows to build on that and extend and change behavior of the image field if you wish.

[Ivan Gretsky]

I actually need to crop image on upload (to cut out a watermark) via API in an import script. I cannot allow to store both original and cropped image due to storage limitations, so calling size after upload is not an option. Please be kind and propose a solution: where to hook what)

[LostKobrakai]

You can use the imagesizer class without the image being part of a field. I'll add a script I use for creating thumbs of form builder entry images.

	protected function getThumb($file, $formID, $entryID){
		$path = $this->forms->get($formID)->entries()->getFilesPath($entryID);
		$fileParts = explode(".", basename($file));
		$ext = end($fileParts);

		// Create thumbnail
		$basename = basename($file, "." . $ext);
		$basename .= '.0x150.' . $ext;
		$filename = $path . $basename; 
		$exists = file_exists($filename); 
		if(!$exists && @copy($file, $filename)) {
			try { 
				$sizer = new ImageSizer($filename);
				$sizer->setOptions(array(
					'upscaling' => false,
					'cropping' => false,
					'quality' => 90,
					'forceNew' => false,
				));
				if($sizer->resize(0, 150)) {
					if($this->config->chmodFile) chmod($filename, octdec($this->config->chmodFile));
				} else {
					$this->error = "ImageSizer::resize(0, 150) failed for $filename";
				}
			} catch(Exception $e) {
				$this->error = $e->getMessage(); 
			}
		}

		if(file_exists($filename)) return $this->forms->getFileURL($formID, $entryID, $filename);
		else return null;
	}