Checking For and Embedding ActiveX Controls on Internet Explorer

Although IE does support plug-ins to a certain extent, its support for ActiveX controls is more complete. The main difference between an ActiveX control and a plug-in is how they are embedded into a page and how they are installed. Once they are embedded and installed, their use as far as scripting goes will be very similar to that for plug-ins.

ActiveX controls are a little like mini-programs, usually created in languages like C++ or Visual Basic. Unlike a normal program, like Notepad or Microsoft Word, ActiveX controls cannot run on their own; they need to be sited in a container program. Not all programs can act as containers for ActiveX controls, only those specifically designed to do so, such as Microsoft Access and, of course, Internet Explorer. When the creator of the ActiveX control compiles his code, he also assigns it a unique identification string that allows programmers like us to specify exactly which control we want to embed in our IE ActiveX container.

Adding an ActiveX Control to the Page

Adding an ActiveX control to a page for an IE browser requires the use of the <object> tag. Two very important attributes of the <object> tag are common to all controls, namely classid and codebase. The classid attribute is the unique id that the creator of the control gave to it when it was compiled. The codebase attribute gives a URL where the ActiveX control can be found—we'll look at this attribute in more detail in the next section.

How can we find out the classid? Well, one way to do this is by checking the documentation that came with the control or is available on the control creator's website. If we have the control installed, another way to do this is via IE itself, which will tell us which controls are installed on the computer and available to IE. Also, IE gives us additional information such as classid, though it won't inform us about any controls that were installed with the operating system. For example, Flash 3 is installed with Windows 98 and therefore won't appear.

To get this information, we need to open up IE and select Internet Options from the Tools menu as shown in Figure 15-4.

Figure 15-4

This opens up the console shown in Figure 15-5. In the Temporary Internet files area, click the Settings button.

Figure 15-5

In the next console that opens, click the View Objects button, as shown in Figure 15-6.

Figure 15-6

This will display a list of all the ActiveX controls IE has installed from the Internet. The list shown in Figure 15-7 will most likely be different from that on your own computer.

Figure 15-7

We can see lots of information about each control, such as when it was created and its version number. However, to find out the classid, we need to right-click on the name of the control we're interested in and select Properties from the menu that pops up.

The information shown in Figure 15-8 is displayed, though this may be slightly different on your system:

Figure 15-8

We can see that the classid attribute, listed as just "ID," and the codebase attribute, listed as "CodeBase," are both displayed, although for codebase you may need to click on the line and then scroll using the arrow keys to see all the information.

From this information, we see that to insert a Flash ActiveX control in our web page we need to add the following <object> tag:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
   id=flashPlayer1
   width=500
   height=100>
</object>

We can also set attribute or parameter values for the control itself. For example, with Flash we need to set the src attribute to point to the .swf file we want loaded, and we may also want to set the quality attribute, which determines the quality of appearance of the Flash movie. However, to set the parameters of the ActiveX control such as these (as opposed to the attributes of the <object> tag), we need to insert <param> tags in between the start <object> tag and the close </object> tag.

In each <param> tag we need to specify the name of the parameter we want to set and the value we want it set to. For example, if we wanted to set the src attribute to myFlashMovie.swf, we need to add a <param> tag like this:

<param name=src value="myFlashMovie.swf">

Let's add this to the full <object> tag definition and also define the quality attribute at the same time.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
   id=flashPlayer1
   width=500
   height=100>
      <param name=src value="myFlashMovie.swf">
      <param name=quality value=high>
</object>

Alternatively the movie parameter can be used instead of the src param.

Installing an ActiveX Control

We've seen how to insert an ActiveX control into our page, but what happens if the user doesn't have that control installed on her computer?

This is where the codebase attribute of the <object> tag comes in. If the browser finds that the ActiveX control is not installed on the user's computer, it will try to download and install the control from the URL pointed to by the codebase attribute.

The creator of the ActiveX control will usually have a URL that we can use as a value for the codebase attribute. The information under the Internet Options option of the Tools menu we saw earlier provides the codebase for the control that was installed on your computer, though this may not necessarily be the best URL to use, particularly if it's not a link to the creator of the control.

For Flash, the codebase is http://download.macromedia.com/ pub/shockwave/cabs/flash/swflash.cab#version=7,0,14,0, so our <object> tag will look like this:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave
/cabs/flash/swflash.cab#version=7,0,14,0"
   id=flashPlayer1
   width=500
   height=100 >
      <param name=src value="myFlashMovie.swf">
      <param name=quality value=high>
</object>

Subject to license agreements, you may be able to download the .cab file that installs the control to your own server and point the codebase attribute to that. The version=7,0,14,0 defines the version of FlashPlayer to be installed, 7,0,14,0 being the current latest version.

Unfortunately, there is no easy foolproof way of checking which ActiveX controls are installed on the user's computer. However, the Object object of the <object> tag does have the readyState property. This returns 0, 1, or 4, indicating the object's operational status. The possible values are

0—Control is un-initialized and not ready for use.
1—Control is still loading.
4—Control is loaded and ready for use.

We need to give the control time to load before checking its readyState property, so any checking is best left until the window's onload event handler or even the document object's onreadystatechange event handler has fired.

To redirect the user to another page that doesn't need the control, we need to write

if (myControl.readyState == 0)
{
   window.location.replace("NoControlPage.htm");
}

and attach this code to the window's onload event handler.

We saw that the <noembed> tag allows us to display a message for users with browsers not supporting plug-ins. This tag works in exactly the same way with IE. Alternatively, you can place text in between the <object> and </object> tags, in which case it will only be displayed if the browser is not able to display the ActiveX control.