Exercise 16 — Controlling the browser

The applet for this exercise controls the browser.

Applet

Note: In Netscape, sometimes the font of the label changes. This is a known problem with the Netscape 3.0 Java interpreter.

A title has a Show document Input port that causes it to tell the browser to load and display an HTML document from a specified URL. The thumbnail images in the sample applet use this port.

• Open the Hyperwire title Browsing.Ttl in the directory \Exercises\Ex16Work\.

This title has one decorative Image module and a couple of descriptive labels. It also has five Image modules that contain thumbnails you will use to control the browser.

1. Wire the Red House image's Button Up output port to the title's Show Document input port.

   Input and output ports for the title are located along the lower edge of the Wire view.

   

   After you choose the title's input port, it appears as another object in the Wire view.

   

   The Show Document input port requires one parameter. This is the URL of the page to load.

2. Double-click the wire to display the Wire Parameter editor. In the Wire editor, choose Constant as the parameter source, enter Ex16Media/hr.htm as the URL to display, and then click the "X=" button.

   

   Don't delete the "RelativeURL( ... )" text that must surround the URL itself.

You wire the other four thumbnail images in a similar way.

1. Wire the Menard Mansion thumbnail's Button Up output port directly to the Show Document input port.

   Once the input port object appears in the Wire view, you can wire directly to it and don't have to use the pop-up list at the bottom of the screen.

2. Use the Wire editor to set the URL for this wire to RelativeURL(Ex16Media/hm.htm).

3. Wire the remaining three thumbnails the way you wired the Menard Mansion thumbnail. Don't forget to include "Ex16Media/" when you enter the URL in the Wire editor.

   Tip:         By using the Edit button in the Wire editor, you can browse for the filenames instead of typing them in. Hyperwire sets the parameter to contain the relative path as well as the filename.

   The connections for all five thumbnails are as follows:

   Thumbnail	HTML document
   Red House	hy.htm
   Menard Mansion	hm.htm
   Coke Sign	ce.htm
   House Turret	tt.htm
   Yellow House	hy.htm

Because this applet controls the browser, it does nothing when you run it in the Java Applet Player that Hyperwire uses by default. To test it, you need to test it in a browser.

1. Choose File/Preferences.

2. [TAB] In the Run Title panel of the Preferences dialog, choose the browser you use from the Applet Viewer drop-down list, and then click OK.

   Now Hyperwire will run the title inside the browser instead of the usual Applet Player.

3.   Run the title.

   Hyperwire generates the HTML page Browsing.html for the applet, and displays this page using the browser you chose.

   Now when you click a thumbnail, the browser loads a page with a larger-scale image and a brief caption. Use the browser's Back control to return to the page with the applet.

Note: Another way to change pages in the browser is to use a System module and wire to its Show Document input port. This can be a good alternative if your title is in danger of becoming cluttered by lots of small port icons. Yet another way is to use a button instead of an image, and enter the page's URL in the button's Hyper-link property. This is the end of exercise 16. Exercise 17 shows how to publish a title as a stand-alone application instead of an applet.

Home | Previous | Next