SAMPLE: TreeViewWrapper.exe Provides Another Option to ImageList and Inline Data in Internet Explorer (320868)

MORE INFORMATION

The following file is available for download from the Microsoft Download Center:
Release Date: September 9, 2002

For additional information about how to download Microsoft Support files, click the following article number to view the article in the Microsoft Knowledge Base: Microsoft scanned this file for viruses. Microsoft used the most current virus-detection software that was available on the date that the file was posted. The file is stored on security-enhanced servers that help to prevent any unauthorized changes to the file. The TreeViewWrapper.exe file contains the following files:

File name	Size
Images.xml	1 KB
picture.bmp	406 bytes
picture2.bmp	406 bytes
picture3.bmp	406 bytes
TreeViewWrapper.CAB	16 KB
TreeViewWrapper.exp	2 KB
TreeViewWrapper.HTM	2 KB
TreeViewWrapper.lib	3 KB
TreeViewWrapper.ocx	32 KB
TreeViewWrapper.PDM	4 KB
TreeViewWrapper.vbp	1 KB
TreeViewWrapper.vbw	1 KB
TreeViewWrapperCtl.ctl	7 KB

Q313675 Security Patch turns off a feature in Internet Explorer known as Inline Data, which permits base64-encoded binary data to be assigned to an ActiveX control. However, you may have written Web pages that use the TreeView control and the ImageList control as directed by the following article: In the sample, you can load the images of the ImageList control if you encode all images in base64, and then assign the string after that to the DATA attribute of the OBJECT tag of the ImageList. This procedure is the feature that is turned off by Q313675 Security Patch.

You can develop a control that encapsulates both the TreeView control and the ImageList control, and then loads the ImageList from an XML-based list of Uniform Resource Locator (URL) image references. The object requires that any script that is written against the raw TreeView control must be rewritten, but the required functionality of the TreeView is preserved, while the object also adheres to the new provisions that are introduced by the security patch.

Populate the ImageList from a List of URLs

While the DATA attribute permits the ImageList to be used in a Web page, the technique is cumbersome. You can populate the control if you use URL references instead of the base64-encoded image data. TreeViewWrapperProj.exe gives this capability. The LoadImages public method takes a reference to a simple XML document of the following format:

<Images>
	<Image Name="ImgH" Url="http://localhost/TreeViewWrapper/picture.bmp" />
	<Image Name="ImgG" Url="http://localhost/TreeViewWrapper/picture2.bmp" />
	<Image Name="ImgI" Url="http://localhost/TreeViewWrapper/picture3.bmp" />
</Images>
				

LoadImages iterates through these nodes, grabs each of the URLs, and then uses the built-in AsyncRead method of the UserControl to download each of the URLs one-by-one from the Web. The UserControl_AsyncReadComplete event handler responds to each completed download by adding the images to your encapsulated ImageList control. The UserControl_AsyncReadComplete event handler uses the Name attribute in the XML file as the image key:

Private Sub UserControl_AsyncReadComplete(AsyncProp As AsyncProperty)
    On Error GoTo ErrHandler
    
    ImageList1.ListImages.Add ImageList1.ListImages.Count + 1, _
           AsyncProp.PropertyName, AsyncProp.Value
    Exit Sub

    ' Report errors during dev. There is little end users can do with
    ' a failure here.
ErrHandler:
    Debug.Assert "AsyncReadComplete: Could not add image " & _
           AsyncProp.PropertyName & "; error is " & Err.Description
End Sub
				

Notice that, although the method that is used to download images in LoadImages is called AsyncRead, you use the AsyncReadOptions parameter to force synchronous image downloads:

        UserControl.AsyncRead imgUrl, vbAsyncTypePicture, imgName, _
           AsyncReadConstants.vbAsyncReadSynchronousDownload
				

You do this because the ImageList cannot be assigned to the TreeView until the TreeView has been populated with images. You can force a synchronous read, which is less cumbersome than if you use flags to test for the final AsyncReadComplete event.

Use TreeViewWrapper in a Web Page

After you build your control, you can host your control by using a simple object tag. Code in the onload event handler of the HTML file is used to load the ImageList from the XML file and to add nodes to the tree:

<HTML>
<HEAD>
	<TITLE>TreeViewWrapper.CAB</TITLE>

	<script language="jscript">

	function LoadTreeView()
	{
		tv1.LoadImages("http://localhost/TreeViewWrapper/images.xml");
		tv1.tvStyle = "TreelinesPictureText";
		tv1.AddNode("", 1, "Node1", "Top Node", "ImgH");
		tv1.AddNode("Node1", 4, "Node2", "Subnode 1", "ImgH");
		tv1.AddNode("Node1", 4, "Node3", "Subnode 2", "ImgI");
		tv1.AddNode("Node1", 4, "Node4", "Subnode 3", "ImgG");
	}			
						
	</script>
		
</HEAD>

<BODY onload="LoadTreeView();">
	<OBJECT ID="tv1"
             CLASSID="CLSID:6DFF1758-3C5B-4DAD-B6A9-E36654D17CBE"
             CODEBASE="TreeViewWrapper.CAB#version=1,0,0,2" VIEWASTEXT>
	</OBJECT>
</BODY>
</HTML>
				

Deploy TreeViewWrapper to Client Machines

The sample page that is included in this project works on a development computer or a computer where TreeViewWrapper.ocx is manually registered by using Regsrv32.exe. To deploy the sample page to arbitrary clients, you must use the Visual Basic Package and Deployment Wizard (PDW) to create a .cab file. You can then reference that .cab file in your CODEBASE attribute of the OBJECT tag. Note that you must modify both the Images.xml file and the tv1.LoadImages(...) method to point to the appropriate file path.