3, Reminder
Project part I due tonight at midnight
Uploading files and PHP graphics
INFO/COM S 230: Intermediate Web Design and Programming
Midterm info
Time: 7:30-9PM, Tuesday 3/11 Place: Olin 155 Format: On paper Closed book, closed notes However, you can bring a 4"x6" index card of notes you made yourself (front and back). Coverage: Up to (and including) Monday's lecture on logins
Review session
Sunday, March 9 4-6PM Room: TBA Note: This is optional.
Section
Will distribute Lecture evaluation form Form to help us put together final project groups
Group sizes 3-4 You can request to be in a group with someone else (from same section time), and we'll respect it if the choice is mutual
Uploading files
1
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.
How to upload a file
As you might suspect, file uploading is another HTML form. <form action="photoadmin.php" method="post" enctype="multipart/form-data"> <input type="file" name="newphoto" /> <input type="submit" name="Upload photo" /> </form>
But what is on other side?
Accessing the file
Unlike other form data, information from file uploading shows up in $_FILES (rather than $_POST or $_GET). $_FILES[`newphoto'][`name'] original name of file $_FILES[`newphoto'][`tmp_name'] name of file in temporary storage $_FILES[`newphoto'][`size'] size in bytes of file $_FILES[`newphoto'][`type'] type of file (e.g. "image/jpeg" or "application/pdf") $_FILES[`newphoto'][`error'] error code (0 if no error)
Moving the file
move_uploaded_file(source, destination) Moves uploaded file out of temporary storage to wherever you want to keep it E.g.
move_uploaded_file($_FILES[`newphoto'][`tmp_name'], "images/".$_FILES[`newphoto'][`name']);
photoadmin.php
Another useful function
getimagesize(filename) Returns an array with various information about an image file. E.g. $array = getimagesize("myphoto.jpg"); $array[0]=image width $array[1]=image height $array[2]=code for image type $array[3]=`height="ht" width="wt" `
<?php if (isset($_FILES['newphoto'])) { if ($_FILES['newphoto']['error'] == 0) { move_uploaded_file($_FILES['newphoto']['tmp_name'], "./".$_FILES['newphoto']['name']); $_SESSION['photos'][ ] = $_FILES['newphoto']['name']; print("The file ".$_FILES['newphoto']['name']." was uploaded successfully.\n"); } else { print("The file ".$_FILES['newphoto']['name']." was not uploaded.\n"); } } ?> <form action="photoadmin.php" method="post" enctype="multipart/form-data"> Photo: <input type="file" name="newphoto" /><br /> <input type="submit" value="Upload photo" /> </form>
2
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.
photo.php
<?php foreach ($_SESSION['photos'] as $photo) { $imagesize = getimagesize($photo); print("<img src=\"$photo\" $imagesize[3] /><br />\n"); } ?>
PHP Graphics
Graphics
It is possible to create images "on the fly" with PHP via a graphics package gd2. GD2 is not enabled by default with PHP. However, it is on the 230 server, and it is not too hard to enable on Windows installations (see PHP forum).
Credits
There's tons to cover on PHP graphics; we're only scratching the surface. To learn more, see the following nice introduction about PHP graphics: http://www.nyphp.org/content/presentatio ns/GDintro/
Including a PHP-generated image
No different than including any other image. <img src="myimage.php" height="200" width="200" alt="A random image" />
The general form
1. Create an image of specified size in memory. 2. Put content in the image (shapes, text, etc.) 3. Output a header (so your browser knows it is an image, and not HTML) 4. Output the image 5. Free the memory used to create the image.
3
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.
Most of the steps
imageCreate(width, height) imageCreateTrueColor(width, height) Returns an image resource of width pixels by height pixels. header(`image/png') header(`image/jpeg') Outputs headers for PNG or JPEG type images respectively.
Most of the steps
imagePNG(image) imageJPEG(image) Given an image resource, outputs a PNG or JPEG image respectively. imageDestroy(image) an Given image resource, frees the memory associated with the image.
Example
<?php $im = imageCreate(200, 200); // Do the interesting stuff here header(`image/PNG'); imagePNG($im); imageDestroy($im); ?>
The interesting stuff
We can specify the colors we will use in RGB format. imageColorAllocate(image, red, green, blue) Returns a color resource E.g. $white = imageColorAllocate($im, 0xFF, 0xFF, 0xFF); $black = imageColorAllocate($im, 0, 0, 0);
Lines
imageLine(image, x1, y1, x2, y2, color) Draws a line on image of color color from (x1,y1) to (x2,y2)
(0,0) (width, 0)
Rectangles
imageRectangle(image, x1, y1, x2, y2, color) Draws a rectangle in image of color color with opposite corners at (x1,y1) and (x2, y2) imageFilledRectangle(image, x1, y1, x2, y2, color) Same as above, but rectangle is filled in.
(0,height)
4
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.
<?php
Ellipses
imageEllipse(image, x, y, w, h, color) Draws an ellipse of color color centered at (x,y) of width w and height h imageFilledEllipse(image, x, y, w, h, color) Same as above, but ellipse is filled in
?>
$im = imageCreate(500, 500); $black = imageColorAllocate($im, 0, 0, 0); $blue = imageColorAllocate($im, 0, 0, 0x80); $red = imageColorAllocate($im, 0x80, 0, 0); imageLine($im, 20, 20, 300, 400, $black); imageRectangle($im, 200, 10, 100, 100, $red); imageFilledRectangle($im, 200, 490, 100, 400, $blue); imageEllipse($im, 150, 250, 100, 200, $blue); imageFilledEllipse($im, 150, 100, 75, 75, $red);
header('Content-type: image/png'); imagePNG($im); imageDestroy($im);
Why...?
For fixed images, probably would rather use a drawing program. But helpful for drawing images based on user input, database information, etc.
A clock
$im = imageCreate(500, 500); $white = imageColorAllocate($im, 0xFF, 0xFF, 0xFF); $black = imageColorAllocate($im, 0, 0, 0); $blue = imageColorAllocate($im, 0, 0, 0x80); imageFilledEllipse($im, 250, 250, 450, 450, $black); imageFilledEllipse($im, 250, 250, 430, 430, $blue); imageFilledEllipse($im, 250, 250, 410, 410, $white); imageSetThickness($im, 10); $array = getMinuteHand(250, 250, 180); \\ use date function to get minute imageLine($im, $array[0], $array[1], $array[2], $array[3], $black); imageSetThickness($im, 20); $array = getHourHand(250, 250, 140); \\ use date function to get hour imageLine($im, $array[0],$array[1], $array[2], $array[3], $black); header('Content-type: image/png'); imagePNG($im); imageDestroy($im);
Drawing on existing images
imageCreateFromPNG(filename) imageCreateFromGIF(filename) imageCreateFromJPEG(filename) Use as a starting image the given PNG/GIF/JPEG.
$im = imageCreateFromGIF("tower.gif"); $white = imageColorAllocate($im, 0xFF, 0xFF, 0xFF); $black = imageColorAllocate($im, 0, 0, 0);
imageSetThickness($im, 3); $array = getMinuteHand(48, 276, 30); imageLine($im, $array[0], $array[1], $array[2], $array[3], $black); imageSetThickness($im, 4); $array = getHourHand(48, 276, 20); imageLine($im, $array[0],$array[1], $array[2], $array[3], $black); header('Content-type: image/png'); imagePNG($im); imageDestroy($im);
5
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.
Using PHP Graphics to make thumbnails
Instead, we can use PHP graphics to save a smaller, resized version of our photo (a "thumbnail"), which we can show instead.
$img = imagecreatefromjpeg("./".$_FILES['newphoto']['name']); $width = imagesx($img); $height = imagesy($img); $thumb_width = 200; $new_width = $thumb_width; $new_height = floor($height * ($thumb_width/$width)); $new_img = imagecreatetruecolor($new_width, $new_height); imagecopyresampled($new_img, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height); imagejpeg($new_img, "./thumbs/".$_FILES['newphoto']['name']); imageDestroy($img); imageDestroy($new_img);
imagesx(image), imagesy(image) Gives width, height of image. imageCopyResized(dst_img, src_img, dst_x, dst_y, src_x, src_y, dst_width, dst_height, src_width,src_height) (also imageCopyResampled) Copy a rectangle from src_img to dst_img with resizing (Resampled also tries to interpolate colors to keep image clarity). imageJPEG(image, filename) Saves image in JPG file filename.
Review
Upload files via input type="file"; use results on PHP side via $_FILES. Can draw images using data from user input, databases, other sources with PHP graphics.
Project 3
6
Easy PDF Creator is professional software to create PDF. If you wish to remove this line, buy it now.