Storing New Comments | Java After Hours: 10 Projects Youll Never Do at Work

If the t parameter is not set to "1", chat.html may be trying to tell you that the user is sending you new comments. The text field you see in Figure 5.1 is named text1, and the text area is named textarea1. If there is already text in those two controls, you should store the user's new comments from the text area in the text0 tHRough text7 strings. You can start by recovering all the current user comments:

 <% } else{     if(request.getParameter("textarea1") != null){         String name = request.getParameter("text1");     String text0 = (String) application.getAttribute("text0");     String text1 = (String) application.getAttribute("text1");     String text2 = (String) application.getAttribute("text2");     String text3 = (String) application.getAttribute("text3");     String text4 = (String) application.getAttribute("text4");     String text5 = (String) application.getAttribute("text5");     String text6 = (String) application.getAttribute("text6");     String text7 = (String) application.getAttribute("text7");         .         .         .

Now you've got to push the new user comments onto the text0 through text7 "stack." You do that by getting rid of the current text in text7 and moving all the other comments up by one place (text6 becomes text7, text5 becomes text6, and so on). The text in the text area that the user is submitting to chat.jsp is then stored in text0 (note that the code also adds the user's name in bold in front of his comments to make it clear who said what):

 <% } else{     if(request.getParameter("textarea1") != null){         String name = request.getParameter("text1");     String text0 = (String) application.getAttribute("text0");     String text1 = (String) application.getAttribute("text1");     String text2 = (String) application.getAttribute("text2");     String text3 = (String) application.getAttribute("text3");     String text4 = (String) application.getAttribute("text4");     String text5 = (String) application.getAttribute("text5");     String text6 = (String) application.getAttribute("text6");     String text7 = (String) application.getAttribute("text7");     application.setAttribute("text7", text6);     application.setAttribute("text6", text5);     application.setAttribute("text5", text4);     application.setAttribute("text4", text3);     application.setAttribute("text3", text2);     application.setAttribute("text2", text1);     application.setAttribute("text1", text0);     application.setAttribute("text0", "<B>" + name + ":</B> " +         request.getParameter("textarea1"));     }         .         .         .

That stores the user's new comments, which will be displayed the next time any user's chat.html asks chat.jsp for the current comments.

Next, you've got to re-create the contents of the bottom frame in chat.htmlnamely, the text area for the user's comments and the text field containing the user's name, or "Guest" if the user hasn't entered a name. Here's how you create the text field that holds the user's name if he has supplied one (or "Guest" otherwise):

 %>     <HTML>         <HEAD>         </HEAD>         <BODY>             <FORM NAME="form1" METHOD="POST">                 <CENTER>                     Your name: <%     if(request.getParameter("text1") != null){  %>                     <INPUT TYPE="TEXT" NAME="text1"                     VALUE=<%                     out.println(request.getParameter("text1")); %>                     ></INPUT> <%     }     else{ %>                     <INPUT TYPE="TEXT" NAME="text1" VALUE="Guest">                     </INPUT> <%     } %>     .     .     .

What about creating the text area that you see at the bottom of Figure 5.1, which lets the users enter their comments? That's an HTML text area control, four rows high, 60 columns wide. After adding that to the form in the bottom frame, you also add the Submit button (note that there's no space between the opening and closing <TEXTAREA> tag to make sure that the text area doesn't have anything in it when it appears):

             <BR>             <TEXTAREA NAME="textarea1"             ROWS="4" COLS="60"></TEXTAREA>             <BR>             <INPUT TYPE="SUBMIT" VALUE="Submit">         </CENTER>     </FORM> . . .

Here's one more detailafter the user types his comment and clicks the Submit button to send it to the server, the page reappears with the cleared text area. But the text area no longer has the focus (that is, it's no longer the target of keyboard events), so the user has to click the text area to enter more comments. To spare the user the trouble, you can add a little JavaScript to the page in the bottom frame that gives the focus to the text area automatically when the page appears:

                     <BR>                     <TEXTAREA NAME="textarea1"                     ROWS="4" COLS="60"></TEXTAREA>                     <BR>                     <INPUT TYPE="SUBMIT" VALUE="Submit">                 </CENTER>             </FORM>             <script language="javascript">                 document.form1.textarea1.focus()             </script>         </BODY>     </HTML> <%     } %>

And that's itthat completes the Chat application. After installing chat.jsp and chat.html in the chat directory of a JSP-enabled web server, you can navigate to chat.html (that's http://localhost:8080/chat/chat.html if you're using Tomcat on your own machine, as detailed in this chapter), and you'll see the page shown in Figure 5.11.

Figure 5.11. Starting the Chat project.

You can enter your name and type comments in the text area. After clicking the Submit button, those comments will appear in the main page, as you see in Figure 5.12.

Figure 5.12. Entering text in the chat project.

If other users navigate to the same URL, they can also enter the chat, as you see in Figure 5.13.

Figure 5.13. Others users can also enter text in the Chat project.

NOTE

You can download the complete source code for the Chat projectchat.html and chat.jspat the Sams website. After placing these files in the chat directory on your web server, as detailed in the beginning of the chapter, navigate to chat.html to start the Chat project.