Dynamic HTML Editing Component Sample Applications


August 14, 1998

The DHTML Editing Component SDK includes a variety of sample applications. You can use the sample applications to see the Editing Component in action and get ideas for your own application, and as tutorials that illustrate how to use both the DHTML Editing Component document object and ActiveX control.

All sample applications include both executable code and source code. The samples are installed in the directory called SAMPLES beneath the directory where the SDK was installed. In the SAMPLES directory are further directories, one for each standalone sample application, and another directory tree for the sample applications written as Web applications.

The following sections provide an overview of the sample applications. The Location column in the tables refers to a folder under your DHTML Editing Component SDK installation directory.

C++ Sample Applications

Location Run Description
\SAMPLES\CEdit CEdit.exe A fully functional MFC-based MDI application. CEdit illustrates how to use the DHTML Editing Component document object from C++. For more details, see the file CEdit.htm in the \SAMPLES\CEdit directory.

Visual Basic Sample Applications

Location Run Description
\SAMPLES\VBEdit Vbedit.exe

A simple HTML editor written in Visual Basic that uses the DHTML Editing control and that demonstrates how a host's user interface can be tightly integrated with the DHTML Editing control. The toolbars and menus in the VBEdit sample application are used to send commands to the DHTML Editing control; their state is updated based on events from the control. The VBEdit sample also demonstrates how a dynamic context menu can be implemented by a host.

Note   See the notes following this table for information about running this sample.

\SAMPLES\VBDOM VBDom.exe Demonstrates how to access the DHTML Editing control's document object model (DOM) using Visual Basic. The DOM is the primary API for modifying an HTML document using the DHTML Editing Component. This sample shows how to access the DOM's Document object using the control's DOM property; how to sync and respond to DOM events on selected document elements; how to determine the element directly under the selection point; and how to use the CSS object model to add style sheets dynamically.
\Samples\VBCommnt VBCommnt.exe Demonstrates how the document object model can be used to add sophisticated application functionality to a DHTML document. VBCommnt is a document annotation application that allows users to insert comments, suggestions, and corrections into a document in a way similar to Microsoft Word. Double-clicking a button on the toolbar inserts an annotation marker into the document and displays an annotation window in which the user can type text. Annotation windows can be moved and repositioned within the document. The annotation is closed by clicking on its close box, and reopened by clicking on the annotation markers in the document. Annotation windows can overlay each other; clicking an annotation window brings it in front of other annotation windows. The sample uses the DHTML Editing control and uses absolutely positioned elements, z-ordering, drag and drop, and the document object model to implement the annotation windows. Document events are handled by the host for such tasks as making portions of the annotation windows, such as the titlebar and status bar, read only.
\SAMPLES\HTMLDrop HTMLDrop.exe Shows how to build a toolbox in Visual Basic from which you can drag elements onto the control and position them within a document. The sample demonstrates how to use the CF_HTML Clipbard format to insert HTML into a document and how to use the AbsoluteDropMode property to position HTML elements that are dragged onto the document.

The Visual Basic samples require Visual Basic 5.0 or later to run. The Visual Basic sample executable files have been compiled with Visual Basic 5.0. If you are working with Visual Basic 6.0, you must recompile the samples before running them.

You can run the Visual Basic sample applications by loading the projects into Visual Basic and running the samples there. Alternatively, you can rebuild the sample .exe file and then run them. If you experience errors when trying to run the .exe files, open the sample application's Visual Basic project and recompile the sample.

Web-based Sample Applications

Location View in Internet Explorer Description
\SAMPLES\Web\HelloWld HelloWld.htm Hosts the DHTML Editing control on a Web page and demonstrates how to load HTML into the control either from memory, using the control's DocumentHTML property, or from the file system, using the control's common dialog support.
\Samples\Web\Toolbars\Doc tutorial.htm Illustrates how to create toolbars and menus, implemented completely in Dynamic HTML. Toolbars can look and act like Microsoft Office toolbars (the default), or can be changed. Several of the Web samples, such as WebEdit, use the Toolbars package to implement HTML editing applications within a Web page. The tutorial.htm file provides details about how the toolbars and menus are implemented.
\SAMPLES\Web\WebEdit Fulledit.htm and NoMenus.htm Shows how to implement an HTML editor on a Web page using the DHTML Editing control and the Toolbars package (see previous). This sample application has many of the component's editing commands available in a DHTML toolbar and a context menu.
\SAMPLES\Web\DOMUsage DOMUsage.htm Shows how to use the DHTML Editing Component to perform real-time document structure analysis. It also shows more ways to use the DOM, implementing character, word, sentence, image, and header counting and a document outline. The outline window is initially turned off; click the "Enable Outline" button at the bottom of the document to turn it on. To see document analysis results, type in new text or open an existing document. Note that the implementation of the outline is very simplistic and therefore can be slow.
\SAMPLES\Web\WebApp builded.htm Shows how to build a client/server Web application that uses the DHTML Editing control to edit documents from the Internet or intranet and post the results to a Web server. This demo shows one technique for using the component with documents that are stored on a Web server instead of the local file system. You will need to put this demo on a Web server to open files over your intranet.

Note   The WebApp sample application requires Microsoft Internet Information Server 4.0 to run correctly.

As a convenience for using the DHTMLEdit control in JavaScript and VBScript, the files DHTMLEd.js and DHTMLEd.vbs are provided in the \INC directory. You can include these files in your Web page with a <SCRIPT> tag, using syntax such as the following:

<SCRIPT LANGUAGE="JavaScript" SRC="\DHTMLEd\INC\DTHMLEd.js">

or

<SCRIPT LANGUAGE="VBScript" SRC="\DHTMLEd\INC\DTHMLEd.vbs">

By including these files, you can use symbolic constants as parameters for the control's ExecCommand method rather than using explict numeric values. Using DHTMLEd.js and DHTMLEd.vbs is highly recommended for future compatibility with the control's command set and dependent objects. See the FullEdit.htm file in the WebEdit sample application for an example of how to include this file in a Web page.

Back to top

© 1998 Microsoft Corporation. All rights reserved.