• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 435
  • Last Modified:

PHP - AJAX Photo Uploader

Good Afternoon,

I have spent some time browsing the search results looking for an answer to my question and I haven't quite found what I am looking for.

I am looking for an open-source photo-uploader with resize capability.

Here is some background information:
The website I am currently constructing allows people to register for a contest.
The website currently tracks personal information, measurements, and subsequent
updates.
Each registrant is given a random ID code that I would like the photo tied to.

I would like the photo re-size to happen locally before upload, but allow for it to be done server side if for whatever reason the browser does not support local re-sizing.


I have decent experience with PHP and classes, but I have never had a reason to upload photos and re-size them before.  So I would greatly appreciate some direction or examples I can use to create my own code or use someone else.

Thanks!
0
shdwmage
Asked:
shdwmage
1 Solution
 
sognoctCommented:
my favorite script for resizing pics is :

TimThumb – PHP Image Resizer

for the uploading php has native good libraries. w3 school provide useful tips for building a correct and secure php upload form :

w3school php upload file

just have to mix the two things and adjust according to your needs.
0
 
Ray PaseurCommented:
The upload-image part of this is one thing; the resize-image is a separate thing.  jQuery may have some image-crop tools, but the resize is probably best done on the server after the image is in your control.  Can you please show us what you've tried so far and where you've had troubles?
0
 
InsoftserviceCommented:
agree with @ray

please refere the link it contains cropping of your images .

http://trentrichardson.com/2009/10/25/uberuploadcropper-jquery-upload-and-crop-plugin/
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
shdwmageAuthor Commented:
Ray,

I have been looking at a couple of different pre-packed code sets.
The one that I really thought I could get working on the server side is not working. It kicks out multiple errors and I don't know enough about the PHP resize functionality to see what it is.

Ajax Multiple Image Upload-Resize with jQuery and PHP

I have a jQuery one that I've been looking at as well, but sadly my knowledge of jQuery is really low. Plus I am under a time crunch so picking up a new language isn't feasible at this point in time. So I scrapped even looking at that one.

More background information
This is not the first version of this website. The previous version required users to email in their photos, but with more than 700 registrants it made a lot of tedious work tying the two pieces of information together.

However, this did give me the ability to check and see exactly how the users would be sending their photos. The photos do not need to be cropped at all, they just need to be shrunk down to a usable size. There were people sending photos taken at 12 megapixels which really isn't required. The photos really only need to be a monitor appropriate size.

I would like to store the photos in a folder based on the participant ID number. I can create this folder and even store files in it. The issue I am running into is the re-sizing. Due to the extremely large file size of some of the submissions I wanted to find one that could resize locally if necessary and then upload a smaller file.
0
 
Ray PaseurCommented:
I understand the objective.  You may be able to find a client-side resize script written in jQuery; I do not have one.  But I do have the way to resize an image on the server side after it is uploaded.  A 12MP image is rather large to upload, and you might suggest to the client community that they use Photoshop or equivalent to resize the images before uploading.  But given that most people have high speed internet connections, a 12MP upload will finish in at most a few minutes.  It's not an ideal solution, but if you're under a time crunch, this may help.

You can pare this script down quite a bit if you're at the level of PHP 5.2+ and have the GD at 2+ installed.  You can use phpinfo() to check the current levels.

This script is set up to process PNG files, but it would only be a line or two change to process JPG files, too.
<?php // RAY_image_resize.php
error_reporting(E_ALL);

// RESIZE A PNG IMAGE TO FIT A PREDEFINED SIZE.  USES THE GD LIBRARY.
// MAN PAGES: http://php.net/manual/en/ref.image.php

// A FUNCTION TO DETERMINE IF GD IS AT LEVEL 2 OR MORE
function get_gd_info($display=FALSE)
{
    // IS GD INSTALLED AT ALL?  http://php.net/manual/en/function.gd-info.php
    if (!function_exists("gd_info"))
    {
        if ($display) echo "<br/>GD NOT INSTALLED\n";
        return FALSE;
    }

    // IF GD IS INSTALLED GET DETAILS
    $gd = gd_info();

    // IF DISPLAY IS REQUESTED, PRINT DETAILS
    if ($display)
    {
        echo "<br/>GD DETAILS:\n";
        foreach ($gd as $key => $value)
        {
            if ($value === TRUE)  $value = 'YES';
            if ($value === FALSE) $value = 'NO';
            echo "<br/>$key = $value \n";
        }
    }

    // RETURN THE VERSION NUMBER
    $gd_version = preg_replace('/[^0-9\.]/', '', $gd["GD Version"]);
    return $gd_version;
}


// A FUNCTION TO MAKE AN IMAGE INTO THE RIGHT WIDTH FOR PAGE DISPLAY
// WILL WORK IF GD2 NOT INSTALLED, BUT WILL MAKE BETTER IMAGES WITH GD2
// INPUT IS THE IMAGE FILE NAME, OUTPUT IS AN IMAGE RESOURCE, OR FALSE IF NO RESIZE NEEDED
function create_right_size_image($image, $width=300)
{
    // IS GD HERE?
    $gdv = get_gd_info();
    if (!$gdv) return FALSE;

    // GET AN IMAGE RESOURCE http://php.net/manual/en/function.imagecreatefromjpeg.php
    $source = imagecreatefrompng("$image");

    // GET THE X AND Y DIMENSIONS http://php.net/manual/en/function.imagesx.php
    $imageX = imagesx($source);
    $imageY = imagesy($source);

    // IF NO RESIZING IS NEEDED
    if ($imageX <= $width)
    {
        return FALSE;
    }

    // THE WIDTH IS TOO GREAT - MUST RESIZE
    $tnailX = $width;
    $tnailY = (int) (($tnailX * $imageY) / $imageX );

    // WHICH FUNCTIONS CAN RESIZE / RESAMPLE THE IMAGE?
    if ($gdv >= 2)
    {
        // IF GD IS AT LEVEL 2 OR ABOVE USE http://php.net/manual/en/function.imagecreatetruecolor.php
        $target = imagecreatetruecolor($tnailX, $tnailY);
        imagecopyresampled ($target, $source, 0, 0, 0, 0, $tnailX, $tnailY, $imageX, $imageY);
    }
    else
    {
        // IF GD IS AT A LOWER REVISION LEVEL
        $target = imagecreate($tnailX, $tnailY);
        imagecopyresized   ($target, $source, 0, 0, 0, 0, $tnailX, $tnailY, $imageX, $imageY);
    }
    // RETURN THE IMAGE RESOURCE
    return $target;
}



// SAMPLE CALLING SEQUENCE - SET THE FILE PATH URLS
$old = 'RAY_orig_600x374.png';
$new = 'RAY_temp_300x187.png';

// RESIZE THE FILE TO FIT DESIRED WIDTH, IF NECESSARY
if ($image_resource = create_right_size_image($old))
{
    // WRITE (OVERWRITE) THE IMAGE IN THE NEW FILE http://php.net/manual/en/function.imagepng.php
    imagepng($image_resource, $new);

    // FREE THE MEMORY USED FOR THE IMAGE
    imagedestroy($image_resource);

    // SHOW A LINK TO THE NEW IMAGE
    echo '<a target="_blank" href="' . $new . '">SEE NEW ' . $new . '</a>' . PHP_EOL;
}

// IF IMAGE DID NOT NEED TO BE RESIZED - WAS EQUAL OR SMALLER THAN DESIRED WIDTH
echo 'ORIGINAL: <a target="_blank" href="' . $old . '">SEE OLD ' . $old . '</a>' . PHP_EOL;

Open in new window

HTH, ~Ray
0
 
shdwmageAuthor Commented:
Not 100% what I was looking for but I was able to make it work.

Thanks Ray
0
 
Ray PaseurCommented:
You're welcome.  Thanks for the points and thanks for using EE, ~Ray
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now