The best way to start is from the beginning, so let’s start Visual Studio .Net and select “New Project.” Select a C# project type and the “ASP.NET Web Application” template from the dialog box. Afterwards type “HNAcme” (our sample project name) in the destination location. When Visual Studio .Net has completed the initialization of the new project, delete the WebForm1.aspx page that is automatically created; we won't be using it.
Consider that ACME Corp., our fictitious big company customer, must implement an intranet application that distributes 50 large human resources manuals, including supporting policies and procedures to an employee community of 30,000. It might be a library of over 3000 pages and 10,000 hypertext topics with supporting PDFs and forms, all hyperlinked together for easy navigation and access, and hypertext-oriented for fast search. We could not simply post renditions of documents for such an implementation.
The Hyper.Net web application we want to create in this example will make use of frames to provide a library-style presentation like MSDN, and will be “generic,” meaning it could be used by other departments for other types of documentation.
To begin, we want to split the page into 3 pieces. The left-top side will be dedicated to a search entry form, the left-bottom side will be dedicated to a navigation area, and the center area will be dedicated to displaying the Topic content. Within the center we will enable other controls like previous and next and the ancestor control, table of contents (TOC), Bookmarks and sub/related topics, to provide the user with a rich navigation experience.
Let’s create a start page that will contain the frames. To do so, create a new HTML page and name it “index.” Make sure it looks like the code in Code-Snippet 1.
Please note that the frames are making reference to three pages that we haven’t created yet. Before moving on to the design view of Index.htm, let’s create these ASPX pages without any code or controls to satisfy the reference. Name them: Search.htm, MSTreeView.aspx and Welcome.htm respectively.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<TITLE>Hyper.Net - ACME Corp.</TITLE>
<meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
</head>
<frameset cols="230,*" border="0" frameSpacing="0" frameBorder="0">
<frameset rows="45,*" border="0" frameSpacing="0" frameBorder="0">
<frame name="tabindex" src="Search.htm" scrolling="no">
<frame name="content" src="MSTreeView.aspx" scrolling="auto">
</frameset>
<frame name="main" src="welcome.htm" scrolling="auto">
<noframes>
<pre id="p2"></pre>
<p id="p1">
This HTML frameset displays multiple Web pages. To view this frameset, use a
Web browser that supports HTML 4.0 and later.
</p>
</noframes>
</frameset>
</html>
Code-Snippet 1 – Index.htm
Now let’s create the welcome.htm page that will help us to introduce our web application whenever it is invoked. In Visual Studio .Net go to the “Project” menu and select “Add HTML page…” and name it as just mentioned, and make sure the code looks like Code-Snippet 2.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<TITLE></TITLE>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 7.0">
</HEAD>
<BODY bgcolor="#01478e">
<P><FONT face="Verdana" size="6" color="#ffffff"><STRONG>WELCOME TO HNACME CORP.</STRONG></FONT></P>
<P> </P>
<P><FONT face="Verdana" size="2" color="#ffffff">This sample application will help you understand the concepts behind the use of the Hyper.Net Framework SDK.</FONT></P>
<P><FONT face="Verdana" size="2" color="#ffffff"></FONT> </P>
<P><FONT face="Verdana" color="#ffffff" size="2">You're welcome to <STRONG>explore/copy/modify</STRONG>this application.</FONT></P>
<P><FONT face="Verdana" color="#ffffff" size="2"></FONT> </P>
<P><FONT face="Verdana" color="#ffffff" size="2">Hyper.Net and Hyper.Net Framework SDK are trademarks of Coextant Systems International AG.</FONT><br>
<FONT face="Verdana" color="#ffffff" size="2">All rights reserverd ® 2002 - 2005</FONT></P>
<P><FONT color="#ffffff" size="2"><SPAN class="hnpara"><FONT face="Verdana"><SPAN class="TextEmph2"><SPAN class="hnoverride" style="FONT-SIZE: 9pt; FONT-FAMILY: 'Arial'"></SPAN></SPAN></FONT></SPAN></FONT> </P>
<P><FONT color="#ffffff" size="2"><SPAN class="hnpara"><FONT face="Verdana"><SPAN class="TextEmph2"><SPAN class="hnoverride" style="FONT-SIZE: 9pt; FONT-FAMILY: 'Arial'">Coextant Systems
International AG<BR></SPAN>
</SPAN>Schönbergstr. 45<BR>
73760 Ostfildern/Stuttgart<BR>
Germany<BR>
Tel: +49 (0)711 45 10 00 0<BR>
Fax: +49 (0)711 45 10 00 20<BR>
Mail: </FONT><A class="hnoutside" href="" target="_blank">
<FONT face="Verdana" color="#ffffff">
</FONT></A></SPAN></P>
</FONT>
</BODY>
</HTML>
Code-Snippet 2 – Welcome.htm