=================================================
IE 5.5 Demos - ViewLink Element Behavior Calendar
=================================================
Last Updated: October 04, 2000
SUMMARY
========
Viewlink is a feature of element behaviors that enables you to write fully
encapsulated DHTML behaviors and import them as robust custom elements in a
Web page. Viewlinked document content, otherwise known as the document fragment,
renders and behaves as regular HTML content in the main Web page. Either binary
DHTML behaviors or scripted HTML Components (HTC) can be used to implement an
element behavior with a viewlink, but this overview focuses primarily on the use
of viewlink in scripted HTC files.
DETAILS
========
This sample uses a Calendar component implemented using two different variations: the
first is an element behavior and the second is an element behavior with a viewlink.
Although very similar in appearance and function, the Calendars illustrate some
interesting differences that result from Viewlinking an element behavior.
Each component has a button to display the HTML document tree, highlighting the difference
in primary document structure that results from each variation. In the element behavior
version, the primary document tree structure is considerably more complex than the viewlink
version. The primary document for the element behavior is filled with numerous elements
branching off from the custom element, whereas the viewlink version shows how the contents
of the document fragment have been encapsulated in the HTC file. The sample also illustrates
the difference in Cascading Style Sheets (CSS) inheritance for each variation. A button
applies a background style to the table elements in the primary document. When the style
is applied, elements inside the element behavior inherit the updated style property. This
result could be undesirable, depending on the requirements for the component. For the viewlink
version of the Calendar, applying the style in the primary document has no effect on the
rendering of the Calendar control.
USAGE
======
Creating a ViewLink:
--------------------
Before going through the basic steps to create a simple viewlink, it is worth taking a
quick look at the defaults object and its properties. This object is fundamental to
understanding how element behaviors make use of the viewlink feature. The defaults
object has several properties that are used in association with viewlink.
The defaults object is used to set and retrieve the default properties for element
behaviors, so it follows that viewLink is one of the properties of this object. A viewlink
is established for an element behavior when the viewLink property is set to an object
containing document content. The object that is assigned to the viewLink property is the
document fragment. By default, an element behavior does not have a viewlink defined, so
the initial value of the viewLink property is null.
The PUBLIC:DEFAULTS element is the declarative form of the defaults object. The attributes
supported by the PUBLIC:DEFAULTS element correspond to the properties collection of the
defaults; so either script or declarations can be used to set the defaults object properties.
The PUBLIC:DEFAULTS element is used in the component section of an HTC file, where the
initial properties of the defaults object can be set.
Three basic steps are required to create and implement an element behavior that uses a
viewlink:
- Create an element behavior.
- Define a viewlink.
- Import the HTC file in the primary document.
Each step is described in the following sections.
Creating an Element Behavior:
-----------------------------
Viewlink is a feature of element behaviors; therefore, the process of writing element
behaviors with or without a viewlink is quite similar. The process of creating an element
behavior is covered in detail in the Element Behaviors Overview.
Defining a ViewLink:
--------------------
A viewlink can be defined using script or by inserting the appropriate declaration in
the component section of the HTC file.
To set up a viewlink between a primary document and a document fragment using script,
the following statement can be used. This statement is placed within script located in
the HTC file, ideally the script block should be placed after the PUBLIC:COMPONENT element.
defaults.viewLink=document;
A viewlink can also be established using a declaration in the component definition. The
following example automatically links the root element of the document fragment in the
HTC file to the master element in the primary document.
<PUBLIC:DEFAULTS viewLinkContent/>
Importing the HTC file:
-----------------------
This section explains how to import an HTC file as an implementation of an element behavior
that uses viewlink. Importing a master element into the primary document is a trivial step,
but the master element itself deserves some commentary. The name of the master element is
declared in the HTC file using the tagName attribute in the PUBLIC:COMPONENT element, as
shown in the previous sample code snippet. The master element takes the namespace as its
prefix, followed by a colon (:), and then the tag name. As many master elements as necessary
can be included in the primary document.
A viewlink displays the document fragment in the primary document at the location of the
master element. The contents of the master element are not rendered in the primary document
unless the behavior fails to initialize. If the component initialization does fail, then
the contents of the master element are rendered instead of the document fragment. The
contents of the master element are available in script through the innerHTML and innerText
properties.
BROWSER/PLATFORM COMPATIBILITY
===============================
This element behavior sample is supported in Microsoft<66> Internet Explorer 5.5 or
later on the Microsoft Win32<33> platform.
SOURCE FILES
=============
Vlbuildtree.htc
Vlcalendar_vl.htc
Vlcalendarnv.htc
Vlcomparison.htm
Vlelementbehavior.htm
Vlviewlink.htm
SEE ALSO
=========
For more information on the defaults Object, go to:
http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/defaults.asp
For more information on the viewLink Property, go to:
http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/viewLink.asp
For more information on the PUBLIC:DEFAULTS Element, go to:
http://msdn.microsoft.com/workshop/components/htc/reference/elements/defaults.asp
For more information on Element Behaviors, go to:
http://msdn.microsoft.com/workshop/author/behaviors/overview/elementb_ovw.asp
For the HTC Reference, go to:
http://msdn.microsoft.com/workshop/components/htc/reference/htcref.asp
For information on DHTML Behaviors, go to:
http://msdn.microsoft.com/workshop/author/behaviors/overview.asp
==================================
Copyright (c) Microsoft Corporation. All rights reserved.
