CodeIgniter Forums
Added to Wiki: image resizing and squaring library - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forum-20.html)
+--- Forum: Archived Libraries & Helpers (https://forum.codeigniter.com/forum-22.html)
+--- Thread: Added to Wiki: image resizing and squaring library (/thread-25284.html)

Pages: 1 2


Added to Wiki: image resizing and squaring library - El Forum - 12-07-2009

[eluser]JoostV[/eluser]
Image resizing and cropping can take up a lot of repetitive code. I added an image library to the Wiki that I use to create thumbs and resized versions of images (square or not).

EDIT: This library has been moved to Github
https://github.com/accent-interactive/ci-lib-images


By default, images are squared from the center, but this can be offset, too.

Example usage:
Code:
function image ()
{
    $original = 'test_image.jpg';
    $new = 'test_image_altered.jpg';
    $originalPath = '/full/path/to/original/image/folder/';
    $newPath = '/full/path/to/altered/image/folder/';
    $maxSize = 150;
    $this->load->library('images');
    
    // Create square and resized image example
    $this->images->squareThumb($originalPath . $original, $newPath . $new, $maxSize);
    
    // Create resized image example
    $this->images->resize($originalPath . $original, $maxSize, $maxSize, $newPath . $new);
    
    // Create square image image
    $this->images->square($originalPath . $original, $newPath . $new);
}



Added to Wiki: image resizing and squaring library - El Forum - 02-03-2010

[eluser]JoostV[/eluser]
Deadly pointed out the lib threw an error. I had left some old code in there by accident. It has been fixed.

Thanks, Deadly!


Added to Wiki: image resizing and squaring library - El Forum - 02-04-2010

[eluser]gh0st[/eluser]
By square thumbnails and square images; do you mean a similar functionality that Facebook does to its images?


Added to Wiki: image resizing and squaring library - El Forum - 02-04-2010

[eluser]JoostV[/eluser]
I don't know how Facebook handles images.

But squaring here creates a square image, measured from the center of the picture. So, if an image is 200px wide and 100px high, squaring will chip 50 pixels off the left an 50 pixels off the right. Works for portrait images, too, of course Smile

Square thumbnails squares the image first, and then resizes it to the size you specify. Say you wish to save three sizes, a thumbnail and a square thumbnail; easy as:

Code:
// Example of resizing and squaring five images in one go, using 'images' library
$sourceimagepath = '/path/to/image/folder/';
$sourceimagename = 'test.png';
$sourcefile = $sourceimagepath . $sourceimagename;
$destinationpath = '/path/to/destination/folder/';

// Store all sizes you wish to create in an array
$image_sizes[] = array('maxwidth' => 800, 'maxheight' => 800, 'subfolder' => '800', 'square' => false);
$image_sizes[] = array('maxwidth' => 450, 'maxheight' => 450, 'subfolder' => '450', 'square' => false);
$image_sizes[] = array('maxwidth' => 300, 'maxheight' => 300, 'subfolder' => '300', 'square' => false);
$image_sizes[] = array('maxwidth' => 100, 'maxheight' => 100, 'subfolder' => 'thumbs', 'square' => false);
$image_sizes[] = array('maxwidth' => 100, 'maxheight' => 100, 'subfolder' => 'thumbs_square', 'square' => true);
$this->load->library('images');

// Resize the original image and store it
foreach ($image_sizes as $image_size) {
    
    $destinationfile = $destinationpath . $image_size['subfolder'] . '/' . $sourceimagename;
    
    if ($image_size['square'] == false) {
        $this->images->resize($sourcefile, $image_size['maxwidth'], $image_size['maxheight'], $destinationfile);
    }
    else {
        $this->images->squareThumb($sourcefile, $destinationfile, $image_size['maxwidth']);
    }
}

// You may wish to delete the original file
if (file_exists($sourcefile) && is_file($sourcefile)) {
    unlink($sourcefile);
}



Added to Wiki: image resizing and squaring library - El Forum - 06-07-2010

[eluser]packetfox[/eluser]
Hello there,

this seems to be almost exactly what i am looking for for a project i am working on; but i simply cannot figure out how to create squared thumbnails at 160x160px, not matter the size or dimensions of the source file. Is there a way i can facilitate this with your Library?

Best regards,
D


Added to Wiki: image resizing and squaring library - El Forum - 06-07-2010

[eluser]JoostV[/eluser]
Code:
$sourceimagepath = '/path/to/image/folder/';
$sourceimagename = 'test.png';
$sourcefile = $sourceimagepath . $sourceimagename;
$destinationpath = '/path/to/destination/folder/';
$this->load->library('images');

// Resize the original image and store it
$destinationfile = $destinationpath . '/sq_' . $sourceimagename;
$this->images->squareThumb($sourcefile, $destinationfile, 160);



Added to Wiki: image resizing and squaring library - El Forum - 06-07-2010

[eluser]packetfox[/eluser]
Hi there,

this is what i have:

Code:
$this->images->squareThumb($config['source_image'],$config['target_image'], 160);

The Image Library is autoloaded.

When i upload images with different dimensions i get different results:
Source - Result
600x850 - 85x120
788x1812 - 53x120
468x304 - 160x104

What id really like is all Images get a square Thumbnail of 160x160, disregarding their original Dimensions.

Best regards,
D


Added to Wiki: image resizing and squaring library - El Forum - 06-08-2010

[eluser]JoostV[/eluser]
Can you post your complete controller code?


Added to Wiki: image resizing and squaring library - El Forum - 06-08-2010

[eluser]packetfox[/eluser]
Hello there,

i went trough the whole thing before posting it to clean it out a little, and now it appears to work. :-S

Thanks for helping out!

Best regards,
D


Added to Wiki: image resizing and squaring library - El Forum - 06-08-2010

[eluser]JoostV[/eluser]
You're welcome Smile