Using csImageFile to Join Images - A Simple Counter

This demonstration application shows how the image merging features of csImageFile can be used to display a page counter. You will need the csImageFile component installed on your server as well as the sample files, which can be downloaded below.

Download the sample scripts - (4 KB)

Download the trial csImageFile component - (4.3 MB MB)

The files in include 10 digits as bitmaps, a fairly simple web page to hold the counter and the main asp script - "counter.asp". There is also a text file containing the count total.

Most graphical page counters work by calling the script inside an image tag, something like this...

<img src="counter.asp">

The work is done by the counter.asp script which reads the count, increments it, produces an image of it and then streams this image to the <img> tag, making the browser think it is an image file. This script is listed below with some notes.

'These 3 lines prevent the page being cached
'and make the server finish processing it before streaming it.
'Use this method when asp output is an image rather than html.

Response.Expires = 0
Response.Buffer = true

'Create a csImageFile object
'For the full version use "csImageFile.Manage" instead.
'Create it now because we will use the CurrentDir property

Set Obj = Server.CreateObject("csImageFileTrial.Manage")

'The counter total is stored in count.txt
'so open the file and read the value into a variable called count

Set FileStreamObj = CreateObject("Scripting.FileSystemObject")
Set TextFile = FileStreamObj.OpenTextFile(Obj.CurrentDir & "\count.txt")
Count = TextFile.Readline

'Increment the counter
Count = Count + 1
If Count > 9999 Then
  Count = 0
End If

'Overwrite count.txt with a new file containing the new total
Set NewFile = FileStreamObj.CreateTextFile(Obj.CurrentDir & "\count.txt")

'Extract a single character for each digit
Count = CStr(Count)
While Len(Count) < 4
  Count = "0" & Count
Units = Mid(Count, 4, 1)
Tens = Mid(Count, 3, 1)
Hundreds = Mid(Count, 2, 1)
Thousands = Mid(Count, 1, 1)

'Create the background image in memory.
'This sets the size of the combined image.

Obj.NewImage 120, 40, "ffffff"

'Use the MergeBack method once for each digit.
'The path to the second image file is specified
'and the coordinates are to position the top left of the second image.

Obj.MergeBack Obj.CurrentDir + "\" & Thousands & ".bmp", 0, 0
Obj.MergeBack Obj.CurrentDir + "\" & Hundreds & ".bmp", 30, 0
Obj.MergeBack Obj.CurrentDir + "\" & Tens & ".bmp", 60, 0
Obj.MergeBack Obj.CurrentDir + "\" & Units & ".bmp", 90, 0

'Specify the MIME type and send the data out as binary
Response.ContentType = "image/gif"
Response.BinaryWrite Obj.GIFData


Note that the script must have permission to create and modify files in its own directory. This means that the Internet Guest Account must have Modify permission for that directory.

The counter can be seen working here.