Description of "showboard.asp" and "boardimage.asp"
The form data is POSTed to "showboard.asp" which then constructs a URL which can pass the data into "boardimage.asp". This data is then used by the csImageFile component to create the new image from predefined GIF images.
The relevant lines of "showboard.asp" are listed below.
<%
NewURL = "boardimage.asp?s1="
For I = 0 to 63
NewUrl = NewURL & Request.Form.Item(I) & "&" & "s" & (I + 1) & "="
Next
NewURL = NewURL & Request.Form.Item(64)
%>
<img src="<%=NewURL%>">
The contents of each square on the chess board were assigned a form variable based on the name of the image displayed. The variable names were s1 through to s64. This data is written into the URL that calls the image creation script.
The image itself is created in "boardimage.asp". This script is listed below.
<%@ language=vbscript %>
<%
Response.Expires = 0
Response.Buffer = true
Response.Clear
Set Image = Server.CreateObject("csImageFile.Manage")
Image.ReadFile Server.MapPath("images/startboard.png")
Image.Transparent = true
Image.TransparentColor = "397B7B"
For I = 0 to 63
If Request.QueryString.Item(I + 1) <> "e_" Then
X = (I mod 8) * 32 + 1
Y = (I \ 8) * 32 + 1
Image.MergeBack Server.MapPath("images/" & _
Request.QueryString.Item(I + 1) & ".gif"), X, Y
End If
Next
Image.Transparent = false
Response.BinaryWrite Image.GIFData
Response.ContentType = "image/gif"
%>
The relevant points here are that the compound image is produced by starting with an empty board, "startboard.png" and then an image of each piece is placed at the appropriate coordinates. The QueryString variable representing each square contains the first two characters of the file name of the piece graphic, for example the square containing the white king has value "wk" and the graphic is called "wk.gif". An empty square has the value "e_" and is ignored.
The graphics of the pieces each have a background colour #397B7B, and this is set as the transparent colour before callng the MergeBack method of csImageFile. This means that the same graphics can be used for both colour squares. The Transparent property must be set to false before streaming the file otherwise the dark squares will be transparent.
The image is streamed in GIF format using BinaryWrite.