This demo application performs additional image processing on the server after images are uploaded. It rotates uploaded images if necessary and adds a border to them, like this one:

Sample image with border
Figure 1. Sample image.

Unlike other demo applications, this one uses Image Uploader merely for the upload and thumbnail rotation, if needed. No other image processing is carried out on the client side.

Features

The application highlights the following features:

  • Server image processing.
  • File filtering by extension.

Client-Side Code

The sample presumes that you upload an unchanged original file and a single thumbnail.

Note that the source file is not modified even if the user has rotated it (by design). Instead, the angle is uploaded as an Angle_N field, where N is the number of the corresponding file. The value of this field is used by the server script for performing rotation. The thumbnail is sent already rotated though.

File Filtering

This application also demonstrates how to allow users to upload images only of certain types. Files of other types simply will not be shown while browsing. Extensions of the allowed files are listed as a value of the FileMask property. For more information, see the Restricting Files by Extensions and Types topic.

Server-Side Code

On every platform the upload script simply iterates through all the files, rotates them, and, if necessary, draws a border around each of them. Some platforms require installation of additional libraries or components to enable image processing.

Imaging Components

The following components are used in this sample for different platforms:

Platform Used components
ASP.NET Built-in classes from the System.Drawing namespace
ASP Aurigma Graphics Mill ActiveX component.
PHP GD2 extension
JSP Built-in classes from the java.awt package
Perl ImageMagick module
Python Python Imaging Library (PIL)
Ruby RMagick extension
Note

This sample is not implemented for the ColdFusion platform.