PHP File Upload Script Produces Blurry Image

Question

The file uploading script I have made, uploads a blurry image when uploaded! This is my current script, try to figure out what I have done wrong. The script uploads the images as .png, with username being the actual username of the current logged in user.

Please note that the original image is 17x22, so that isn't whats making it blurry.

<?php
include('../class/resize.php');
//error_reporting(0);
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){
$path = "../files/cloaks/"; //set your folder path
$filename = $_FILES['photoimg']['tmp_name']; //get the temporary uploaded image name
$valid_formats = array("jpg", "png", "gif", "bmp", "jpeg","GIF","JPG","PNG", "JPEG"); //add the formats you want to upload

        $name = $_FILES['photoimg']['name']; //get the name of the image
        $size = $_FILES['photoimg']['size']; //get the size of the image
        if(strlen($name)) //check if the file is selected or cancelled after pressing the browse button. 
        {
            list($txt, $ext) = explode(".", $name); //extract the name and extension of the image
            if(in_array($ext,$valid_formats)) //if the file is valid go on.
            {
            if($size < 2098888) // check if the file size is more than 2 mb
            {
            $actual_image_name =  $_POST['fname']; //actual image name going to store in your folder
            $tmp = $_FILES['photoimg']['tmp_name']; 
            if(move_uploaded_file($tmp, $path.$actual_image_name)) //check the path if it is fine
                {   
                    move_uploaded_file($tmp, $path.$actual_image_name); //move the file to the folder
                    $dburl = ('../files/cloaks/'.$actual_image_name.'');
                    $image = new ZiResize();
                    $image->load($dburl);
                    $image->resize(22,17);
                    $image->save($path.$actual_image_name);
                    //display the image after successfully upload
                    echo "<img src='files/cloaks/".$actual_image_name."'  class='preview'> <input type='hidden' name='actual_image_name' id='actual_image_name' value='$actual_image_name' />";

                }
            else
                {
                echo "failed";
                }
            }
            else
            {
                echo "Error! Max image size is 2 MB!";                  
            }
            }
            else
            {
                echo "Error! Invalid image format!";    
            }
        }
        else
        {       
        echo "Error! No file selected!";
        }       
    exit;
    }
?>

resize.php code

<?php
class ZiResize {

   var $image;
   var $image_type;

   function load($filename) {

      $image_info = getimagesize($filename);
      $this->image_type = $image_info[2];
      if( $this->image_type == IMAGETYPE_JPEG ) {

         $this->image = imagecreatefromjpeg($filename);
      } elseif( $this->image_type == IMAGETYPE_GIF ) {

         $this->image = imagecreatefromgif($filename);
      } elseif( $this->image_type == IMAGETYPE_PNG ) {

         $this->image = imagecreatefrompng($filename);
      }
   }
   function save($filename, $image_type=IMAGETYPE_JPEG, $compression=75, $permissions=null) {

      if( $image_type == IMAGETYPE_JPEG ) {
         imagejpeg($this->image,$filename,$compression);
      } elseif( $image_type == IMAGETYPE_GIF ) {

         imagegif($this->image,$filename);
      } elseif( $image_type == IMAGETYPE_PNG ) {

         imagepng($this->image,$filename);
      }
      if( $permissions != null) {

         chmod($filename,$permissions);
      }
   }
   function output($image_type=IMAGETYPE_JPEG) {

      if( $image_type == IMAGETYPE_JPEG ) {
         imagejpeg($this->image);
      } elseif( $image_type == IMAGETYPE_GIF ) {

         imagegif($this->image);
      } elseif( $image_type == IMAGETYPE_PNG ) {

         imagepng($this->image);
      }
   }
   function getWidth() {

      return imagesx($this->image);
   }
   function getHeight() {

      return imagesy($this->image);
   }
   function resizeToHeight($height) {

      $ratio = $height / $this->getHeight();
      $width = $this->getWidth() * $ratio;
      $this->resize($width,$height);
   }

   function resizeToWidth($width) {
      $ratio = $width / $this->getWidth();
      $height = $this->getheight() * $ratio;
      $this->resize($width,$height);
   }

   function scale($scale) {
      $width = $this->getWidth() * $scale/100;
      $height = $this->getheight() * $scale/100;
      $this->resize($width,$height);
   }

   function resize($width,$height) {
      $new_image = imagecreate($width, $height); 
      imagecopyresampled($new_image, $this->image, 0, 0, 0, 0, $width, $height, $this->getWidth(), $this->getHeight());
      $this->image = $new_image;
   }      

}
?>

Answer 1

Change compression argument when you are saving the image

function save($filename, $image_type=IMAGETYPE_JPEG, $compression=75, $permissions=null)

You are using jpg format, in php, you can set quality of result image, if that quality is lower then original image, the image will look "blurred" even though it hasn't been resized.

You can:

1. Change compression value ( $image->save($path.$actual_image_name, NULL, 100);
2. Change format of image to other format that doesn't support "compression"

As you are not resizing the image, you can replace this:

$image->resize(22,17);
$image->save($path.$actual_image_name);

with this:

$image->save($path.$actual_image_name, NULL, 100);

Answer 2

your resizing to 22px by 17px. it will always look blury when you reduce an image to that size. you should also use imagecreatetruecolor as it allows a full colour spectrum. imagecreate is limited in its colours, which is another reason the image could look blury