Windows NT Internet and Intranet Development

To learn more about author Sanjaya Hettihewa, please visit the author's homepage.

Previous chapterNext chapterContents


- 27 -

Useful ActiveX Controls


In earlier chapters, you were shown how to develop interactive Web applications with ActiveX controls and ActiveX scripting. You were also shown how to use the Active Control Pad to add ActiveX controls to Web pages and use the Script wizard to link several ActiveX controls together and create interactive Web applications. ActiveX controls can be used to develop sophisticated and multimedia-rich Web pages.

This chapter demonstrates the versatility and power of ActiveX controls by demonstrating how several useful ActiveX controls can be linked together to create interactive and useful Web applications. Microsoft is aggressively porting ActiveX technology components to non-Microsoft platforms such as Macintosh and various flavors of UNIX. In addition to Internet Explorer, Netscape Navigator also supports ActiveX. Netscape announced its intent to support Microsoft's ActiveX technology, meaning that millions of users across various platforms and browsers will be able to experience the ActiveX-enhanced Web applications that you develop.

ActiveX-component developers have created thousands of ActiveX controls that can be used to create server-side and client-side Web applications. The purpose of this chapter is not to comprehensively cover dozens of ActiveX controls. Instead, you are shown practical uses of ActiveX controls and how ActiveX controls can be used to add a new level of interactivity to your Web pages. Visit Microsoft's Site Builder Workshop for information about ActiveX controls that can be used to develop compelling Web applications.


URL:Visit the Microsoft Site Builder Workshop to locate useful ActiveX controls and learn how they can be used to develop compelling Web applications.

http://www.microsoft.com/activex/gallery/

Microsoft ActiveX Image Control

Graphics images can be embedded into HTML Web pages. However, these images are static and cannot be dynamically changed while the user interacts with the Web page. For example, to change an image on a Web page, the entire Web page must be refreshed. This is a resource-intensive process, because several network connections must be established to refresh the Web page to change a single image on the page. The Microsoft ActiveX Image control can be used to add a new level of interactivity to images embedded in Web pages. For example, based on how the user interacts with elements of the Web page, certain graphics of the Web page can be changed without requiring the entire Web page to be reloaded.

The application in Listing 27.1 (and on the CD-ROM that accompanies this book) demonstrates how to use the ActiveX Image control. The user can select to view the weather in a certain city by using a command button. Figure 27.1 contains graphics of the weather information application.

Listing 27.1. Using the ActiveX Image control.

  1: <HTML>
  2:
  3: <HEAD>
  4: <TITLE>Welcome To The Weather Information Page!</TITLE>
  5: </HEAD>
  6:
  7: <BODY BGCOLOR="FFFFFF">
  8:
  9: <TABLE>
 10: <TR>
 11: <TD>
 12:     <OBJECT ID="WeatherImage" WIDTH=293 HEIGHT=267
 13:      CLASSID="CLSID:D4A97620-8E8F-11CF-93CD-00AA00C08FDF">
 14:         <PARAM NAME="BackColor" VALUE="16777215">
 15:         <PARAM NAME="BorderStyle" VALUE="0">
 16:         <PARAM NAME="SizeMode" VALUE="3">
 17:         <PARAM NAME="Size" VALUE="7761;7056">
 18:     </OBJECT>
 19: </TD>
 20: <TD>
 21:     <SCRIPT LANGUAGE="VBScript">
 22: <!--
 23: Sub DCButton_Click()
 24: WeatherImage.PicturePath = "DC.jpg"
 25: end sub
 26: -->
 27:     </SCRIPT>
 28:     <OBJECT ID="DCButton" WIDTH=269 HEIGHT=32
 29:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
 30:         <PARAM NAME="Caption" VALUE="How is the weather in Washington DC?">
 31:         <PARAM NAME="Size" VALUE="7112;846">
 32:         <PARAM NAME="FontName" VALUE="Arial">
 33:         <PARAM NAME="FontEffects" VALUE="1073741825">
 34:         <PARAM NAME="FontHeight" VALUE="200">
 35:         <PARAM NAME="FontCharSet" VALUE="0">
 36:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
 37:         <PARAM NAME="ParagraphAlign" VALUE="3">
 38:         <PARAM NAME="FontWeight" VALUE="700">
 39:     </OBJECT>
 40:     <SCRIPT LANGUAGE="VBScript">
 41: <!--
 42: Sub NYButton_Click()
 43: WeatherImage.PicturePath = "NY.jpg"
 44: end sub
 45: -->
 46:     </SCRIPT>
 47:     <OBJECT ID="NYButton" WIDTH=269 HEIGHT=32
 48:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
 49:         <PARAM NAME="Caption" VALUE="How is the weather in New York?">
 50:         <PARAM NAME="Size" VALUE="7112;846">
 51:         <PARAM NAME="FontName" VALUE="Arial">
 52:         <PARAM NAME="FontEffects" VALUE="1073741825">
 53:         <PARAM NAME="FontHeight" VALUE="200">
 54:         <PARAM NAME="FontCharSet" VALUE="0">
 55:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
 56:         <PARAM NAME="ParagraphAlign" VALUE="3">
 57:         <PARAM NAME="FontWeight" VALUE="700">
 58:     </OBJECT>
 59:     <SCRIPT LANGUAGE="VBScript">
 60: <!--
 61: Sub ChicagoButton_Click()
 62: WeatherImage.PicturePath = "Chicago.jpg"
 63: end sub
 64: -->
 65:     </SCRIPT>
 66:     <OBJECT ID="ChicagoButton" WIDTH=269 HEIGHT=32
 67:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
 68:         <PARAM NAME="Caption" VALUE="How is the weather in Chicago?">
 69:         <PARAM NAME="Size" VALUE="7112;846">
 70:         <PARAM NAME="FontName" VALUE="Arial">
 71:         <PARAM NAME="FontEffects" VALUE="1073741825">
 72:         <PARAM NAME="FontHeight" VALUE="200">
 73:         <PARAM NAME="FontCharSet" VALUE="0">
 74:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
 75:         <PARAM NAME="ParagraphAlign" VALUE="3">
 76:         <PARAM NAME="FontWeight" VALUE="700">
 77:     </OBJECT>
 78:     <SCRIPT LANGUAGE="VBScript">
 79: <!--
 80: Sub RedmondButton_Click()
 81: WeatherImage.PicturePath = "Redmond.jpg"
 82: end sub
 83: -->
 84:     </SCRIPT>
 85:     <OBJECT ID="RedmondButton" WIDTH=269 HEIGHT=32
 86:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
 87:         <PARAM NAME="Caption" VALUE="How is the weather in Redmond?">
 88:         <PARAM NAME="Size" VALUE="7112;846">
 89:         <PARAM NAME="FontName" VALUE="Arial">
 90:         <PARAM NAME="FontEffects" VALUE="1073741825">
 91:         <PARAM NAME="FontHeight" VALUE="200">
 92:         <PARAM NAME="FontCharSet" VALUE="0">
 93:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
 94:         <PARAM NAME="ParagraphAlign" VALUE="3">
 95:         <PARAM NAME="FontWeight" VALUE="700">
 96:     </OBJECT>
 97: </TD>
 98: </TR>
 99: </TABLE>
100:
101: </BODY>
102: </HTML> 

Figure 27.1. The weather information Web page.

When the weather information application is invoked, it looks like the Web page in Figure 27.2. Users select to view the weather in a certain city using one of the command buttons located on the right side of the page.

Figure 27.2. The weather information application.

The Washington, D.C. weather information image is displayed when a user clicks the How is the weather in Washington DC? button shown in Figure 27.3. When the D.C. weather information button is clicked, the VBScript statement in line 24 of Listing 27.1 displays the D.C. weather information graphic.

Figure 27.3. The weather in Washington, D.C.

The weather information graphic can be easily changed by selecting another command button, without requiring the entire Web page to be reloaded. When a user clicks the How is the weather in Redmond? button, the VBScript statement in line 81 of Listing 27.1 displays the Redmond weather information graphic, shown in Figure 27.4.

Figure 27.4. The weather in Redmond.

Microsoft Web Browser Control

The Microsoft Web Browser control can be used to browse objects of the user's computer as well as Web pages on the Internet. The Microsoft Web Browser control is a very versatile ActiveX control. The application in Listing 27.2 (as well as on the CD-ROM that accompanies this book) demonstrates some of the capabilities of the Web Browser ActiveX control. As Figures 27.5 and 27.6 show, a user can use the Web Browser ActiveX control to navigate files on his computer, as well as to navigate the Web.

Listing 27.2. Using the Microsoft Web Browser control.

 1: <HTML>
 2:
 3: <HEAD>
 4: <TITLE>Using The Web Browser Control</TITLE>
 5: </HEAD>
 6:
 7: <BODY BGCOLOR="FFFFFF">
 8:     <OBJECT ID="WebBrowserControl" WIDTH=600 HEIGHT=350
 9:      CLASSID="CLSID:EAB22AC3-30C1-11CF-A7EB-0000C05BAE0B">
10:         <PARAM NAME="Height" VALUE="600">
11:         <PARAM NAME="Width" VALUE="350">
12:         <PARAM NAME="AutoSize" VALUE="0">
13:         <PARAM NAME="ViewMode" VALUE="1">
14:         <PARAM NAME="AutoSizePercentage" VALUE="0">
15:         <PARAM NAME="AutoArrange" VALUE="1">
16:         <PARAM NAME="NoClientEdge" VALUE="1">
17:         <PARAM NAME="AlignLeft" VALUE="0">
18:     </OBJECT>
19:
20:     <SCRIPT LANGUAGE="VBScript">
21: <!--
22: Sub BrowseHardDriveButton_Click()
23:
24: WebBrowserControl.Navigate "C:"
25:
26: end sub
27: -->
28:     </SCRIPT>
29:
30:     <OBJECT ID="BrowseHardDriveButton" WIDTH=203 HEIGHT=27
31:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
32:         <PARAM NAME="Caption" VALUE="Browse Hard Drive (C:\)">
33:         <PARAM NAME="Size" VALUE="5366;709">
34:         <PARAM NAME="FontName" VALUE="Times New Roman">
35:         <PARAM NAME="FontEffects" VALUE="1073741825">
36:         <PARAM NAME="FontHeight" VALUE="200">
37:         <PARAM NAME="FontCharSet" VALUE="0">
38:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
39:         <PARAM NAME="ParagraphAlign" VALUE="3">
40:         <PARAM NAME="FontWeight" VALUE="700">
41:     </OBJECT>
42:
43:     <SCRIPT LANGUAGE="VBScript">
44: <!--
45: Sub BrowseLocalWebPageButton_Click()
46:
47: WebBrowserControl.Navigate "http://localhost/Sanjaya/"
48:
49: end sub
50: -->
51:     </SCRIPT>
52:
53:     <OBJECT ID="BrowseLocalWebPageButton" WIDTH=203 HEIGHT=27
54:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
55:         <PARAM NAME="Caption" VALUE="Browse A Predefined Web Page">
56:         <PARAM NAME="Size" VALUE="5366;709">
57:         <PARAM NAME="FontName" VALUE="Times New Roman">
58:         <PARAM NAME="FontEffects" VALUE="1073741825">
59:         <PARAM NAME="FontHeight" VALUE="200">
60:         <PARAM NAME="FontCharSet" VALUE="0">
61:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
62:         <PARAM NAME="ParagraphAlign" VALUE="3">
63:         <PARAM NAME="FontWeight" VALUE="700">
64:     </OBJECT>
65:
66:     <SCRIPT LANGUAGE="VBScript">
67: <!--
68: Sub BrowseURLButton_Click()
69:
70: Dim URLToNavigate
71:
72: URLToNavigate = InputBox ("Please enter a URL to browse")
73: WebBrowserControl.Navigate ( URLToNavigate )
74:
75: end sub
76: -->
77:     </SCRIPT>
78:
79:     <OBJECT ID="BrowseURLButton" WIDTH=203 HEIGHT=27
80:      CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
81:         <PARAM NAME="Caption" VALUE="Browse A Given URL">
82:         <PARAM NAME="Size" VALUE="5366;709">
83:         <PARAM NAME="FontName" VALUE="Times New Roman">
84:         <PARAM NAME="FontEffects" VALUE="1073741825">
85:         <PARAM NAME="FontHeight" VALUE="200">
86:         <PARAM NAME="FontCharSet" VALUE="0">
87:         <PARAM NAME="FontPitchAndFamily" VALUE="2">
88:         <PARAM NAME="ParagraphAlign" VALUE="3">
89:         <PARAM NAME="FontWeight" VALUE="700">
90:     </OBJECT>
91:
92: </BODY>
93: </HTML> 


Figure 27.5. The Web Browser control is used to browse files on the user's computer.

Figure 27.6. The Web browser control is used to browse the Web.


Summary

As demonstrated in the two VBScript applications in this chapter, powerful ActiveX controls can be used to develop multimedia-rich Web applications.


Previous chapterNext chapterContents


© Copyright, Macmillan Computer Publishing. All rights reserved.