Home

ASP ADVANCED

In this section and the next, you learn how to create two Active Server Pages projects by using the Application object--a chat page and a real-time Web site statistics program.  These projects are intended to illustrate some of the topics discussed in this chapter, but I hope that you'll also find them useful for your Web site.

The best way to attract users back to your Web site again and again is to create a sense of community.  One of the best ways to create a sense of community is to come up with a way for users to interact.  The chat page will do this.

The chat page discussed in this section allows real-time interaction between multiple participants.  All the users who request the page can view the messages entered by others.  Furthermore, they can add their own messages.

You need to create three files to create the chat page.  The following list is an overview of the files that need to be created or modified in this project:

  • The chat page.  The chat page will have two frames; the top frame will display messages from other users and the bottom frame will allow new messages to be entered.

  • The display page.  This page will display all the messages entered by other users.  Every five seconds or so, the contents of the frame will be updated with new messages.

  • The message page.  This page will allow a user to enter a new message.  It contains a single text input box.

  • The Global.asa file.  The Application_OnStart script will be modified.

Creating the Chat Page

The first page that needs to be created is the chat page.  The only purpose of this page is to act as a container for the other two pages.  Because it doesn't contain any scripts, you should save it with the name ChatPage.htm, as shown in Listing below:--

<HTML>
<HEAD><TITLE> Chat Page </TITLE></HEAD>
<FRAMESET ROWS="*,100">
<FRAME SRC="Display.asp">
<FRAME SRC="Message.asp">
</FRAMESET>
</HTML>

Why create frames at all?  Because the display page is automatically refreshed every five seconds, a separate page is needed to enter new messages.  Otherwise, the page might refresh when a user has entered only half a message (which would be irritating).

Modifying the Global.asa File

For the chat page to work, the Global.asa file must be modified.  The following script is used to initialize the application variables needed for the chat page.  The variables must be application variables so they can be accessed by all users.  The first application variable is named Talk.  It's an array that holds all the messages.  The Talk array is created by assigning the TempArray to it. The second application variable is named TPlace (talk place).  It's used to point to the current message in the Talk array.  The following script initializes this variable to zero:

<SCRIPT LANGUAGE=VBscript RUNAT=Server>
SUB Application_OnStart
Dim TempArray(5)
Application("Talk")=TempArray
Application("TPlace")=0
END SUB
</SCRIPT>

Creating the Message Page

The purpose of the message page is to allow a user to enter a new message. The page includes an HTML form with a text input box and a submit button.  When the submit button is clicked, the page reloads itself.

The script does two things.  First, it checks whether there are more than four messages.  If there are more than four messages, the application variable TPlace is reinitialized to zero.  This prevents the Talk array from overflowing with too many messages.

Next, the script adds a new message to the Talk array and increments TPlace.  TPlace will always point to the next place in the Talk array where a message can be entered.

Listing below shows the content of the message page.

<%
IF not Request.Form("message")=" " THEN
Application.LOCK
IF Application("TPlace")>4 THEN
Application("TPlace")=0
END IF
TempArray=Application("Talk")
TempArray(Application("TPLACE"))=Request.Form("Message")
Application("Talk")=TempArray
Application("TPlace")=Application("TPlace")+1
Application.Unlock
END IF
%>
<HTML>
<HEAD><TITLE> Message Page </TITLE></HEAD>
<BODY BGCOLOR="LIGHTBLUE">
<FORM METHOD="POST" ACTION="message.asp">
<INPUT NAME="message" TYPE="TEXT" SIZE=50>
<INPUT TYPE="SUBMIT" VALUE="SEND">
</FORM>
</BODY>
</HTML>

Creating the Display Page

The final page that needs to be created is the display page.  This is the page where the messages from all the users are actually displayed.

The page automatically refreshes itself every five seconds.  It does this by using client-pull.  The HTML <META> tag contains the command to do this. (It adds a REFRESH header to the Active Server Page.)

The first script in the following page is used to identify the current page.  The full URL of the current page is retrieved from the ServerVariables collection and assigned to the variable named MySelf.MySelf is used with the <META> tag to indicate the page to be refreshed.

The main script is used to display the contents of the Talk array.  The FOR ...NEXT loop displays all the current messages.  Listing below shows the display page.

<%
MyServer=Request.ServerVariables("SERVER_NAME")
MyPath=Request.ServerVariables("SCRIPT_NAME")
MySelf="HTTP://"&MyServer&MyPath
%>
<HTML>
<HEAD>
<META HTTP-EQUIV="REFRESH" CONTENT="5;<%=MySelf%>">
<TITLE>Display Page</TITLE>
<HEAD>
<BODY>
<P ALIGN=RIGHT><%=NOW%></P>
<%
TempArray=Application("Talk")
FOR i=0 to Application("TPlace")-1
Response.Write("<P>"&Temparray(i))
NEXT
%>
</BODY>
</HTML>

Extending the Chat Page Project

There are a number of ways in which the chat page can be improved.  For example, the maximum number of messages that the chat page can display at one time is five.  This would be inadequate for heavy usage.  You can change the maximum number of messages by modifying the size of the TempArray in the Global.asa file and by modifying the number at which TPlace reinitializes in the message page.

The chat page allows you to enter messages that include HTML formatting.  However, it wouldn't be difficult to modify the message page to make this easier.  For example, you could have message-formatting check boxes that allow you to specify the font and color of a message.

Finally, the chat page doesn't associate usernames with their messages.  Again, this wouldn't be a difficult modification.  You can add a logon page before the chat page that requests the username.  This name can then be prefixed to all of the messages that the user sends.