[Previous] [Table of Contents] [Next]

# Using Internet Explorer to Create an About Dialog Box

In previous chapters, you learned how to show simple dialog boxes in JScript and VBScript using methods such as Echo and Popup. But unfortunately, these dialog boxes don't allow you to show lengthy text (that can be scrolled) or add such features as hyperlinks and icons. In Chapter 8, you learned a technique for accessing Internet Explorer from a WSH script. In this chapter, you'll learn how to create and display forms using Internet Explorer as a front end, but let's first look at a simpler example. We'll use Internet Explorer and an HTML file to create a simple About dialog box that needs no user input. Within the HTML file, you can add any features that you want.

## Using the showModalDialog Method to Display an HTML File

You can use Internet Explorer's showModalDialog method to display an HTML file. This method, which is exposed from the window object, creates a simple dialog box that displays the content of an HTML file. Listing 9-1 shows a simple HTML file that contains script code to load a second HTML file and display its content as a dialog box. (This sample and the others in this chapter are in the \WSHDevGuide\Chapter09 folder on the book's companion CD.)

Listing 9-1 Test.htm

    <html>
        <script>
            function init()
            {
                window.showModalDialog("Test1.htm");
            }
        </script>
        <body onload="init()">
        </body>
    </html>

The script in the HTML page contains the init function, which uses a showModalDialog call. The window object is exposed automatically from Internet Explorer. The showModalDialog method requires a path to an HTML file, which is displayed in a modal dialog box. (A modal dialog box is a dialog box that must be dismissed before switching back to the main application.) The HTML file displayed in the modal dialog box can contain any valid HTML content.

> NOTE

> If the path to the second HTML file is missing, the browser searches the directory from the parent HTML document that was loaded for the given file name.

Listing 9-2 shows HTML code for creating the content of the About dialog box.

Listing 9-2 About.htm

    <html>
        <head>
            <meta http-equiv="Content-Type"
                  content="text/html; charset=ISO-8859-1">
            <meta name="GENERATOR"
                  content="Microsoft FrontPage Express 2.0">
            <title>About dialog</title>
        </head>

        <body bgcolor="#FEFFE8" bgproperties="fixed">
            <h2 align="center">About WSH Scripting Tools</h2>
            <p align="center">
                <a href="http://www.borncity.de">
                    <font size="2">
                        by G. Born
                    </font>
                </a>
            </p>
            <p align="center">
                <font size="2">
                    <img src="Line.gif" width="472" height="26">
                </font>
            </p>
            <h2 align="center">Help</h2>
            <p align="center">
                <strong>
                    Sorry, we are (still) thinking
                </strong>
            </p>
            <p align="center">
                <font size="2">try: </font>
                <a href="http://msdn.microsoft.com">
                    <font size="2">msdn.microsoft.com/scripting</font>
                </a>
                <font size="2"> instead</font>
            </p>
            <form>
                <p align="center">
                    <input type="button" name="B1"
                           value="Close" onclick="window.close()">
                </p>
            </form>
        </body>
    </html>

The HTML code in Listing 9-2 creates the dialog box shown in Figure 9-1. The <title> tag defines the first part of the title text. Other tags create the static title bar text. The About dialog box contains hyperlinks that are inserted into the document using the <a> tag. The graphical line is inserted using the <img> tag.

Figure 9-1 An About dialog box in Internet Explorer

## Displaying the About Dialog Box Using VBScript

I wrote a short script in VBScript to access the showModalDialog method from a WSH script without displaying the Internet Explorer window. As you learned in previous chapters, you invoke Internet Explorer using the following statements:

    Set oIE = WScript.CreateObject("InternetExplorer.Application")
    oIE.Navigate "about:blank"  ' Empty document

    Do While (oIE.Busy)  ' Important: wait until Internet Explorer is ready.
        WScript.Sleep 200
    Loop

The WScript.Sleep statement within the loop suspends the script for 200 milliseconds during each pass. This lowers the CPU load (as I'll discuss in Chapter 13).

Because the browser window is hidden, you need only fetch the object reference and set the Navigate property to a blank document window. The Visible property of the Internet Explorer Application object is left at the default of 0 (invisible). When the browser is ready, the showModalDialog method is called with the following code:

    oIE.Document.Script.showModalDialog path & "About.hta"

The showModalDialog method is a method of Internet Explorer's Script object, which is contained in the Document object of the Application object. To access the method, the script must build the object path from Internet Explorer's Application object to the Script object. The object variable oIE still contains a reference to the Application object. Therefore, you simply append the Document.Script object names and the showModalDialog method name to the oIE object variable name. The method requires the path to the HTML document as a parameter. (As an optional parameter, you can pass the width and/or height of the dialog box.)

The script can pass an absolute path (such as "C:\Test\About.hta") in the URL to the method. If the user moves the HTML file to another folder or drive, the WSH script fails with a run-time error. A much better approach is to store the HTML document in the same folder as the WSH script. Then you can determine the path of the HTML document by retrieving the path of the WSH script. The user can thus move the files to other folders as long as the HTML file is in the WSH script's folder. You can determine the script's path by using these two VBScript statements:

    path = WScript.ScriptFullName
    path = Left(path, InStrRev(path, "\"))

The first statement reads the path and the script filename using the ScriptFullName property of the WScript object. You use the second line with the InStrRev function to search the string in reverse, from the last character to the first occurrence of \. If this character is found, the substring from the first character to the current position in the string is derived using the Left function. The function requires the string and a pointer to the last valid character in the string. The position of the last valid character is returned from the InStrRev function. The filename is stripped from the string and the result is assigned to the path variable. The advantage of using showModalDialog is that after the method call, the script pauses until the user closes the dialog box. The script uses the following command to display a message (which appears after the browser window is closed):

    WScript.Echo "Dialog box is closed"
    oIE.Quit             ' Close Internet Explorer.

Using the browser's Quit method in the second line terminates the browser. Otherwise, an Internet Explorer instance will remain in memory until the script terminates. Listing 9-3 shows the complete code for using the showModalDialog method. (To use this sample with Internet Explorer 4, you must change the filename in the load command to About.htm.)

Listing 9-3 About.vbs

    '************************************************
    ' File:     About.vbs (WSH sample in VBScript)
    ' Author:   (c) G. Born
    '
    ' Using Internet Explorer 5 to display a modal
    ' About dialog box containing an HTML document.
    '************************************************
    Option Explicit

    Dim oIE           ' Internet Explorer object
    Dim path
    Dim Title

    ' Get path to the script file because the HTML
    ' document displayed in the dialog box must be
    ' located in the same folder.
    path = WScript.ScriptFullName
    path = Left(path, InStrRev(path, "\"))

    ' Launch Internet Explorer.
    Set oIE = WScript.CreateObject("InternetExplorer.Application")
    oIE.navigate "about:blank"  ' Empty document

    ' Window is hidden (default), so there's no need to set further
    ' window options.

    ' Important: wait until Internet Explorer is ready.
    Do While (oIE.Busy)
        WScript.Sleep 200      ' Suspend for 200 milliseconds.
    Loop

    ' Display the dialog box using showModalDialog.
    ' For Internet Explorer 4, change About.hta to About.htm.
    oIE.Document.Script.showModalDialog path & "About.hta"

    ' This message is displayed after the dialog box is closed.
    WScript.Echo "Dialog box is closed"

    ' Clean up.
    oIE.Quit             ' Close Internet Explorer.
    Set oIE = Nothing    ' Reset object variable.

    '*** End

## Displaying the About Dialog Box Using JScript

Porting the VBScript sample to JScript is fairly simple. Listing 9-4 shows the implementation details.

Listing 9-4 About.js

    //************************************************
    // File:    About.js (WSH sample in JScript)
    // Author:  (c) G. Born
    //
    // Using Internet Explorer 5 to display a modal
    // About dialog box containing an HTML document
    //************************************************

    // Get path to the script file because the HTML
    // document displayed in the dialog box must be
    // located in the same folder.
    var path = WScript.ScriptFullName;  // Script name
    path = path.substr(0, path.lastIndexOf("\\") + 1);

    // Launch Internet Explorer.
    var oIE = WScript.CreateObject("InternetExplorer.Application");
    oIE.navigate("about:blank");  // Empty document

    // Window is hidden (default), so there's no need to set further
    // window options.

    // Important: wait till IE is ready.
    while (oIE.Busy) {WScript.Sleep(200);}

    // Display the dialog box using showModalDialog.
    // For Internet Explorer 4, change About.hta to About.htm.
    oIE.Document.Script.showModalDialog(path + "About.hta");

    // This message is displayed after the dialog box is closed.
    WScript.Echo("Dialog box is closed");

    // Clean up.
    oIE.Quit();          // Close Internet Explorer.

    //*** End