Chapter 23

Java and Plug-Ins

• Adding Java to Your Pages
• Importing a Java Class File
• Inserting and Configuring a Java Applet
• Using Extended Applet Attributes
• Working with Netscape Plug-Ins
• Importing a Netscape Plug-In into Your Web
• Inserting a Netscape Plug-In into Your Page
• Using Extended Plug-In Attributes
• Inserting a PowerPoint Animation as a Plug-In
• Workshop Wrap-Up
  • Next Steps
  • Q&A

One of the hottest Web technologies is Java, a general-purpose programming language developed by Sun Microsystems. Java is a versatile programming language. Using it, you can write small programs, called applets, and attach them to your Web pages. These applets can do a wide variety of things, such as display multimedia elements, online games, and animation, process and display data, include an online chat on your site, and much more.

If you've been a part of the World Wide Web for a while, you also know that the most widely used browser is Netscape Navigator. When you use Netscape Navigator 2.0 or above, or a compatible browser such as Internet Explorer 3.0, you can use plug-ins to display multimedia elements, view documents in their native formats, add RealAudio files to your pages, and add a host of other features to your pages.

FrontPage 97 features built-in support for both of these Web technologies. Using new commands in the Insert menu, you can add Java applets and Netscape plug-ins to your pages very easily. This chapter will give you a couple of examples to follow.

Adding Java to Your Pages

You need a few things to include a Java applet on your page, one of the most important of which is the permission to use it. If you've written the applet yourself, permission is not an issue. If the applet was written by someone else, do some checking to see if you have permission to use an applet freely or to find the requirements for obtaining the rights to use it. Sometimes, the requirements are nothing more than providing a link to the author's site or including a mention of trademark or copyright information on your page. Other times, you must purchase the rights to use the applet.

Basically, a Java applet begins with source code, which is nothing more than a text file with a series of commands written in Java. Figure 23.1 shows an example of the source code written for the example used in this chapter. Many applications allow you to develop source code using point-and-click interfaces, including Sun Microsystem's Java Developer's Kit, Microsoft's Visual J++ (shown in Figure 23.1), and Kinetix Hyperwire (a division of Autodesk).

Figure 23.1 : You compile Java source code with a Java compiler.

This source code file isn't what you need to put on your web, however. After you develop the source code, it must be compiled into a Java class file, which combines the classes in your source file with the interpreter. You reference the path to this class file in the Java Applet Properties dialog box. Along with the class file, you need to know the path to any images, sounds, and other elements that are associated with the Java applet. Finally, you need to know which parameters you have to add to your Web pages. Many times, when you download a Java applet from the Web or use a sample provided with your Java compiler, the parameters and values you need to insert into your page are listed on a Web page, as shown in Figure 23.2.

Figure 23.2 : The parameters you need to insert in your Web page are sometimes indicated on Web pages provided with the sample applet.

When you insert a Java applet into your page, it is downloaded from the Web server to the user's computer. The user's browser interprets the class file and runs it on his or her computer.

Importing a Java Class File

For this simple example of how to add a Java applet to a page, I used one of Sun Microsystem's Java applet samples and imported the necessary files into my web. This sample is available in their Java Developer's Kit, as well as in Microsoft Visual J++. Called image tape (or scrolling images), the applet scrolls a series of small images across your screen.

For this applet, I created an images directory in my web. I also created a classes folder and imported the Java applet's class file into it.

After the source code was compiled into a class file, I imported Sun Microsystem's ImageTape applet as follows:

1. Open or create a web in the FrontPage Explorer. Select the home directory of your web from the All Folders list. Choose File | New | Folder to create a new folder named classes.
2. From the All Folders view, click the classes folder to select it.
3. Choose File | Import. The Import File to FrontPage Web dialog box appears.
4. Click Add File. The Add File to Import List dialog box appears.
5. Locate the folder in which the imagetape.class file appears, as shown in Figure 23.3. Highlight the file and click Open. You return to the Import File to FrontPage Web dialog box, and the class file appears in the Import list.
   Figure 23.3 : Use the Add File to Import List dialog box to add the class file to your current web.

6. Click OK to import the class file into your classes directory.
7. From the All Folders view, select the images folder in your web. (This folder is created automatically when you create a new web.) Choose File | Import.
8. From the Import File to FrontPage Web dialog box, click the Add File button. Locate the images\team folder for the ImageTape applet. Highlight T1.gif through T15.gif, as shown in Figure 23.4, and click Open. The images appear in your import list.
   Figure 23.4 : You must also import any multimedia elements that are referenced by the Java applet.

9. Click OK to import the images into your images folder.

Inserting and Configuring a Java Applet

With the class files and images imported into the web, you can insert the Java applet into your Web page. To insert the ImageTape Java applet, follow these steps:

1. From the FrontPage Explorer, choose Tools | Show FrontPage Editor, or use the Show FrontPage Editor button on the toolbar to open the FrontPage Editor.
2. Create or open a new page to insert the Java applet into.
3. Choose Insert | Other Components | Java Applet, or click the Insert Java Applet button on the Advanced toolbar.
4. In the Applet Source field, enter the name of the Java applet source file. In this case, enter imagetape. You don't need to add the .class extension to this name.
5. In the Applet Base URL field, enter the URL of the folder that contains the Java applet source file. You imported the applets into your classes folder. Enter classes here.
6. In the "Message for browsers without Java support" field, enter the HTML to display in Web browsers that do not support Java applets. Enter If you are not using a Java-compatible browser, you will not see the animation that is playing here..
7. For this applet, you need to enter four applet parameters. To add an applet parameter, click the Add button. The Set Attribute Value dialog box, shown in Figure 23.5, appears.
   Figure 23.5 : You enter the applet parameters in the Set Attribute Value dialog box.

8. The first parameter specifies the direction that the images scroll. Enter the parameter name dir in the Name field. In the Value field, enter 4.
9. Click OK. The entries appear in the Applet Parameters field of the Java Applet Properties dialog box.
10. The second parameter specifies the directory in which your images appear. Click the Add button. For the parameter name, enter img. For its value, enter images. Click OK to return to the Java Applet Properties dialog box.
11. The third parameter specifies the number of images that you want to scroll across the screen. Click the Add button. For the parameter name, enter nimgs. For its value, enter 15. Click OK to return to the Java Applet Properties dialog box.
12. The fourth parameter specifies the speed at which you want the images to scroll. Click the Add button. For the parameter name, enter speed. For its value, enter 4. Click OK to return to the Java Applet Properties dialog box. The parameters appear in the Applet Parameters list of the Java Applet Properties dialog box, as shown in Figure 23.6.
    Figure 23.6 : The parameters have been entered in the Java Applet Properties dialog box.

13. Next, you enter values in the Size portion of the Java Applet Properties dialog box. In the Width field, enter 500. In the Height field, enter 50.
14. In the "Horizontal spacing" field, enter the number of pixels you want between the Java applet and the nearest text.
15. In the "Vertical spacing" field, enter the number of pixels you want between the Java applet and the line above or below the current line.
16. To specify how you want the applet to align with other text on your page, choose one of the following from the Alignment section:
    Bottom (default) aligns the bottom of the applet with the text.
    Middle aligns the middle of the applet with the text.
    Top aligns the top of the applet with the text.
    Absbottom aligns the applet with the bottom of the current line.
    Absmiddle aligns the applet with the middle of the current line.
    Texttop aligns the top of the applet with the top of the tallest text in the line.
    Baseline aligns the applet to the baseline of the current line.
    Left places the applet in the left margin and wraps the text that follows along the control's right side.
    Right places the applet in the right margin and wraps the text that follows along the control's left side.
17. Use the Extended button to add Extended Attributes to the applet. None are required here. For more information, see "Using Extended Applet Attributes," later in this chapter.
18. Click OK to exit the Java Applet Properties dialog box. A representation of the applet appears on your page, as shown in Figure 23.7. Center it with the Center button on the Format toolbar.
    Figure 23.7 : A representation of the Java applet appears on your page.

19. Choose File | Save. The Save As dialog box appears. In the Page Title field, enter Sun Microsystem's Image Tape Applet. In the File Path Within Your FrontPage Web field, enter imgtape.htm.
20. Choose OK to save your page to the web.
21. Choose File | Preview in Browser. The Preview in Browser dialog box appears. Select your favorite Java-enabled browser from the Browser list. In the Window Size field, select a resolution for the preview. Then click the Preview button. The Java applet loads into your browser and animates the images.

Using Extended Applet Attributes

You can add extended attributes to a Java applet from the Java Applet Properties dialog box. Follow these steps:

1. Select the Java applet to which you want to add the extended attributes.
2. Press Alt+Enter, or right-click and choose Java Applet Properties from the pop-up menu. The Java Applet Properties dialog box appears.
3. Click the Extended button. The Extended Attributes dialog box appears.
4. To add an attribute, click Add. The Name/Value Pair dialog box, shown in Figure 23.8, appears.
   Figure 23.8 : Add extended attributes for the Java applet in the Name/Value Pair dialog box.

5. Enter the attribute's name in the Name field. Enter its value in the Value field.
6. Click OK to exit the Name/Value Pair dialog box. You return to the Extended Attributes dialog box. Click Add to add another attribute. You can also modify an existing attribute by selecting the attribute and clicking Modify. To remove an attribute, highlight the attribute you want to remove, and click Remove.
7. Click OK to exit the Extended Attributes dialog box, and click OK again to exit the Java Applet Properties dialog box. The attributes are applied to your applet.

Working with Netscape Plug-Ins

Plug-ins are software modules that integrate into Web browsers. With plug-ins, you can add animation, multimedia, online games, calendar programs, and interactivity to your Web pages. In addition, many applications offer plug-ins so that you can view documents in their native formats. There are many plug-ins available to choose from.

In Chapter 15, "Going Beyond the FrontPage Editor," you learned about a plug-in that adds PowerPoint presentations to your Web pages. I'll use that plug-in as an example in this chapter. There are actually two different ways that you can insert a PowerPoint animation into your pages. First, I'll demonstrate how you can insert the PowerPoint animation using the steps you follow with any plug-in.

Importing a Netscape Plug-In into Your Web

When you insert a plug-in into your page, what you actually insert is the data file that the plug-in program plays. In this example, the data file is a PowerPoint animation. When the user opens the page that contains this animation, his or her browser checks to see if the appropriate plug-in is installed. If it is not, the browser asks if the user wants to download it.

To insert a Netscape plug-in, follow these steps:

1. From the FrontPage Explorer, create or open a web in which to create a page. Select the images folder from the All Folders view.
2. From the FrontPage Explorer, choose File | Import. The Import File to Web dialog box appears.
3. Click the Add File button. The Add File to Import List dialog box, shown in Figure 23.9, appears.
   Figure 23.9 : Import the PowerPoint animation into your web using the Add File to Import List dialog box.

4. Locate ppanim.ppt (the PowerPoint presentation file) on the CD-ROM that accompanies this book. After you locate the file, click Open. You return to the Import File to FrontPage Web dialog box.
5. Click OK. The animation appears in the images directory in your web.

Inserting a Netscape Plug-In into Your Page

After you import the PowerPoint animation into your Web site, you can insert it into a Web page as follows:

1. From the FrontPage Explorer, choose Tools | Show FrontPage Editor or use the Show FrontPage Editor button to open the FrontPage Editor.
2. Create or open a page in which to insert the PowerPoint animation file. Position the insertion point where you want the presentation to appear.
3. Choose Insert | Other Components | Plug-In, or click the Insert Plug-In button on the Advanced toolbar. The Plug-In Properties dialog box, shown in Figure 23.10, appears.
   Figure 23.10 : Configure the settings for your plug-in in the Plug-In Properties dialog box.

4. In the Data Source field, enter the URL or file location of the data that you want to display in the plug-in. In this case, that data is the PowerPoint animation you imported into your web. Enter images/ppanim.ppz.
   Optionally, click the Browse button. The Select Plug-In Data Source dialog box appears.
   • To select the plug-in data source from your current web, choose the Current FrontPage Web tab and locate the drive and directory in which your plug-in appears. Highlight the file and click OK.
   • To select the plug-in data source from your local or network file system, select the Other Location tab. Select the From File radio button and enter the path to your plug-in data file or use the Browse button to locate it. Highlight the file and click Open.
   • To insert a plug-in data source from the World Wide Web, select the Other Location tab, and choose the From Location radio button. Enter the URL of the plug-in data file and choose OK.
5. In the "Message for browsers without Plug-In support" field, enter the HTML text to display in Web browsers that do not support plug-ins. Here, enter something like If you're using a browser that supports Netscape plug-ins and don't see a PowerPoint presentation playing here, you need to download the files listed below.. You can provide links on your page to ensure that the user finds the correct plug-in.
6. In the Height field, enter the height of the plug-in in pixels. For this example, enter 300.
7. In the Width field, enter the width of the plug-in in pixels. For this example, enter 400.
8. Check "Hide Plug-In" if you don't want a visual representation of the plug-in to appear on the page. You can choose this option if you use a plug-in to insert a sound on your page. In that case, you do not want a visual representation. Leave this option unchecked for the example.
9. In the "Horizontal spacing" field, enter the number of pixels you want between the plug-in and the nearest text. The default is 0. Enter 5 here.
10. In the "Vertical spacing" field, enter the number of pixels you want between the plug-in and the line above or below the current line. For this example, leave this option at the default of 0.
11. Use the Layout's Alignment drop-down menu to specify how you want the plug-in to align with other text on your page. For the example, leave it set at the default of bottom. The following options are available:
    Bottom (default) aligns the bottom of the plug-in with the text.
    Middle aligns the middle of the plug-in with the text.
    Top aligns the top of the plug-in with the text.
    Absbottom aligns the plug-in with the bottom of the current line.
    Absmiddle aligns the plug-in with the middle of the current line.
    Texttop aligns the top of the plug-in with the top of the tallest text in the line.
    Baseline aligns the plug-in to the baseline of the current line.
    Left places the plug-in in the left margin and wraps the text that follows along the control's right side.
    Right places the plug-in in the right margin and wraps the text that follows along the control's left side.
12. In the "Border thickness" field, enter the thickness of the border in number of pixels. This sets a black border around the plug-in. For this example, leave this value at the default of 0.
13. Click the Extended button to add Extended Attributes to the plug-in. For more information, see "Using Extended Plug-In Attributes," later in this chapter.
14. Click OK to exit the Plug-In Properties dialog box. A representation of the plug-in appears on your page, as shown in Figure 23.11. Center the plug-in with the Center button on the Format toolbar.
    Figure 23.11 : The representation of the plug-in appears on your page.

15. Choose the File | Save command (Ctrl+S), or click the Save button on the Standard toolbar. The Save As dialog box appears.
16. In the Page Title field, enter PowerPoint Animation.
17. In the "File path within your FrontPage web" field, enter pwrpt1.htm (number 1, not letter l).
18. Choose OK. The page is saved to your web. Use the File | Preview in Browser command to preview the animation in a browser that supports plug-ins. The PowerPoint animation appears on the page, sized as you specified in the Plug-In Properties dialog box. An example is shown in Figure 23.12.
    Figure 23.12 : The PowerPoint animation as viewed in a browser that supports Netscape Plug-Ins.

What happens if the user doesn't have the plug-in you used on his or her computer? One solution is to provide a link to the correct plug-in, as outlined previously in step 5. However, some browsers automatically locate the source of the plug-in as well. For example, Netscape Navigator displays a dialog box that allows the user to download the appropriate plug-in for the page. This dialog box is shown in Figure 23.13.

Figure 23.13 : Some browsers provide the opportunity to download a plug-in if it is not located on the user's system.

When the user clicks the Get the Plugin button, he or she navigates to the Plug-In Finder page, shown in Figure 23.14. On the page are links to download compatible plug-ins for the type of file the user is trying to view.

Figure 23.14 : The user navigates to a page where the appropriate plug-in can be downloaded.

Using Extended Plug-In Attributes

If the plug-in that you are using allows you to set additional attributes, you can use the Extended button in the Plug-In Properties dialog box to enter them. To add extended attributes to a plug-in, follow these steps:

1. Select the plug-in to which you want to add the extended attributes.
2. Press Alt+Enter, or right-click and choose Plug-In Properties from the pop-up menu. The Plug-In Properties dialog box appears.
3. Click the Extended button. The Extended Attributes dialog box appears.
4. To add an attribute, click Add. The Name/Value Pair dialog box, shown in Figure 23.15, appears.
   Figure 23.15 : Use the Name/Value Pair dialog box to enter extended attributes for plug-ins.

5. Enter the attribute's name in the Name field. Enter its value in the Value field.
6. Click OK to exit the Name/Value Pair dialog box. You return to the Extended Attributes dialog box. Click Add to add another attribute. You can also modify an existing attribute by selecting the attribute and clicking Modify. To remove an attribute, highlight the attribute you want to remove and click Remove.
7. Click OK to exit the Extended Attributes dialog box, and click OK again to exit the Plug-In Properties dialog box. The attributes are applied to your plug-in.

Inserting a PowerPoint Animation as a Plug-In

There is another way that you can insert a PowerPoint animation as a plug-in. Follow these steps:

1. Create or open a page in the FrontPage Editor.
2. Position the insertion point where you want the PowerPoint animation to appear.
3. Choose Insert | Other Components | PowerPoint Animation. The PowerPoint Animation dialog box, shown in Figure 23.16, appears.
   Figure 23.16 : The PowerPoint Animation dialog box allows you to insert a PowerPoint animation as a plug-in or as an ActiveX control.

4. In the "PowerPoint Animation File" field, enter the path to the plug-in or use the Browse button to locate the plug-in. Use the Current FrontPage Web tab to select the plug-in from your currently open web. Use the Other Location tab to insert the plug-in from a file on your local or network hard drive or from the World Wide Web. After you select the file, click OK to return to the PowerPoint Animation dialog box.
5. In the Insert As field, choose Plug-In.
6. Click OK. The PowerPoint animation appears on your page in its original size. You can use the Plug-In Properties dialog box, shown in Figure 23.10, to modify any settings after the plug-in representation appears on your page.

Workshop Wrap-Up

This chapter introduced you to two ways that you can extend the capabilities of your Web pages. Using Java applets and Netscape plug-ins, you no longer need to limit your Web pages to text, images, and animation. You can view documents in their native formats, add extended capabilities such as chats and enhanced multimedia, view Web pages in three-dimensional virtual worlds, and much more. You learned how to add and configure Java applets to your pages and how to set the parameters in your Web pages. You also learned how to insert a plug-in into your pages and what happens when the user doesn't have the right plug-in player. Finally, you learned how to insert a PowerPoint animation as a Netscape plug-in.

Next Steps

In the next chapter, you'll learn about another exciting Web technology that is sweeping the Web-ActiveX, developed by Microsoft Corporation. This technology is heating up the browser battle. You'll learn how to add ActiveX components to your Web pages and how to generate VBScript or JavaScript to make ActiveX components do their thing.

For other related topics, refer to the following chapters:

• Chapter 15, "Going Beyond the FrontPage Editor," shows you other ways that you can work with PowerPoint animations.
• Refer to Chapter 24, "ActiveX and VBScript," to learn about JavaScript.
• Chapter 25, "Real-Life Examples IV: Adding Interactivity," provides more examples of working with Java and Netscape plug-ins.

Q&A