Home arrow ASP.NET arrow Page 3 - Building a Counter Using JScript.Net

Building a Counter Using JScript.Net

.Net includes several libraries that let us create images on the fly. In this article Michael shows us how to create a dynamic image-based counter with JScript.Net.

Author Info:
Rating: 5 stars5 stars5 stars5 stars5 stars / 10
July 12, 2002
  1. · Building a Counter Using JScript.Net
  2. · How Should the Counter Work?
  3. · The JScript.Net Code
  4. · Conclusion

print this article

Building a Counter Using JScript.Net - The JScript.Net Code
(Page 3 of 4 )

First off, we need to create the functions which will read and save the counter (increase counter before if new visitor). Copy the following code into a new text file and save the file as counter.aspx:

<%@ Page Language="JScript"%>
<%@ Import Namespace="System.IO" %>

var FilePath:String = Server.MapPath("\\") + "counter.txt";

function getCounter():String
var SR:StreamReader = File.OpenText(FilePath,FileMode.Open);
var Counter:String = SR.ReadLine().ToString();

var Cookie:HttpCookie;
Cookie = Request.Cookies("OldVisitor");

var CounterInt:int = Convert.ToInt32(Counter);
Counter = Convert.ToString(CounterInt);

var FS:FileStream = new FileStream(FilePath, FileMode.Open, FileAccess.Write);
var Text:StreamWriter = new StreamWriter(FS);

Cookie = new HttpCookie("OldVisitor","true");
Cookie.Expires = DateTime.Now.AddSeconds(120);

return Counter;


You should now place the counter.aspx in your root folder (i.e. c:\InetPub\wwwroot) on your Internet Information Server. Also, create a file called counter.txt and set the read/write security options to full access for the user your are running under IIS. Open the counter.txt file, write a number (i.e. 999) and save the file.

When you now open the URL http://localhost/counter.aspx in your browser, you will see a text counter. The counter has already add one count to the number you put in counter.txt.

Now we want to replace the text counter with an image that we will create on the fly. Add the following code to counter.aspx before the "Response.Write(getCounter());" line:

function drawCounter()
var height:int=20;
var width:int=60;

var bmp:Bitmap = new Bitmap(width, height);
var img:Graphics = Graphics.FromImage(bmp);

var white:SolidBrush = new SolidBrush(Color.White);
var black:SolidBrush = new SolidBrush(Color.Black);

var CurrentCounter:String = getCounter();

var CounterFont:Font = new Font("Arial", 8, FontStyle.Bold);
var Text:SizeF = img.MeasureString(CurrentCounter,CounterFont);

img.FillRectangle(black, 0, 0, width, height);
img.DrawString(CurrentCounter, CounterFont, white ,(bmp.Width)-((Text.Width)+5),3);

bmp.Save(Response.OutputStream, ImageFormat.Jpeg);


Also, add the following namespaces to the namespace declarations at the beginning of the file:

<%@ Import namespace="System.Drawing" %>
<%@ Import namespace="System.Drawing.Imaging" %>
<%@ Import namespace="System.Drawing.Drawing2D" %>

And finally, replace "Response.Write(getCounter());" with "drawCounter();". Go back to your browser and refresh the page. You will see a graphical counter that increments when any new visitor comes to the page.
blog comments powered by Disqus

- How Caching Means More Ca-ching, Part 2
- How Caching Means More Ca-ching, Part 1
- Reading a Delimited File Using ASP.Net and V...
- What is .Net and Where is ASP.NET?
- An Object Driven Interface with .Net
- Create Your Own Guestbook In ASP.NET
- HTTP File Download Without User Interaction ...
- Dynamically Using Methods in ASP.NET
- Changing the Page Size Interactively in a Da...
- XML Serialization in ASP.NET
- Using Objects in ASP.NET: Part 1/2
- IE Web Controls in VB.NET
- Class Frameworks in VB .NET
- Cryptographic Objects in C#: Part 1
- Sample Chapter: Pure ASP.Net

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials