WebDNA Software | ImageMagick

ImageMagick

Use ImageMagick to manipulate images when you upload them.

numero = 141
interpreted = N
texte = WebDNA can easily manage file uploads, but you will need something like ImageMagick to manipulate images once they've been uploaded. Use ImageMagick to downsize images, generate thumbnails, convert to jpg, gif, or png or to imprint your URL. But there are many, many other commands for manipulating images. Here we show some basic syntax for tapping into ImageMagick's power. From there, you will be able to explore on your own to build many combinations of operations.First of all, ImageMagick needs to be installed on the server. ImageMagick website: ImageMagick.org. Install all the options, including the GhostScript Fonts. As ImageMagick is a Unix program running the server, you will 'call' it via the [shell] context. If you are running WebDNA on your own server (i.e.without sandboxes), you will have full access to the [shell] context as described in this section. If you are in a Sandbox on a shared server, you can still use the [shell] context, but it works a little differently. The server administrator will need to make sure your requested script does no harm (like erasing the hard drive). Then once approved, he or she will set up a [shell] script for you, and you will tap into it by following the examples in the Sandbox section below. (Read through the first part to learn how to construct the ImageMagick commands.)ImageMagick consists of several command-line utilities (animate, compare, composite, conjure, convert, display, identify, import, mogrify, montage, stream). Convert is by far the most useful one for our purposes and will be discussed here. On your own time, you can go to the IM website and learn about the others.Then there are dozens of options available (ImageMagick options). These are normally preceded with a hyphen, but in some cases, a plus sign instead can alter the function. Many options take arguments, such as -border, which takes arguments to define the color and width. Quotation marks are used whenever operators are present, and it doesn't hurt to use them in all geometry arguments (e.g. "100x150", "50%"). IM works as a command-line program, and must be written as one line, with spaces separating the various elements. Begin the script with the utility name, including its path on the server. The rest of the script will contain the image input name, any number of options, and the output name. (An image name is actually the path to the image.) To make WebDNA invoke IM, wrap it in a [shell] context:[shell]/usr/bin/convert image.jpg image.png[/shell]This very simplest of IM processing uses the utility convert to convert a jpg to a png.Here is a more complicated example taken from one of my sites, showing some WebDNA variables that were set earlier on the page or sent via formvariables:[shell]/usr/bin/convert temp/[tempfile] -resize '[maxwidth]x[maxheight]>' +profile "*" -pointsize 11 -fill [fill] -font /sw/share/doc/ghostscript-fonts/a010015l.pfb -draw "gravity southeast text 5,5 '[textimprint]'" -format jpg ../images/gallery/[jpgfilename][/shell]Here, a file was just uploaded and written to a directory called "temp", with a filename called [tempfile] (a random-number assigned filename). The maximum width and height is part of set of variables that define the websites preferences. The [textimprint] is the URL of the site, or an alternate user-defined text string from the upload form. [fill] is either black or white, as chosen in the upload form (can be any RGB color). [jpgfilename] is a cleaned-up version of the uploaded filename; i.e. spaces and other illegals were stripped, and the extension was checked and corrected to a 3 character extension if necessary. Our job is to size it to a uniform web-friendly dimension and imprint the URL in the corner in either black or white, depending on what would work better in the image. (A separate [shell] script creates the thumbnail.)Here is a breakdown of the above:temp/[tempfile]Our source image.-resize '[maxwidth]x[maxheight]>'As it suggests, this resizes the image (temp/[tempfile]) to a predetermined maximum size. The ">" modifier tells ImageMagick to only resize if the original is larger. By default, IM resizes proportionately to the largest dimension. (There is a command to force it to resize to a specified width and height, if you would like to distort your images though.)+profile "*" In a backward-intuitive way, this tells IM to REMOVE any profile information from the file. This makes for a smaller file size. "*" (wildcard) means that ANY profile in the image is removed. -pointsize 11 -fill [fill] -font /sw/share/doc/ghostscript-fonts/a010015l.pfbThese three options are setting us up to apply text to the image. Pointsize is the size of the font in points (think of a point as equal to a pixel.) Fill is the color. Font is the font, using the path to the font.-draw "gravity southeast text 5,5 '[textimprint]'""-draw" will apply the text to the image using these instructions: gravity southeast tells where to place the text. In this case, southeast means the lower right. text 5,5 '[textimprint]' says that this is going to be text (-draw can also draw circles, lines, etc.), and tells how much to offset the text from the corner, and defines the text string. Both "gravity" and "text" tell "-draw" what to do, and are therefore contained in double quotes (because we're already using single quotes for the string).-format jpgThe format of the image will be a .jpg, in case the original was a .gif or something else.../images/gallery/[jpgfilename]And finally, we're going to write the final converted file here.Making the Thumbnail

[shell]/sw/bin/convert  temp/[tempfile] -scale [maxTHwidth]x[maxTHheight] -format jpg +profile "*" ../images/gallery/th/z[jpgfilename][/shell]

The only difference here is -scale vs. -resize. -Scale is a faster, simpler algorithm, but you could use -resize if you like. And finally, we'd do this to delete the temp file:

[deletefile temp/[tempfile]]

A word about mogrifyIn the WebDNA archives you will find references to mogrify used in the same way as convert. Mogrify is a destructive operation, because it automatically overwrites the original image. In general, don't use mogrify. Even the IM site gives numerous warnings about using mogrify. In our example, we do two things using our original file: make a regular sized image, and make a thumbnail. Then we use WebDNA to delete the original. Creating both files from one original would be impossible to do using mogrify.

SANDBOX USAGEIf you are in a sandbox, ask the administrator to create a shell script for you to do the following:[shell]/sw/bin/convert [IMcommands][/shell]Then, they will create an entry in the WDNA_SandboxScripts.db with an ID which they will assign to you. Let's say the ID is IMConvert. Then you will create your scripts by defining the commands (minus the /sw/bin/convert portion) in a [IMcommands] text variable and feeding it to the script like so:

[text]IMcommands=temp/[tempfile] -scale [maxTHwidth]x[maxTHheight] -format jpg +profile "*" ../images/gallery/th/z[jpgfilename][/text][shell scriptid=IMConvert][/shell]

It looks a little odd to have an empty [shell] context, but this is how it works! WebDNA can easily manage file uploads, but you will need something like ImageMagick to manipulate images once they've been uploaded. Use ImageMagick to downsize images, generate thumbnails, convert to jpg, gif, or png or to imprint your URL. But there are many, many other commands for manipulating images. Here we show some basic syntax for tapping into ImageMagick's power. From there, you will be able to explore on your own to build many combinations of operations.

First of all, ImageMagick needs to be installed on the server. ImageMagick website: ImageMagick.org. Install all the options, including the GhostScript Fonts.

As ImageMagick is a Unix program running the server, you will 'call' it via the [shell] context.
If you are running WebDNA on your own server (i.e.without sandboxes), you will have full access to the [shell] context as described in this section. If you are in a Sandbox on a shared server, you can still use the [shell] context, but it works a little differently. The server administrator will need to make sure your requested script does no harm (like erasing the hard drive). Then once approved, he or she will set up a [shell] script for you, and you will tap into it by following the examples in the Sandbox section below. (Read through the first part to learn how to construct the ImageMagick commands.)

ImageMagick consists of several command-line utilities (animate, compare, composite, conjure, convert, display, identify, import, mogrify, montage, stream). Convert is by far the most useful one for our purposes and will be discussed here. On your own time, you can go to the IM website and learn about the others.

Then there are dozens of options available (ImageMagick options). These are normally preceded with a hyphen, but in some cases, a plus sign instead can alter the function. Many options take arguments, such as -border, which takes arguments to define the color and width. Quotation marks are used whenever operators are present, and it doesn't hurt to use them in all geometry arguments (e.g. "100x150", "50%").

IM works as a command-line program, and must be written as one line, with spaces separating the various elements. Begin the script with the utility name, including its path on the server. The rest of the script will contain the image input name, any number of options, and the output name. (An image name is actually the path to the image.)

To make WebDNA invoke IM, wrap it in a [shell] context:

[shell]/usr/bin/convert image.jpg image.png[/shell]

This very simplest of IM processing uses the utility convert to convert a jpg to a png.

Here is a more complicated example taken from one of my sites, showing some WebDNA variables that were set earlier on the page or sent via formvariables:

[shell]/usr/bin/convert temp/[tempfile] -resize '[maxwidth]x[maxheight]>' +profile "*" -pointsize 11 -fill [fill] -font /sw/share/doc/ghostscript-fonts/a010015l.pfb -draw "gravity southeast text 5,5 '[textimprint]'" -format jpg ../images/gallery/[jpgfilename][/shell]

Here, a file was just uploaded and written to a directory called "temp", with a filename called [tempfile] (a random-number assigned filename). The maximum width and height is part of set of variables that define the websites preferences. The [textimprint] is the URL of the site, or an alternate user-defined text string from the upload form. [fill] is either black or white, as chosen in the upload form (can be any RGB color). [jpgfilename] is a cleaned-up version of the uploaded filename; i.e. spaces and other illegals were stripped, and the extension was checked and corrected to a 3 character extension if necessary. Our job is to size it to a uniform web-friendly dimension and imprint the URL in the corner in either black or white, depending on what would work better in the image. (A separate [shell] script creates the thumbnail.)

Here is a breakdown of the above:

temp/[tempfile]
Our source image.

-resize '[maxwidth]x[maxheight]>'
As it suggests, this resizes the image (temp/[tempfile]) to a predetermined maximum size. The ">" modifier tells ImageMagick to only resize if the original is larger. By default, IM resizes proportionately to the largest dimension. (There is a command to force it to resize to a specified width and height, if you would like to distort your images though.)

+profile "*"
In a backward-intuitive way, this tells IM to REMOVE any profile information from the file. This makes for a smaller file size. "*" (wildcard) means that ANY profile in the image is removed.

-pointsize 11
-fill [fill]
-font /sw/share/doc/ghostscript-fonts/a010015l.pfb
These three options are setting us up to apply text to the image. Pointsize is the size of the font in points (think of a point as equal to a pixel.) Fill is the color. Font is the font, using the path to the font.

-draw "gravity southeast text 5,5 '[textimprint]'"
"-draw" will apply the text to the image using these instructions:

gravity southeast tells where to place the text. In this case, southeast means the lower right.

text 5,5 '[textimprint]' says that this is going to be text (-draw can also draw circles, lines, etc.), and tells how much to offset the text from the corner, and defines the text string.

Both "gravity" and "text" tell "-draw" what to do, and are therefore contained in double quotes (because we're already using single quotes for the string).

-format jpg
The format of the image will be a .jpg, in case the original was a .gif or something else.

../images/gallery/[jpgfilename]
And finally, we're going to write the final converted file here.

Making the Thumbnail

[shell]/sw/bin/convert  temp/[tempfile] -scale [maxTHwidth]x[maxTHheight] -format jpg +profile "*" ../images/gallery/th/z[jpgfilename][/shell]

The only difference here is -scale vs. -resize. -Scale is a faster, simpler algorithm, but you could use -resize if you like.

And finally, we'd do this to delete the temp file:

[deletefile temp/[tempfile]]

A word about mogrify
In the WebDNA archives you will find references to mogrify used in the same way as convert. Mogrify is a destructive operation, because it automatically overwrites the original image. In general, don't use mogrify. Even the IM site gives numerous warnings about using mogrify. In our example, we do two things using our original file: make a regular sized image, and make a thumbnail. Then we use WebDNA to delete the original. Creating both files from one original would be impossible to do using mogrify.

SANDBOX USAGE
If you are in a sandbox, ask the administrator to create a shell script for you to do the following:
[shell]/sw/bin/convert [IMcommands][/shell]
Then, they will create an entry in the WDNA_SandboxScripts.db with an ID which they will assign to you. Let's say the ID is IMConvert. Then you will create your scripts by defining the commands (minus the /sw/bin/convert portion) in a [IMcommands] text variable and feeding it to the script like so:

[text]IMcommands=temp/[tempfile] -scale [maxTHwidth]x[maxTHheight] -format jpg +profile "*" ../images/gallery/th/z[jpgfilename][/text]
[shell scriptid=IMConvert][/shell]

It looks a little odd to have an empty [shell] context, but this is how it works! Terry Wilson

DOWNLOAD WEBDNA NOW!

ImageMagick

Top Articles:

Related Readings: