Image upload + resizing + watermarking + form to database

[eluser]Bramme[/eluser]
Okay, I'm a bit stuck on how to approach the following:

I'm working on a backend for a painter, which has, offcourse, a portfolio section. Now to add a piece to the portfolio, the painter has to fill out a form: select the category (drawings, portraits etc), select a file from his hard drive and then enter some optional data like a title, size of the work, if it's in a private collection etc...
When the form is submitted the image has to be resized if it's too big, a thumbnail has to be cached, the resized image has to be watermarked with a png and then the other data from the form has to be added to the database.

Now, I was looking at the user guide, looking up info about all the libraries I would need, but I'm a bit confused now.

If you want to watermark image, you gotta have the CHMOD set to 777, is that possible with newly uploaded images?

Is there anyone who could roughly sketch out how I should tackle this ?

[eluser]Jesse2303[/eluser]
I know you can use chmod('file.txt', 0777); to directly chmod the file from a file that's already chmodded to 0777.

I hope it helps with your chmod problem

[eluser]bramb79[/eluser]
If you set up the upload directory (for the images) with 777 permissions, than all the files that are places in that directory should inherit the same permissions (777).

Does that help you? If you want a specific code example, I can look one up later.

[eluser]Bramme[/eluser]
I'm getting the hang of it, uploading/inserting in database now works like a charm, and the chmod function does it job, once my controller is chmodded to 777 (the thing bramb79 said didn't work), and I'm now working on the resizing/thumbnail creation.

There's one problem though:
How would I go about creating a square resized crop off my original image? I'll explain using an example:
image.jpg is 2048*1024 pixels. Uploaded, it gets resized to max 500 pixels width or height. So it becomes 500*250pixels. That's not a problem, but now I want to make a square thumbnail from that file that's actually a 250*250 crop from the center of the image, resized down to 100*100 (or so). I could do it in two steps I guess, deleting the unneccessary images as I go, but that seems like a little harsh. Is there a way to do this in one step?
If you have done this before, could you please post your code too?

[eluser]Bramme[/eluser]
Another thing:

Code:

$resize_config['image_library'] = 'gd2';
$resize_config['source_image'] = $full_path;
$resize_config['maintain_ratio'] = TRUE;
$resize_config['width'] = 450;
$resize_config['master_dim'] = 'width';

$this->load->library('image_lib', $resize_config);
            
$this->image_lib->resize();

This does not work as I expected it too. Even though I set maintain_ratio to TRUE, the original height of my image is kept, completely messing up the ratio...

I guess I have to calculate my own height then, no?

[eluser]bramb79[/eluser]
I am a little lost now:
Your chmod question seemed to have been about the image function working properly. If you want to watermark, resize or crop your images, the PHP program needs to be able to process them somewhere and thus needs full rights (777) to that folder. See the User Guide: "In order for the image class to be allowed to do any processing, the folder containing the image files must have file permissions of 777." CHMOD 777 on your controller should not have made any difference here (only that now your controller is writable (which is actually not advisable). Are you uploading the images into the database (storing them in the database) or onto a file system?

About your other question. You can first perform the crop on the original image (a crop is always performed on the original image) and then perform the resize on it. The resize can be either done on the original image, or a new image can be created (in this case it seems you want the original image to be resized). Technically these are still two steps but there will be no need to create unneccessary images.

[eluser]Bramme[/eluser]
Yeah sorry, I guess I was being a bit unclear. I'm storing the images in a separate folder, the image name is being stored in the database.

Code:

$ar = $width / $height;
$new_height = round(450 * $ar);

//resizing the uploaded image
$resize_config['image_library'] = 'gd2';
$resize_config['source_image'] = $full_path;
$resize_config['maintain_ratio'] = TRUE;
$resize_config['width'] = 450;
$resize_config['height'] = $new_height;

That solved my previous problem.
All that's left to do now is to create a duplicate off that image, crop it so it's square (preferably from the center) and then resize it to 100*100. I'll dive in the user guide now ^^

[eluser]bramb79[/eluser]
Hi Bram (my name too!),

it seems that you simply have to specify a height (no matter what):

Code:

$resize_config['height'] = 10;

(but not "0"). Since you set the width as leading through the "master_dim" parameter, it will keep the ratio and set the width to your specification while ignoring the "height" parameter. That worked for me at least.

(you could than delete the code you just wrote and posted). :blank:

[eluser]Bramme[/eluser]
That works like a charm! But now I've got a problem with my cropping...

Code:

//resizing the uploaded image
$resize_config['image_library'] = 'gd2';
$resize_config['source_image'] = $full_path;
$resize_config['maintain_ratio'] = TRUE;
$resize_config['width'] = 450;
$resize_config['height'] = 10;
$resize_config['master_dim'] = 'width';

$this->load->library('image_lib', $resize_config);

if (!$this->image_lib->resize()) {
    echo $this->image_lib->display_errors();
}
//everything works up until here

  
//making a thumbnail
$this->image_lib->clear();
    
//calculating offset
$img_size = getimagesize($full_path);
$width = $img_size[0];
$height = $img_size[1];

if($width > $height) {
//horizontal picture
    $diff = $width - $height;
    $x_axis = round($diff / 2);
    $y_axis = 0;
} else {
//vertical picture
    $diff = $height - $width;
    $x_axis = 0;
    $y_axis = round($diff / 2);
}
            
//actual cropping
$crop_config['image_library'] = 'gd2';
$crop_config['source_image'] = $full_path;
$crop_config['maintain_ratio'] = TRUE;
$crop_config['new_image'] = $this->config->item('thumbs_path');
$crop_config['x_axis'] = $x_axis;
$crop_config['y_axis'] = $y_axis;
    
$this->image_lib->initialize($crop_config);
if (!$this->image_lib->crop()) {
    echo $this->image_lib->display_errors();
}

The thumbs_path is set in my config file as follows $config['thumbs_path'] = "./images/portfolio/thumbs/"; but there's no image popping up my thumbs folder... There's no errors popping up either, so I'm not quite sure what's going wrong...

Anyone wanna hazard a guess?

[eluser]Bramme[/eluser]
I found the error: the library checks if the set width or height is equal to the original width and height. If so, it doesn't crop. Seeing as that was my case, I simply had to reduce my width and height 1 pixel.