You can create simple applications that automate image processes by using ColdFusion images.

Generating thumbnail images

The following example shows how to create a form for uploading images. A visitor to the site can use the form to upload an image file and generate a thumbnail image from it. You use ColdFusion image operations to perform the following tasks:

• Verify that the uploaded file is a valid image.
• Ensure that the height or the width of the image does not exceed 800 pixels.
• If the image is valid and within the size limits, generate a thumbnail version of the source image and save it to a file.

Enter the following code on the form page:

<!--- This code creates a form with one field where the user enters the image file to upload. --->
<cfform action="makeThumbnail.cfm" method="post" enctype="multipart/form-data">
Please upload an image: <cfinput type="file" name="image">
<cfinput type="submit" value="Send Image" name="Submit">
</cfform>

Enter the following code on the action page:

<cfset thisDir = expandPath(".")>
<!--- Determine whether the form is uploaded with the image. --->
<cfif structKeyExists(form,"image") and len(trim(form.image))>
    <!--- Use the cffile tag to upload the image file. --->
    <cffile action="upload" fileField="image" destination="#thisDir#" result="fileUpload"
        nameconflict="overwrite">
    <!--- Determine whether the image file is saved. --->
    <cfif fileUpload.fileWasSaved>
    <!--- Determine whether the saved file is a valid image file. --->
        <cfif IsImageFile("#fileUpload.serverfile#")>
    <!--- Read the image file into a variable called myImage. --->
            <cfimage action="read" source="#fileUpload.serverfile#" name="myImage">
            <!--- Determine whether the image file exceeds the size limits. --->
            <cfif ImageGetHeight(myImage) gt 800 or ImageGetWidth(myImage) gt 800>
                <!--- If the file is too large, delete it from the server. --->
                <cffile action="delete"
                    file="#fileUpload.serverDirectory#/#fileUpload.serverFile#">
                <cfoutput>
                <p>
                The image you uploaded was too large. It must be less than 800 pixels wide
                    and 800 pixels high. Your image was #imageGetWidth(myImage)# pixels wide
                    and #imageGetHeight(myImage)# pixels high.
                </p>
                </cfoutput>
                <!--- If the image is valid and does not exceed the size limits,
                    create a thumbnail image from the source file that is 75-pixels
                    square, while maintaining the aspect ratio of the source image. 
                    Use the bilinear interpolation method to improve performance.
                    --->
            <cfelse>

    <cfset ImageScaleToFit(myImage,75,75,"bilinear")>
                <!--- Specify the new filename as the source filename with
                    "_thumbnail" appended to it. --->
                <cfset newImageName = fileUpload.serverDirectory & "/" &
                    fileUpload.serverFilename & "_thumbnail." &
                    fileUpload.serverFileExt>
                <!--- Save the thumbnail image to a file with the new filename. --->
                <cfimage source="#myImage#" action="write"
                    destination="#newImageName#" overwrite="yes">
                <cfoutput>
                <p>
                Thank you for uploading the image. We have created a thumbnail for
                    your picture.
                </p>
                <p>
                <!--- Display the thumbnail image. --->
                <img src="#getFileFromPath(newImageName)#">
                </p>
                </cfoutput>    
            </cfif>
        <!--- If it is not a valid image file, delete it from the server. --->
        <cfelse>
            <cffile action="delete"
                file="#fileUpload.serverDirectory#/#fileUpload.serverFile#">
            <cfoutput>
            <p>
            The file you uploaded, #fileUpload.clientFile#, was not a valid image.
            </p>
            </cfoutput>
        </cfif>
    </cfif>
</cfif>

Generating a gallery of watermarked images

The following example extracts images and information from the cfartgallery database. You use ColdFusion image operations to perform the following tasks:

• Verify that an image exists for records returned from the database.
• Display the text, SOLD! on images that have been sold.
• Resize images to 100 pixels, maintaining the aspect ratio of the source image.
• Add a 5-pixel border to the images.
• Display the modified images directly in the browser without writing them to files.

Example

<!--- Create a query to extract artwork and associated information from the cfartgallery database. --->
<cfquery name="artwork" datasource="cfartgallery">
SELECT FIRSTNAME, LASTNAME, ARTNAME, DESCRIPTION, PRICE, LARGEIMAGE, ISSOLD, MEDIATYPE
FROM ARTISTS, ART, MEDIA
WHERE ARTISTS.ARTISTID = ART.ARTISTID
AND ART.MEDIAID = MEDIA.MEDIAID
ORDER BY ARTNAME
</cfquery>
<cfset xctr = 1>
<table border="0" cellpadding="15" cellspacing="0" bgcolor="#FFFFFF">
<cfoutput query="artwork">
    <cfif xctr mod 3 eq 1>
    <tr>
        </cfif>
        <!--- Use the IsImageFile function to verify that the image files extracted from the
            database are valid. Use the ImageNew function to create a ColdFusion image from
            valid image files. --->
        <cfif IsImageFile("../cfdocs/images/artgallery/#artwork.largeImage#")>
        <cfset myImage=ImageNew("../cfdocs/images/artgallery/#artwork.largeImage#")>
            <td valign="top" align="center" width="200">
            <cfset xctr = xctr + 1>
            <!--- For artwork that has been sold, display the text string "SOLD!"
                in white on the image. --->
                    <cfif artwork.isSold>
                        <cfset ImageSetDrawingColor(myImage,"white")>
                            <cfset attr=StructNew()>
                            <cfset attr.size=45>
                            <cfset attr.style="bold">
                            <cfset ImageDrawText(myImage,"SOLD!",35,195, attr)>
                            </cfif>
        <!--- Resize myImage to fit in a 110-pixel square, scaled proportionately. --->
        <cfset ImageScaleToFit(myImage,110,"","bicubic")>
        <!--- Add a 5-pixel black border around the images. (Black is the default color. --->
        <!--- Add a 5-pixel black border to myImage. --->
        <cfset ImageAddBorder(myImage,"5")>
        <!--- Write the images directly to the browser without saving them to the hard drive.
            --->
        <cfimage source="#myImage#" action="writeToBrowser"><br>
            <strong>#artwork.artName#</strong><br>
            Artist: #artwork.firstName# #artwork.lastName#<br>
            Price: #dollarFormat(artwork.price)#<br>
            #artwork.mediaType# - #artwork.description#<br>
            </td>
        </cfif>
        <cfif xctr-1 mod 3 eq 0>
            </tr>
        </cfif>
</cfoutput>
</table>

Using CAPTCHA to verify membership

The following example shows how to create a simple form to verify whether a person (rather than a computer generating spam) is registering to receive an online newsletter. You generate the CAPTCHA image from a random text string on the form page and verify the person's response on the action page.