by Rick Darnell
IN THIS CHAPTER
By itself, Java is a significant development because of its ability to stretch the
behavior of your Web pages far beyond what was ever imagined for the World Wide Web.
Java can become even more powerful when harnessed with JavaScript.
As you know from other chapters, Java is powerful enough to add animation, sound, and other features to an applet--but it's very cumbersome to directly interact with an HTML page. JavaScript isn't big or powerful enough to match Java's programming power, but it is uniquely suited to work directly with the elements that comprise an HTML document.
By combining the best features of Java and JavaScript, your applet can interact with your Web page, offering a new level of interactivity.
For Java and JavaScript to interact on your Web pages, they both must be active and enabled in the user's browser.
To make sure that both features are active in Netscape Navigator when the user views Java applets, include these simple directions on the opening page of your Web site for the user to follow:
The Languages tab in the Network Preferences dialog box controls whether or not Java applets and JavaScript commands are processed for HTML documents.
The steps to include to make sure that both languages are active in Microsoft Internet Explorer are similar to the steps for Navigator:
Internet Explorer controls which language features are enabled from the Security tab in the Options dialog box.
The first and most commonly used communication feature is to modify applet behavior from JavaScript. This is really quite easy to do with the right information, and doing so enables your applet to respond to events on the HTML page--including interacting with forms.
Java syntax is very similar to other JavaScript syntax, so if you're already familiar with either scripting language, adding Java control is an easy step.
With Navigator 3.0 and later, Netscape provides an object called Packages. The Packages object allows JavaScript to invoke native Java methods directly. This object is used in much the same way as the Document or Window object is in regular JavaScript.
CAUTION: Invoking native Java methods from JavaScript is possible only within Netscape Navigator 3.0 or later. Microsoft Internet Explorer doesn't include support for the JavaScript-to-Java packages in its 3.01 release, but may include its own version of this capability in later versions.
The source of the problem is that JavaScript is implemented individually for each browser; what Netscape includes for JavaScript isn't the same as what Microsoft includes for JScript. However, Microsoft and Netscape are already working to standardize JavaScript so that it will work the same across both browser platforms.
Internet Explorer still includes support for all the now-standard features of JavaScript, including control and manipulation of windows, documents, and forms, although it still does not include other standard items, such as images.
Here is the syntax to call a Java package from JavaScript directly:
[Packages.]packageName.className.methodName
The object name is optional for the three default packages--java, sun, and netscape. These three packages can be referenced by their package name alone, as shown here:
java.className.methodName sun.className.methodName netscape.className.methodName
Together with the package name, the object and class names can result in some unwieldy and error-prone typing. This is why you can also create new variables using the Package product. The following code assigns a Java package to the variable System and then uses the System variable to call a method in the package:
var JavaSystem = Package.java.lang.System; JavaSystem.out.println("Hello from Java in JavaScript.");
Controlling an applet with a script is a fairly easy matter, but it does require some knowledge of the applet you're working with. Any public variable, method, or property within the applet is accessible through JavaScript.
TIP: If you're changing the values of variables within an applet, the safest way to do so is to create a new method within the applet for that specific purpose. The method can accept the value from JavaScript, perform any error checking, and then pass the new value along to the rest of the applet. This arrangement helps prevent unexpected behavior or applet crashes.
You have to know which methods, properties, and variables in the applet are public. Only the public items in an applet are accessible to JavaScript.
There are five basic activities common to all applets (as opposed to one basic activity for applications). An applet has more activities to correspond to the major events in its life cycle on the user's browser. None of the activities have any definitions. You must override the methods with a subclass within your applet. Here are the five activities common to all applets:
With this information in hand, getting started begins with the <APPLET> tag. It helps to give a name to your applet to make JavaScript references to it easier to read. The following snippet of code shows the basic constructor for an HTML applet tag that sets the stage for JavaScript control of a Java applet. The tag is identical to the tags you used in previous chapters to add applets, except that a new attribute is included for a name:
<APPLET CODE="UnderConstruction.class" NAME="AppletConstruction" WIDTH=60 HEIGHT=60> </APPLET>
Assigning a name to your applet isn't absolutely necessary because JavaScript creates an array of applets when the page is loaded. However, doing so makes for a much more readable page.
To use a method of the applet from JavaScript, use the following syntax:
document.appletName.methodOrProperty
document.applets[index].methodOrProperty document.applets[appletName].methodOrProperty
Like other arrays, one of the properties of applets is length,
which returns how many applets are in the document.
This array of applets is not currently available in the Microsoft Internet Explorer
3.0 implementation of JavaScript.
One of the easy methods of controlling applet behavior is starting and stopping its
execution. You start and stop an applet using the start() and stop()
methods common to every applet. Use a form and two buttons to add the functions to
your Web page (see Figure 46.4). The following code snippet is a basic example of
the HTML code needed to add the buttons, with the name of the applet substituted
for appletName:
<FORM> <INPUT TYPE="button" VALUE="Start" onClick="document.appletName.start()"> <INPUT TYPE="button" VALUE="Stop" onClick="document.appletName.stop()"> </FORM>
One of the simplest ways to control an applet is to use buttons that start and stop it.
You can also call other methods, depending on their visibility to the world outside the applet. JavaScript can call any Java method or variable by using a public declaration.
The syntax to call applet methods from JavaScript is simple and can be integrated with browser events, such as the button code snippet just shown. The basic syntax for calling an applet method from JavaScript is shown here:
document.appletName.methodName(arg1,...,argx)
To call the stop() method from the underConstructionApplet applet within an HTML page, the syntax is as follows (assuming that the applet is the first one listed on the page):
document.underConstructionApplet.stop();
Here's how you do it with Navigator (again, assuming that the applet is the first one listed on the page):
document.applets[0].stop();
Integrating the start() and stop() methods for this applet with the applet tag and button code snippet used earlier results in the following code:
<APPLET CODE="UnderConstruction" NAME="underConstructionApplet" WIDTH=60 HEIGHT=60></APPLET> <FORM> <INPUT TYPE="button" VALUE="Start" onClick="document.underConstructionApplet.start()"> <INPUT TYPE="button" VALUE="Stop" onClick="document.underConstructionApplet.stop()"> </FORM>
The Netscape classes provided with Netscape Navigator 3.0 and later enable Java to take a direct look at your HTML page through JavaScript objects. This new set of classes is called LiveConnect. To implement this functionality, you must import the netscape.javascript.JSObject class when the applet is created.
To include the JSObject class as part of your applet, use the import command as you normally do to include any other class package:
import netscape.javascript.JSObject;
Another important addition is necessary in the applet tag: MAYSCRIPT. This security feature gives specific permission for the applet to access JavaScript objects. Here's how to include the tag:
<APPLET CODE="colorPreview.class" WIDTH=50 HEIGHT=50 NAME="Preview" MAYSCRIPT>
Without the MAYSCRIPT parameter, any attempt to access JavaScript from the applet results in an exception. If you want to exclude an applet from accessing the page, simply leave out the MAYSCRIPT parameter.
The JSObject class gives Java the capability to look at and change objects defined through JavaScript. This requires certain assumptions, especially when passing or receiving values from Java. To ensure compatibility, every JavaScript value is assigned some form from java.lang.Object:
To get a handle on JavaScript objects--including form items and frames--you must first create an object to hold the current Navigator window. The getWindow() method provides the means to do this.
First, you have to create a new variable of type JSObject. Then, using the JSObject class, assign the window to the variable:
JSObject jsWin; jsWin = JSObject.getWindow(this);
After you have a handle on the window, you can start to break it into its various components with getMember(). This method returns a specific object from the next level of precedence. For example, to get a handle on a form on a Web page with a form called response, you can use the following set of statements:
jsWin = JSObject.getWindow(this); JSObject jsDoc = (JSObject) jsWin.getMember("document"); JSObject responseForm = (JSObject) jsDoc.getMember("response");
In JavaScript, this form is referred to as window.document.response. Note that each JavaScript object is assigned to its own variable in Java and is not a property of a parent object. The form in Java is contained in responseForm, not in jsWin.jsDoc.responseForm.
NOTE: All parts of an HTML document exist in JavaScript in set relationships to each other. This arrangement is called instance hierarchy because it works with specific items on the page, rather than with general classes of items.
The Java netscape package recognizes and uses this hierarchy through its getWindow() and getMethod() methods. The first gets the window object (the highest object); the latter returns individual members of the next level.
So far, you've retrieved only broad objects, such as windows and forms. Getting a specific value from JavaScript follows the same principles, although now you need a Java variable of the proper type to hold the results instead of an instance of JSObject.
Returning to the form example described earlier in this section, suppose that there is a text field (name), a number (idNum), and a checkbox (member). You can retrieve each of these values from JavaScript using the following commands:
jsWin = JSObject.getWindow(this); JSObject jsDoc = (JSObject) jsWin.getMember("document"); JSObject responseForm = (JSObject) jsDoc.getMember("response"); JSObject nameField = (JSObject) responseForm.getMember("name"); JSOBject idNumField = (JSObject) responseForm.getMember("idNum"); JSOBject memberField = (JSObject) responseForm.getMember("memberField"); String nameValue = (String) nameField.getMember("value"); Float idNumValue = (Float) idNumField.getMember("value"); Boolean memberValue = (Boolean) memberField.getMember("checked");
This chunk of code quickly becomes unwieldy, especially when several values are needed from JavaScript. If you have to access more than several elements on a page, it can help to create a new method to handle the process.
The getElement() method defined in the next code snippet accepts the name of a form and element on an HTML page as arguments and returns the JSObject that contains it:
protected JSObject getElement(String formName, String elementName) { JSObject jsDoc = (JSObject) JSObject.getWindow().getMember("document"); JSObject jsForm = (JSObject) jsDoc.getMember(formName); JSObject jsElement = (JSObject) jsElement.getMember(elementName); return jsElement;
}
This simple method creates the intervening JSObject objects needed to get to the form element, making the retrieval as easy as knowing the form and element name. If the form or form element is not included on the page, the method throws an exception and halts the applet. And because the instances of JSObject are contained within the method, system resources are conserved.
To change a JavaScript value from an applet, use the JSObject.setMember() method. The syntax is setMember(name, value), where name is the name of the JavaScript object, and value is its new value. The following snippet uses the getElement() method just defined to get the name element from the response form, and then uses the JSObject's setMember() method to set its value to Your Name Here. This is equivalent to the this.name = newValue statement in JavaScript.
JSObject nameField = getElement("response","name"); nameField.setMember("name","Your Name Here");
The getWindow() and getMember() methods just described are the basic methods used when interfacing with JavaScript. Together, they make receiving values from an HTML page with JavaScript a straightforward task--even if the process is a little cumbersome in the number of statements required.
If your applet is designed to work with a variety of HTML pages that may contain different names for forms and elements, you can use the JavaScript arrays with the JSObject slot methods. If the desired form is always the first to appear on the document and the element is the third, then the form name is forms[0] and the element is elements[2].
After retrieving the document object using getWindow() and getMember(), use getSlot(index) to return a value within it. For example, in an HTML document containing three forms, the second is retrieved into Java using the following commands:
JSOBject jsWin = JSObject.getWindow(this); JSObject jsDoc = (JSObject) jsWin.getMember("document"); JSObject jsForms = (JSObject) jsDoc.getMember("forms"); JSObject jsForm1 = (JSObject) jsForms.getSlot(1);
In this syntax, the index is an integer and the value is a String, boolean, or float.
TIP: One rule that must stand firm is the placement of the form and the elements within it. When the applet is used with more than one document, the forms and elements must be in the same relative place every time to avoid exceptions and unpredictable results.
The netscape class package provides two methods to call JavaScript methods from within an applet: call() and eval(). The syntax differs slightly for the two methods, but the outcome is the same.
There are two ways to invoke these methods. The first uses a specific window instance; the second uses getWindow() to create a JavaScript window just for the expression:
jsWin.callOrEval(arguments) JSOBject.getWindow().callOrEval(arguments)
The call() method separates the method from its arguments. This is useful for passing Java values to the JavaScript method. The syntax is call("method", args), where method is the name of the JavaScript method you want to call and args is an array of the arguments you want to pass.
The eval() method, on the other hand, uses a string that appears identical to the way a method is called within JavaScript. The syntax is eval("expression"), where expression is a complete method name along with its arguments, such as document.writeln(`Your name here.'"). The entire statement is wrapped within a string and passed to JavaScript. Here's what it looks like when you include the string with the eval() expression:
eval("document.writeln(\'Your name here.\');")
TIP: To pass quotation marks as quotation marks to JavaScript within a Java string, use the backslash character before each occurrence.
Netscape's LiveConnect gives you a whole set of tools to get from JavaScript to Java and back again. The marriage of these two Web technologies can open up a whole new world of how to interact with your users. By using simple statements and definitions--already a part of both languages--you can make a previously static Web page communicate with an applet embedded in it; in return, the Web page can react to the output of the applet.
JavaScript-to-Java communication is a simple extension of JavaScript's functionality. As long as your applets have names, any applet's public method is accessible to your HTML page. And using the new Netscape package netscape.javascript makes the process a two-way street: Your Java applet can invoke JavaScript functions and look at the structure of your Web page as represented by the JavaScript document object.
This combination is one more set of capabilities in your toolbox that you can use to meet your users' needs.
©Copyright, Macmillan Computer Publishing. All rights reserved.