Working with Interfaces

For the sample application in this chapter you're going to work on writing an ASP.NET module. It's not going to be very elaborate, but it's going to be fun, and it's going to be true to real-world applications (no superhero applications for this chapter).

So what's an ASP.NET module? A module is a class that can intercept requests for any page in the application. Modules are used to do things like security checks. They can intercept every request and either stop the request, let the request continue, or change the request in some way. They can also optionally do something after the request page has had a chance to respond. If you've done a lot of Web programming, a module is the .NET equivalent of an IIS filter.

The ultimate goal of the module you're building is to provide each page with the dimensions of the browser's client area. The client area in the browser is the area where the Web page is displayed. (It's the inside of the browser, minus the menu bar or status bar.) It's interesting that .NET does not report these dimensions through any property. However, it's possible to obtain these measurements through client-side scripts (VBScript or JavaScript that runs on the client's machine and not on the server like ASP pages). And why do we care about these measurements, you may ask? Well, we care because sometimes it's useful to draw the page with smaller graphics if the browser window is small, and use larger graphics if the browser window is large.

To solve this problem the first time the client requests a page, the module is going to stop the request and return a page with client-side script that finds out the dimensions of the client area. The script records the dimensions in a hidden field and then immediately asks for the same page that the client first requested. The sending of the client-side script and the returning to the original page requested should happen quickly enough that it will end up being invisible. The second time the module gets a request for the same page (this time because of the client-side script requesting it), the module will detect the hidden field with the dimensions, and it will create a little object to hold the information and pass it to the page that was requested . The page can then grab the object with the information and return output to the client that takes advantage of knowing the client area's size. Our output page will just display the dimensions in text boxes.

To write a custom module:

1. Launch Visual Studio .NET. (Start > All Programs > Microsoft Visual Studio .NET > Microsoft Visual Studio .NET).

2. Select File > New > Project to bring up the New Project dialog.

3. Under Project Types on the left side of the New Project window click the Visual C# projects folder.

4. Select the ASP.NET Web Application icon and change the name of the application to interfacesproject ( Figure 8.1 ).

   Figure 8.1. To create a custom module we only need a library project and not a full ASP.NETWeb project. However, creating an ASP.NETWeb project gives us the chance to write and test the module all in one project.

   

5. Visual Studio will create a new project and open WebForm1.aspx.

6. Change the form's name to dimensions .aspx. Do so by choosing View > Solution Explorer from the top menu bar.

7. Right-click on dimensions.aspx and choose Properties. In the property grid below, change the FileName property from WebForm1.aspx to dimensions.aspx ( Figure 8.2 ).

   Figure 8.2. Changing the filename is probably old news by now.

   

8. Change the dimensions.aspx form so that it looks like the form in Figure 8.3 . Obviously this is a lot of work to do by hand. Instead you can enter the HTML directly into the editor. Figure 8.4 (on next page) shows the HTML necessary to create the form. To enter the HTML directly, click the HTML button under the editor's window. As an alternative you could download the skeleton file for this project (see Tips on the next page).

   Figure 8.3. This is an easy form to recreate from scratch. It's basically two label controls, two textboxes, and one link control.

   

   Figure 8.4 Having the HTML is good for reference purposes. With it you can see the dimension and position of each of the controls.

    <%@ Page language="c#"    Codebehind="dimensions.aspx.cs"    AutoEventWireup="false"    Inherits="interfacesproject.WebForm1" %> <HTML>    <HEAD>      <title>WebForm1</title>    </HEAD>    <body MS_POSITIONING="GridLayout">    <form id="Form1" method="post"    runat="server">    <  asp:label  id="lblWidth"      style="Z-INDEX: 101; LEFT: 25px;      POSITION: absolute; TOP: 37px"      runat="server">  Width:  </asp:label>    <  asp:label  id="lblHeight"      style="Z-INDEX: 102; LEFT: 29px;      POSITION: absolute; TOP: 70px"      runat="server">  Height:  </asp:label>    <  asp:textbox  id="txtWidth"      style="Z-INDEX: 103; LEFT: 84px;      POSITION: absolute; TOP: 36px"      runat="server">    </asp:textbox>    <  asp:textbox  id="txtHeight"      style="Z-INDEX: 104; LEFT: 84px;      POSITION: absolute; TOP: 68px"      runat="server">    </asp:textbox>    <  asp:hyperlink  id="lnkSelf"      style="Z-INDEX: 105; LEFT: 89px;      POSITION: absolute; TOP: 110px"      runat="server"      NavigateUrl="dimensions.aspx">  Refresh  </asp:hyperlink>    </form>    </body> </HTML> 

Tips

• Nothing in the sample so far has to do with a custom module. The form that you are designing in this section will be used to test the module. You'll add the code for the module as soon as you learn a little about implementing interfaces.

• As with any other project in this book, building the project isn't necessary for learning the concepts in this chapter.

• Skeletons for each project can be downloaded from Peachpit's Web site, http://www.peachpit.com/vqs/csharp.