Listing 1: ProgressBar.cs

public class ProgressBar : System.Web.UI.Control, System.Web.UI.ICallbackEventHandler
{

     private int PercentCompleted
     {
	    get
	    {
	 if System.Web.HttpContext.Current.Session["PercentComplete"] == null)
	 {
		System.Web.HttpContext.Current.Session["PercentComplete"] = 1;
	 }
	 else
	 {
		System.Web.HttpContext.Current.Session["PercentComplete"] =
		  (int)System.Web.HttpContext.Current.Session["PercentComplete"] + 1;
	 }
	 return (int)System.Web.HttpContext.Current.Session["PercentComplete"];
	    }
	    set
	    {
	 System.Web.HttpContext.Current.Session["PercentComplete"] = 1;
	    }
     }
     public string RaiseCallbackEvent(string eventArguments)
     {
	    int percent = this.PercentCompleted;
	    if (percent > 100)
	    {
	 this.PercentCompleted = 1;
		return "completed";
	    }
	    else
	    {
	return percent.ToString() + "%";
	    }
     }

     protected override void OnPreRender(EventArgs e)
     {
	    this.Page.ClientScript.RegisterClientScriptBlock(typeof(ProgressBar),
		 "ProgressBar", this.GetClientSideScript(), true);
	    base.OnPreRender(e);
     }
     protected override void Render(HtmlTextWriter writer)
     {
	     System.Text.StringBuilder sb = new StringBuilder();

	     sb.Append(@"<table id=""ProgressBarContainer"" bgcolor=""LightSteelBlue""
		             border=""0"" width=""400"" style=""DISPLAY:none; POSITION: absolute;
					 Z-INDEX: 10"">");
    sb.Append(@"<tr><td colspan=""3"" style=""padding:3px 2px 2px 10px"">");
	     sb.Append(@"<font face=""Verdana, Arial, Helvetica, sans-serif"" size=""2"">");
	     sb.Append(@"<span id=""ProgressBarLabel"">Uploading...</span>");
	     sb.Append(@"</font></td></tr><tr><td>");
	     sb.Append(@"<font size=""1""> </font></td><td bgcolor=""#999999""
		  width=""100%"">");
             sb.Append(@"<table id=""ProgressBar"" border=""0"" width=""0""
			  cellspacing=""0"">");
	     sb.Append(@"<tr><td style=""background-image:url(progressbar.gif)"">
		 <font size=""1""> </font></td>");
	     sb.Append(@"</tr></table></td>");
	     sb.Append(@"<td><font size=""1""> </font></td></tr>");
	     sb.Append(@"<tr height=""5px""><td colspan=""3""></td></tr>");
	     sb.Append(@"</table>");

	     writer.Write(sb.ToString());
	     base.Render(writer);
     }
     private string GetClientSideScript()
     {
	     System.Reflection.Assembly dll =
		  System.Reflection.Assembly.GetExecutingAssembly();
	     StreamReader reader;
	     reader = new StreamReader(dll.GetManifestResourceStream("ProgressBar.txt"));
	     StringBuilder js = new StringBuilder(reader.ReadToEnd());
	     string fp = this.Page.ClientScript.GetCallbackEventReference(this, "", 
		 "UpdateProgressBar", "");
	     js.Replace("##InitiateCallBack##", fp);
	     reader.Close();
	     return js.ToString();

      }

}


Listing 2: ProgressBar.js

<script language="javascript">
	var isCompleted=false;

	// This function initiates the callback to the server
	function DrawProgressBar()
	{
            ##InitiateCallBack##;
            if (!isCompleted)
	     {
	window.setTimeout('DrawProgressBar()',200);
	     }
	     else
	     {
	isCompleted=false;
	document.getElementById("ProgressBarContainer").style.display = 'none';
	     }
	}
	// The following function gets called when thecallback is complete
	function UpdateProgressBar(percent)
	{
	      if (percent == 'completed')
	      {
		    isCompleted=true;
	      }
	      else
	      {
		    document.getElementById("ProgressBar").width = percent;
	      }
	}