Introduction

The WebObjects architecture lends itself to the creation of reusable components. You can design reusable components that display:

Custom configurations of images, input fields, or frames
The current number people that have visited a particular page
Your company's logo and current stock quote
A Java animation or VRML demonstration

The possibilities are endless.

With WebObjects, you design pages from static HTML elements and dynamic WebObjects elements. The HTML template for a page shows how these features are intermixed:

    <CENTER>
    <STRONG>Today's image:</STRONG> 
	<WEBOBJECT NAME=IMAGE></WEBOBJECT> 
    </CENTER>
    <WEBOBJECT NAME=FOOTER></WEBOBJECT>

The portions of the page marked by the WEBOBJECT tags derive their HTML values dynamically. When this page is requested, WebObjects consults the template's corresponding declarations file:

    IMAGE : WOImage {src = todaysImage;};
    FOOTER : Footer {date = now;};

The first declaration indicates that IMAGE is a WOImage that derives its image data from the invocation of the method todaysImage. WOImage is one of the fundamental dynamic elements that WebObjects defines. The declaration for FOOTER specifies an element that isn't one of WebObjects' fundamental types--it specifies a reusable component.

The Footer reusable component is stored in a directory (named "Footer.wo") that contains the same configuration of three files (template, declarations, and script files) as you would find for a WebObjects page. Here's what these files contain:

Footer Template File

    <WEBOBJECT NAME="DATE"></WEBOBJECT><BR>

Footer Declarations File

    DATE:WOString {value = formattedDate;};

Footer Script File

    id date;
    
    - formattedDate { 
	id head, tail;
    
	head = [date descriptionWithCalendarFormat:@"%m-%d-%Y"];
	tail = [date descriptionWithCalendarFormat:@"%H:%M:%S"];
	return [NSString stringWithFormat:@"%@ - %@\n", head, tail];
    }

As you can see, the Footer component is simply a string whose contents is dynamically set to be the current date and time.

Accessing a Reusable Component

The Footer component can be included on any page of an application simply by:

Adding the WEBOBJECTS tags to the page's HTML template file
Declaring the component in the page's declarations file
Installing the component directory where WebObjects can find it

WebObjects searches for a reusable component in these places and in this order:

The directory of the current page. For example, if the template, declarations, and script files for the current page are stored in Page5.wo, WebObjects will look for the component in the directory Page5.wo/Footer.wo.
The parent directory of the current page.
Within the WebObjects directory of the server's document root.

More Information

You've seen how a reusable component can be nested within a component that represents the page. It's possible for the nested, or child component, to invoke methods in its parent component. See Using the WOAction Object in Nested Components for more information. Many of the examples that accompany this version of WebObjects make extensive use of reusable components. See the CyberWind and Component examples in particular.