Obtaining the required source files

To create the Midnight Cookie Company application, you need the midnight.zip file, which contains the source files on which you build the application. The source files include the WEB-INF folder, which contains the classes, docs, tlds and lib folders that you will use in this tutorial.

1. In your file system, create a folder for the unzipped application files. From now on, we will refer to this folder as $UNZIPHOME.
2. Click here to download the file.
3. Use an application that unzips files to unzip the midnight.zip file to $UNZIPHOME.

$UNZIPHOME now has a WEB-INF folder, which contains the following files and folders:

File or Folder	Description
web.xml	Deployment descriptor for the web application.
classes	Contains the resource bundle property files that are used to internationalize the pages and contains the com/midnightcookies/taghandlers folder. The taghandlers folder contains the class files for the ContentHandler tag handler, the ButtonHandler tag handler, and the LinksHandler tag handler. The ContentHandler includes the contents of the specified JSP file. The ButtonHandler prints a submit button with a localized message. The LinksHandler displays a set of links, including a separator, from the tag attribute.
docs	Contains the header.jsp file, the index.jsp file, and the nonesuch.jsp file. During the tutorial, you will create the main.jsp page and place it in this folder. Also contains the cookies folder, which includes the CookieCutter.jsp file and the CookieMake.jsp file. During the tutorial, you will create the Tray.jsp page and place it in this folder. The about folder contains the about.jsp file, which outlines this web application's architecture.
lib	Contains the standard.jar file and the jstl.jar file. These two files contain the implementation for the JSTL. The standard.jar contains the TLDs and the tag handlers. The jstl.jar file contains other application program interfaces (APIs) that are needed.
tlds	Contains the proprietary midnight.tld.

Creating a web project from the provided source files

1. Choose File > New Project (Ctrl-Shift-N). Under Categories, select Web. Under Projects, select Web Project with Existing Sources. Click Next.
2. In Location, click Browse to select the web application's document root. The document root is $UNZIPHOME, the folder to which you unzipped the midnight.zip file.
3. In Project Name, type Midnight. Change the Project Location to any folder on your computer. From now on, we will refer to this folder as $PROJECTHOME. Notice that the Context Path is /Midnight. Click Next.
4. Click Finish. The IDE creates the $PROJECTHOME/Midnight project folder. The project folder contains all of your sources and project metadata, such as the project Ant script. The Midnight project opens in the IDE. You can view its logical structure in the Projects window and its file structure in the Files window.

Creating a front controller using a servlet

A front controller is responsible for routing incoming user requests and can enforce navigation in web applications. A front controller provides a single entry point through which requests for several resources in a web application pass. A front controller can reduce duplication of code in JSP pages, especially in cases where several resources require the same processing. For more information on front controllers, see the "Front Controllers" section of the Building Web Components programming series book, which is available on the documentation page of the Sun™ ONE Studio Developer Resources web site.

1. Expand the Midnight project node and the Source Packages node.
2. Right-click the com.midnightcookies package node and choose New > File/Folder. Under Categories, select Web. Under File Types, select Servlet. Click Next.
3. Enter FrontController in the Class Name text box and make sure that the com.midnightcookies package is selected in the Package drop-down. Click Next.
4. Change the value of the URL Mappings text box to the following:

    /docs/*, /

   Note that the "," in the line above is a delimiter between URL mappings. It enables you to create multiple URL mappings for each servlet.

5. Click Finish.

   FrontController.java opens in the Source Editor.

6. Expand the Web Pages node and the WEB-INF node. Double-click the web.xml node. The content of the deployment descriptor file, web.xml, is displayed in the Source Editor. Notice that the servlet mapping entries include the following mappings, which you defined in step 4 above:

   

   The servlet mapping "/docs/*" prevents the FrontController servlet from forwarding pages to itself, while the servlet mapping "/" gives the FrontController servlet a servlet mapping to handle a request such as http://hostname:portnumber/midnight/.

Adding the methods to process requests and to create a cookie

Now you will edit the FrontController.java file to include the logic needed to process the requests received by the web application. You will modify the processRequest method and create a new method called createCookie, which demonstrates how to create a cookie used in a web application.

1. In the Projects window, expand the FrontController.java node and the FrontController class node. The Fields node, Constructors node, Methods node, and Bean Patterns node are displayed.

2. Expand the Methods node and double-click the processRequest node. The Source Editor displays the processRequest method.

3. In the Source Editor, right-click the left margin and select Show Line Numbers from the contextual menu.
   
   
4. Replace the processRequest method (lines 39 through 54) with the following code.
   
   

   
    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
        String id = request.getRequestURI();
        id = id.substring(request.getContextPath().length());
        getServletContext().log
          ("Midnight Cookies FrontController received a request for " + id);
   
        // The page variable holds the path to the page that will be included
        // in the content area of the template page /WEB-INF/docs/main.jsp.
        // It is passed to the template in a request attribute.
        String page;
   
        // If no request is received or if the request received is
        // for the root, serve /WEB-INF/docs/index.jsp
        if (id == null || id.trim().equals("") || id.equals("/")){
            page = "/WEB-INF/docs/index.jsp";
        }
   
        // If a request received is for a file that does not end in
        // .jsp or .html, there was an error. Include the
        // error page (nonesuch.jsp) and set the nonesuch attribute with
        // the path requested.
        else if (!id.endsWith(".jsp") && !id.endsWith(".html")) {
            page = "/WEB-INF/docs/nonesuch.jsp";
            request.setAttribute("nonesuch", id);
        }
        else {
            page = "/WEB-INF".concat(id);
   
            if (id.equals("/docs/cookies/CookieMake.jsp")) {
                Cookie cookie = createCookie(request);
                if (cookie == null) {
                    page = "/WEB-INF/docs/cookies/CookieCutter.jsp";
                }
                else {
                    response.addCookie(cookie);
                    request.setAttribute("cookie", cookie);
                }
            }
        }
   
        request.setAttribute("page", page);
        try {
            request.getRequestDispatcher("/WEB-INF/docs/main.jsp").forward(request, response);
        }
        catch(Throwable t) {
            getServletContext().log(t.getMessage());
        }
    }
   

   Note: After you enter code (either by typing or copying and pasting) into the Source Editor, place the cursor in the Source Editor and press Ctrl-Shift-F to automatically reformat the code.

   The line with the call to the createCookie method is underlined and marked as an error, similar to the following illustration. This is because the method does not exist yet. You will create the createCookie method in the steps below.

   
   

   When you place the cursor over the error box (the small red square with a white cross in the left margin of the Source Editor), the IDE describes the error.

5. In the Source Editor, place the cursor just after the getServletInfo method near the bottom of the file.
   
   
6. Copy the the following code and paste it in the Source Editor to create the createCookie method.
   

       private Cookie createCookie(HttpServletRequest request) {
   
           String name = (String)request.getParameter("name");
           if (name == null || name.trim().equals("")) {
               request.setAttribute("noname", "noname");
               request.setAttribute("error", "true");
   	    return null;
           }
   
           String value = (String)request.getParameter("value");
           if (value == null || value.trim().equals("")) {
               request.setAttribute("novalue", "novalue");
               request.setAttribute("error", "true");
   	    return null;
           }
   
   	System.out.println(name);
   	System.out.println(value);
   
   	Cookie cookie = null;
   	try {
   	    cookie = new Cookie(name, value);
   	}
   	catch(IllegalArgumentException ex) {
   	    // Probably an illegal name
   	    ex.printStackTrace();
   	    request.setAttribute("error", "true");
   	    request.setAttribute("noname", "badname");
   	    return null;
   	}
   
   	String maxage = request.getParameter("maxage");
   	if (maxage != null && !maxage.trim().equals("")) {
   	    try {
   		cookie.setMaxAge(Integer.parseInt(maxage));
   	    }
   	    catch(NumberFormatException nfe) {
   		nfe.printStackTrace();
   		request.setAttribute("badnumber", "badnumber");
   		request.setAttribute("error", "true");
   		return null;
   	    }
   	}
   
   	String domain = request.getParameter("domain");
   	if (domain != null && !domain.trim().equals("")) {
   	    cookie.setDomain(domain);
   	}
   
   	String path = request.getParameter("path");
   	if (path != null && !path.trim().equals("")) {
   	    cookie.setPath(path);
   	}
   
   	String secure = request.getParameter("secure");
   	if (secure != null && secure.equals("on")) {
   	    cookie.setSecure(true);
   	} else {
   	    cookie.setSecure(false);
   	}
           return cookie;
       }
   
   

   Note: After you enter code (either by typing or copying and pasting) into the Source Editor, place the cursor in the Source Editor and press Ctrl-Shift-F to automatically reformat the code.

7. Press Ctrl-S to save the document. The asterisk in the file's tab in the Source Editor disappears. This asterisk appears whenever there are changes that have not been saved to disk.
   
   
8. In the Projects window, right-click the FrontController.java node and select Compile File to check that there were no errors introduced in the steps you have completed. The Output window displays messages from the compiler, including any errors. You can double-click the links in the error messages to locate the source of the error. Resolve all errors listed in the Output window before continuing with the tutorial.
   

Creating the JSP page that receives all the requests

The main.jsp page receives all the requests that the FrontController servlet processes. A dynamic include statement and a LinksHandler are used to create the page.

1. Right-click the Midnight project node and choose New > JSP, name the JavaServer Pages file main.

2. Click Browse, browse to the WEB-INF/docs folder, and select it. The WEB-INF/docs folderin should now be displayed in the Folder text box. Click Finish. main.jsp opens in the Source Editor.

3. In the Source Editor, replace the contents of the main.jsp file with the following code:

   
     <%@page contentType="text/html;charset=UTF-8"%>
     <%@page buffer="none"%>
     <%-- The <midnight:content/> tag which handles the contents section
     is simplistically implemented to use an include. Hence this page
     cannot be buffered --%>
   
     <%@taglib prefix="midnight" uri="/WEB-INF/tlds/midnight.tld"%>
   
     <html>
       <head><title>The Midnight Cookie Company</title></head>
       <body text="#996633" link="#cc6600" vlink="#993300" alink="#000000">
           <span font-style="sans-serif">
               <TABLE border="0">
   		<tr>
   		    <table border="0">
   			<tr><td width="80" height="100">&nbsp;</td>
   			    <td width="500" height="100"
   
   				text="#996633" bgcolor="#ffff99"
   				valign="center"halign="center">
   				<jsp:include page="/WEB-INF/docs/header.jsp"
   					     flush="true"/>
   			    </td>
   		        </tr>
   			<tr><td width="90" height="300"
   				text="#996633" bgcolor="#ffff99"
   				valign="top">
   				<midnight:links separator="<br>"/>
   			    </td>
   			    <td width="500" height="300"
   				valign="top"cellpadding="15"
   				cellspacing="15">
   				<midnight:content/>
   			    </td>
   		        </tr>
   		    </table>
   		</tr>
   		<tr><td width="580" height="50" text="#996633"
   			bgcolor="#ffff99" valign="top">
   			<midnight:links separator="|"/>
   		    </td>
   		</tr>
   	    </span>
   	</TABLE>
       </body>
     </html>
   
   

Note: After you enter code (either by typing or copying and pasting) into the Source Editor, place the cursor in the Source Editor and press Ctrl-Shift-F to automatically reformat the code.

4. Press Ctrl-S to save your changes.
   
   

Creating the parameter files used to handle user input

The parameter files that you create in this section illustrate the use of tags from tag libraries to handle internationalization. They also show how input is passed through the Request parameters, specifically through the JSP expression language (EL) expression ${param.input}, which is set in the input field of the Input.jsp page.

1. Right-click the docs node and select New > Folder from the contextual menu. Type parameters in the Name text field and click Finish. The new parameters folder appears in the Projects window under the docs node.

2. Right-click the parameters node and choose New > JSP. Notice how JSP appears on the New menu. This is because the New menu includes your most recent choices. Type Input in the JSP File Name text field and make sure that WEB-INF/docs/parameters is selected in the Folder text box. Click Finish. Input.jsp opens in the Source Editor.

3. In the Source Editor, replace the contents of the Input.jsp file with the following code:

   
     <%@page contentType="text/html;charset=UTF-8"%>
     <%@taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
     <%@taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
     <%@taglib prefix="midnight" uri="/WEB-INF/tlds/midnight.tld"%>
   
     <fmt:setBundle basename="com.midnightcookies.Midnight" var="bundle"
   	       scope="page"/>
   
     <h3><fmt:message key="provide_input" bundle="${bundle}"/></h3>
     <form method="POST" action="Output.jsp">
           <table>
               <tr>
   		<td><fmt:message key="type_input" bundle="${bundle}"/>:<td>
   		<%-- The value of the Input field will be placed in a
   		      request parameter named "input" and it will be
   		      passed to Output.jsp --%>
   		<td><input type="text" size="20" name="input" value=""></td>
               </tr>
   	    <tr>
   		<td><fmt:message key="submit" bundle="${bundle}"
   		                 var="buttonLabel" scope="page"/>
                        <midnight:button/>
                   </td>
                   <td></td>
               </tr>
           </table>
     </form>
   
   

4. Press Ctrl-S to save your changes.
   
   
5. Create an Output.jsp file in the Parameters folder using the same method that you used to create the Input.jsp file.
   
   
6. In the Source Editor, replace the contents of the Output.jsp file with the following code:

   
     <%@page contentType="text/html;charset=UTF-8"%>
     <%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
     <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
   
     <fmt:setBundle basename="com.midnightcookies.Midnight" var="bundle" scope="page"/>
     <h3><fmt:message key="display_input" bundle="${bundle}"/></h3>
     <fmt:message key="datareceived" bundle="${bundle}"/>:
   
     <!--The following line gets the value of the request parameter named
     "input". This is a demo application. For security reasons, one should
     never echo user input without parsing first. -->
     <c:out value="${param.input}"/>
   
   

7. Press Ctrl-S to save your changes.

Using JSTL to handle internationalization

The Tray.jsp page that you create in this section illustrates the use of the JSTL, instead of scripting, to internationalize the page. The CookieCutter.jsp file, CookieMaker.jsp file, and resource bundle property files have been provided with the midnight.zip file. You can take a closer look at those files and the Tray.jsp file for examples of how internationalization is handled in this application.

1. Expand the docs node to expose the cookies node.
   
   
2. Create a Tray.jsp file in the cookies folder using the same method that you used to create the other JSP files. Make sure that you put it in the cookies folder.
   
   
3. In the Source Editor, replace the contents of the Tray.jsp file with the following code:

   
     <%@page contentType="text/html;charset=UTF-8"%>
     <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
     <%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
   
     <fmt:setBundle basename="com.midnightcookies.Midnight" var="bundle" scope="page"/>
     <h3><fmt:message key="cookies" bundle="${bundle}"/></h3>
   
     <table border="1">
        <tr>
           <th halign="center">#</th>
   	<th align="left">
   	    <fmt:message key="name" bundle="${bundle}"/>
           </th>
           <th align="left">
   	    <fmt:message key="value" bundle="${bundle}"/>
           </th>
        <tr>
        <%-- We have to use expression to get at an array.
             If we use ${cookie} then we get a map and
             the entries are not automatically cast --%>
        <% request.setAttribute("cookies", request.getCookies()); %>
        <c:set var="i" value="0"/>
   
        <c:forEach var="ck" items="${cookies}">
   	<c:set var="i" value="${i+1}"/>
   	<tr>
   	    <td><c:out value="${i}"/></td>
   	    <td><c:out value="${ck.name}"/></td>
   	    <td><c:out value="${ck.value}"/></td>
           </tr>
       </c:forEach>
     </table>
   
         

4. Press Ctrl-S to save your changes.

Wrapping up

Once you have completed the development stage as described above, the views in the Projects window and Files window should look as follows:

Running the application

This step shows you how to execute the web application using the bundled Tomcat web server. If the default web server has been changed, you can make Tomcat the default server for all web applications by following the steps in Setting the Default Web Server.

• In the Projects window, right-click the Midnight project node and choose Run Project from the contextual menu.

  A progress monitor window appears as the application is prepared and deployed to the web server.

  The web browser launches with the URL set to http://hostname:port/midnight. The following example shows the web browser running on a Microsoft Windows platform.

  

  If you receive an error while trying to execute this application, see Troubleshooting Execution Problems for some possible solutions.

  The HTTP Monitor appears by default when you run a web application. The following sections illustrate how you can use the HTTP Monitor to monitor requests, sessions, and cookies.

Monitoring requests and sessions

1. In the HTTP Monitor window, select the last entry under the Current Records node.

   The last entry represents the request for the midnight web application.

2. Select the Request tab and you see information similar to the following.

   

3. Select the Session tab and you see information similar to the following.
   
   
   
   
   
4. In your web browser, click the Parameters link to display the Input.jsp page.

   Your web browser displays information similar to the following.

   

5. In the Type Input text field, type hello and click Submit data.

Your web browser displays the contents of the Output.jsp page, similar to the following.



6. In the HTTP Monitor, select the last entry under the Current Records and select the Request tab.

   The HTTP Monitor displays information similar to the following.

   

Monitoring cookies

1. In your web browser, click the Cookies link.

Your web browser displays the CookieCutter.jsp page.

2. In the Name text field, type cookie, and in the Value text field, type chocolate.
   

   

3. Click "Make me a cookie now!".

   Your web browser displays information similar to the following.

   

4. In the HTTP Monitor, select the last entry under the Current Records node.

The Cookies tab in the HTTP Monitor displays information similar to the following.




5. In your web browser, click Cookie tray, and your web browser displays information similar to the following.
   
   



6. In the HTTP Monitor, select the last entry under the Current Records node and select the Cookies tab.

The HTTP Monitor displays information similar to the following.




7. Select the Request tab and the HTTP Monitor displays information similar to the following.

   
   

8. In the HTTP Monitor, right-click the same entry (GET Tray.jsp) under the Current Records node and choose Edit and Replay from the contextual menu. In the Edit and Replay dialog box, click the Cookies tab and click Add Cookie. Set the name to Ingredient and the value to Sugar. Click Send HTTP Request. The browser redisplays the page with the new cookie.
   
   

Monitoring requests for non-existent pages

1. In your web browser, type a URL for a page that does not exist to see how the nonesuch.jsp page is used. For example, you might type http://localhost:8084/Midnight/docs/Bake.jsp for the URL and your web browser displays something similar to the following.



2. In the HTTP Monitor, select the Request tab and you will see information similar to the following.



Notice that the content of nonesuch.jsp page is displayed in place of the non-existent Bake.jsp page.

Enabling internationalization

1. Modify the language preference used by your web browser to either French or Swedish in order to see the internationalization feature of this Midnight Cookie Company web application.

Note that you might have to add these two languages to the list of languages currently available to your web browser.

2. Reload or refresh the pages you have viewed in the previous steps.

   Notice how the links in the left navigation bar, the links on the bottom of the pages, and the contents of some of the application's JSP pages have been translated to the language you have chosen.

   The web application uses the resource bundle property files to help translate some of the pages used in this web application. So, the translation is only as extensive as the contents of the resource bundle property files.

You received an exception when the IDE tried to launch the browser you specified.

Check that the correct path is configured for the browser that you have specified to use with the IDE:

1. Select Tools > Options from the main window of the IDE.

2. Expand the IDE Configuration node and then expand Server and External Tool Settings.

3. Select Web Browsers.

4. Check that the correct path to your browser is set. If not, click on the browse button or type the correct path. If your default browser is Netscape 6.0 or 7.0, set the DDE Server property to have the value of NETSCAPE6.

You received a File Not Found error when attempting to display the JSP page.

If you set your web browser to use a proxy server, your web browser will attempt to route all files you want to view through the proxy server, including local files. You need to add localhost and your machine name to the list of bypassed hosts in your web browser's settings. For additional information, see the online help page entitled "Accessing Local Files Through a Proxy" in the core IDE help in the IDE. (Choose Help > Help Sets > Core IDE Help. From the Table of Contents. Expand the Configuring the Environment node and then the Using a Web Browser node.

You received a File not found error when you executed the web application.

Check the names of the JSP files you created in this tutorial. Make sure that you did not enter the .jsp file extension when you typed the name of the object in the New wizard. Rename the files, if necessary to do so.