Tag Archives: pixeler

Pixeler

This project was made rather quickly in response to an image challenge. Afterwards I changed the project to allow the user to choose any image to pixelate.

Links

Live page
Stack overflow: 100% safe photo upload script
GitHub repository

Overview

The user specifies the uri of an image, and the settings for pixelation. The image is loaded server side using PHP and then the pixels are manipulated and the image returned. The image has to be loaded safely server side and the following code is used to check the MIME type:

$imageURI = (isset($_GET['uri'])) ? $_GET['uri'] : 'monalisa_before.png' ;
$image_extension = substr(strrchr($imageURI, '.'), 1) ;

// Taken from http://stackoverflow.com/questions/3114147/100-safe-photo-upload-script
$mime_mapping = array('png' => 'image/png', 'gif' => 'image/gif', 'jpg' => 'image/jpeg', 'jpeg' => 'image/jpeg') ;
$info = getimagesize($imageURI);
if(!$info){ exit('not an image') ; }
$type = $mime_mapping[$image_extension] ;
if($info['mime']!=$type){ exit('wrong extension given') ; }

switch($type){
case 'image/jpeg': $source = imagecreatefromjpeg($imageURI) ; break ;
case 'image/gif' : $source = imagecreatefromgif ($imageURI) ; break ;
case 'image/png' : $source = imagecreatefrompng ($imageURI) ; break ;
default : quit('File type not known.') ; break ;
}

Challenges

Challenge: Ideally the page should be able to load any image, including those from external domains.
Solution: Although I’d prefer to use the canvas to pixelate images (as can be done with the ASCII art maker) that solution would be limited by the same source restrictions. As a result, this project will stay with PHP until further notice. (Resolved)
Challenge: The user needs to be able to specfiy any URI and the server must be able to handle this safely.
Solution: Safely loading images in PHP is easier than I thought it would be. Thanks, Stack Overflow! (Resolved)

Sample input and output

Sample image before pixelating
Sample image before pixelating
Sample image after pixelating
Sample image after pixelating