Notice: This material is excerpted from Special Edition Using HTML, 2nd Edition, ISBN: 0-7897-0758-6. This material has not yet been through the final proof reading stage that it will pass through before being published in printed form. Some errors may exist here that will be corrected before the book is published. This material is provided "as is" without any warranty of any kind.
by Stephen R. Pietrowicz
Sun Microsystems's object-oriented programming language Java(tm) and the jointly developed JavaScript are both creating a lot of interest on the Web. You can use Java and JavaScript to create dynamic, interactive Web pages. This chapter gives you a brief introduction to both Java and JavaScript and explains how you can use both of these technologies in your own Web pages.
In 1991, Sun started the "Green" project to create intelligent consumer electronics devices. James Gosling, an engineer at Sun, created a new object-oriented language, called Oak, to support the project. He intended to create a language that could be used to write programs for devices like cellular phones and television remote controls. Instead of pre-programming the devices before they left the factory, Oak programs could be downloaded as they were needed. When new features were added, the customer would be able to take advantage of them right away without having to send the device back to the factory. In 1993, Sun built prototypes of remote controls using this technology, and although it was promising, they were having problems gathering support from other vendors. On top of everything else, they found that "Oak" was already in use as a trademark.
In 1994, the Internet and the World Wide Web experienced explosive growth. The Oak team began to realize their downloadable technology could be applied to the Web. They decided to begin work on a new Web browser that would showcase their work. They also renamed the language "Java," a slang word for coffee, a beverage that many engineers drink every day.
Up until that point, Web pages consisted of static images and text. A few interesting examples of complex server-side imagemaps and CGI scripts did show up on the Web to create simple paint programs, for instance, but they weren't really interactive. Requests still had to be sent back to the server, and these requests created additional load on the machine serving the documents.
A browser with the ability to download programs and run them on the client machine would offload the server, allowing it to serve more documents. That's exactly the sort of browser the Java team decided to build.
The Java team's browser, HotJava, was the first program capable of automatically loading and running Java programs. HotJava created quite a bit of interest in Java on the Web, and many companies have licensed Java from Sun so that they can incorporate the technology into their own products. Some of the same consumer electronics companies Sun tried to interest with the Green project are now contacting them to license Java.
Java has proven to be so popular that on January 9, 1996, Sun spun off a new business unit called Javasoft that will concentrate on Java development.
The Java language is object oriented and very similar to C++. It was designed to take many of the best features of C++ while simplifying it to make writing programs easier.
Programs are normally created to run on only one type of operating system. Windows 95 programs have been specifically created to run on systems running the Windows 95 operating system, and will not run on the Macintosh or on a UNIX system. Java programs, however, are intended to be platform independent. Java programs are compiled into a series of bytecodes that are interpreted by a Java interpreter. After a Java program has been compiled, it can run on any system with a Java interpreter. You do not need to recompile it.
This capability makes Java an ideal language for programs on the Web. With so many different systems on the Web, creating programs that will work with all of them is very difficult. Because Java programs are platform independent, programs are no longer restricted to running on one platform. They can run on any platform to which Java has been ported.
Java has been ported to many different platforms. Sun has ported Java to Solaris, Windows NT, Windows 95, and the Macintosh. Other companies have ported Java to Silicon Graphics IRIX, IBM OS/2, IBM AIX, and Linux.
Java programs that can be embedded into WWW pages are called Java applets. To run applets from Web pages, you must have a browser that supports Java, such as HotJava or Netscape 2.0.
If you want to write your own Java applets, you should download the Java Development Kit from Javasoft. It's available for free on the Web. You can download it from the Javasoft Home page:
Now take a look at a few examples. Listing 26.1 shows the code for a simple Java applet. This listing is called HelloWorld.java on the CD-ROM.
Listing 26.1, A "Hello World" Java applet.
import java.applet.*; import java.awt.*; class HelloWorld extends Applet { public void paint(Graphics g) { g.drawString("Hello World!",20,20); } }
When you place this applet into a page and run it, it prints Hello World!. But before you can use it in a page, you must compile the applet using javac, the Java compiler. The files that Javac creates are called Java class files. A class file is the platform-independent object file that the browser retrieves when downloading a Java applet.
To use this applet on an HTML page, you have to describe it using the APPLET element. Figure 26.1 shows an HTML page that loads this example applet.
An HTML page with an applet definition.
The <APPLET> and </APPLET> tags act as a container for the Java applet definition. They indicate to the browser that a Java applet should be loaded. The CODE attribute tells the browser which Java applet should be downloaded. The browser reserves space in the page using the WIDTH and HEIGHT attributes, just as it reserves space for the IMG element. Then the browser downloads the Java class specified in the CODE attribute and begins running the applet.
In this case, the applet being downloaded is HelloWorld, and it reserves a space 150 pixels high and 200 pixels wide in the page. Figure 26.2 shows what the page looks like when the browser loads it.
A simple Java applet.
Browsers that can't display Java applets don't display anything when this page is loaded. To prevent this situation from happening, you can place HTML markup or text between the <APPLET> and </APPLET> tags. Browsers that can't display Java applets display the HTML markup instead. You can use this approach to tell visitors to your pages what they would have seen if the applet had loaded.
Browsers that can display applets don't display any of this HTML markup. Figure 26.3 shows an HTML page with alternative HTML markup.
The HTML markup in the APPLET container is shown by browsers that cannot display Java applets.
Figure 26.4 shows how this page looks in a browser that doesn't support Java applets.
Instead of showing the Java applet, the HTML text is displayed. This way, you can alert visitors to your page about what they're missing.
You aren't restricted to writing Web applets with Java. You can write full applications with it as well. The HotJava browser and the Java compiler are both written in Java.
The CODE, WIDTH, and HEIGHT attributes of the APPLET tag are all required. You also can use other attributes in the APPLET tag. Table 26.1 shows the attributes available and their functions.
Table 26.1 APPLET attributes and their functions.
Attribute | Function |
CODE | Defines the applet class to load. (required) |
WIDTH | Defines the width in pixels of the area in the HTML page to reserve for the applet. (required) |
HEIGHT | Defines the height in pixels of the area in the HTML page to reserve for the applet. (required) |
ALT | Defines the alternate text to display if the applet tag is understood, but applet loading is turned off or not supported. |
CODEBASE | Defines the directory where the classes for the applet are stored. If this attribute is not specified, the directory of the HTML page is searched. |
NAME | Defines the name of this instance of an applet. This attribute can be used by an applet to find another applet on the same page. |
ALIGN | Defines how this applet is aligned in the HTML page. Any of the ALIGN options discussed in previous chapters are legal here. |
VSPACE | Defines how many pixels of space are reserved above and below the applet. |
HSPACE | Defines how many pixels of space are reserved on either side of the applet. |
Listing 26.2 shows a more complex applet called URLsound. (This applet is called URLsound.java on the CD-ROM.) It displays an image with which a user can interact. When the user moves the mouse pointer over the image, this applet changes to another image and plays a sound. When the user clicks on the image, the applet causes the Web browser to go to a new URL.
If you have loaded a background image or changed the background color and used an applet, the area reserved for the applet will be drawn with the browser's default grey color.
Listing 26.2, The URLsound Java applet.
import java.awt.*; import java.applet.*; import java.net.*; /** * URLSound - This applet displays an image in a page. If the mouse cursor * moves over the image, it changes to an alternative image, and * a sound is played. If the image is clicked, the browser * changes to another page. The images, sound and new page are * all user definable. */ public class URLsound extends Applet { String sound; String href; Image image1, image2, current; public void init() { /* * retrieve parameters given to the applet on the HTML page */ String pic1 = getParameter("picture1"); String pic2 = getParameter("picture2"); sound = getParameter("sound"); href = getParameter("href"); /* * The MediaTracker class is used to ensure the images * have been loaded before we attempt to use them. */ MediaTracker tracker = new MediaTracker(this); try { image1 = getImage(getDocumentBase(), pic1); tracker.addImage(image1, 0); image2 = getImage(getDocumentBase(), pic2); tracker.addImage(image2, 0); } catch (Exception e) { } try { tracker.waitForID(0); } catch (Exception e) { } current = image1; } /* * This routine is called each time the mouse enters the * applet area. It plays a sound and changes the displayed * image. */ public boolean mouseEnter(Event evt, int x, int y) { /* * Try to play the sound */ try { play(getDocumentBase(), sound); } catch (Exception e) { System.out.println("Unable to play Sound"); } /* * Change "current" to the alternate image and force a repaint */ current = image2; repaint(); return true; } /* * This routine is called each time the mouse leaves the * applet area. It restores the initial image and forces * a repaint. */ public boolean mouseExit(Event evt, int x, int y) { current = image1; repaint(); return true; } /* * This routine is called each time the mouse is clicked in the * applet area. It causes the browser to jump to the specified * URL. */ public boolean mouseDown(Event evt, int x, int y) { URL hrefURL = null; try { hrefURL = new URL(href); getAppletContext().showDocument(hrefURL); } catch (Exception e) { System.out.println("Couldn't go to URL"); } return true; } /* * The paint method is what actually displays the image. */ public void paint(Graphics g) { g.drawImage(current, 0, 0, this); } }
You can customize URLsound to allow you to specify which images to display, which sound to play, and which URL to jump to. You do so by using the PARAM element inside the APPLET container.
Version 1.0 of the Java Development Kit, the toolkit that programmers use to write Java programs, supports sound files only in Sun's AU format. If you want to use sound in your Java HTML pages, you must convert the sounds to the AU format.
Figure 26.5 shows an HTML page that uses URLsound twice, with different parameters.
You can change parameters in the URLsound applet to customize it.
The <PARAM> tag has two required attributes: NAME and VALUE. When an applet initializes, it requests the parameters it's expecting by using the specified NAME, and it receives the VALUE. More than one parameter can be passed to an applet if you put more than one <PARAM> tag in the APPLET container. Parameters that the applet does not recognize are ignored.
In figure 26.5, the URLsound applet takes four parameters: picture1, picture2, sound, and href. picture1 names the picture in its inactive state. picture2 is revealed when the mouse pointer moves over the picture area, and the audio file specified by sound is played. When the user clicks the mouse on the picture, the browser jumps to the URL specified by href. In figure 26.6, a browser shows this page.
Two copies of URLsound in one page.
Special server software is not needed to serve Java applets. You can use your Internet server provider's current Web server to serve Java applets.
JavaScript is a scripting language that was jointly created by Netscape and Sun. JavaScript programs are not compiled like Java applets. JavaScript programs are embedded in the HTML markup of a page. After the page is loaded, the browser interprets the JavaScript program and runs it.
Figure 26.7 shows an example of a JavaScript program.
A simple JavaScript program in an HTML page.
The <SCRIPT> and </SCRIPT> tags enclose JavaScript programs. The required LANGUAGE attribute tells the browser what type of scripting language to use. In this case, it uses "JavaScript". If the browser supports more than one language, the LANGUAGE attribute indicates which language is being used. Figure 26.8 shows this page after it has been loaded into a browser.
The results of the simple JavaScript program.
In chapter 24, you learned that you can use forms and CGI scripts to create interesting programs with which a visitor to a page can interact. One of the problems with CGI scripts is that they require the Web server to execute the script. The additional workload on the server causes it to slow down, especially on a busy server with many CGI scripts. You might have noticed this slowdown when trying to connect to a site that takes awhile to transmit a document. Every time a CGI script runs, it uses valuable resources that could be used to serve more documents.
JavaScript solves the problem of overburdened Web servers. Instead of writing a CGI program that must be executed by the server, you can write and transmit a JavaScript program with the HTML page. The client browser, instead of the server, then executes the JavaScript program.
The HTML page in listing 26.3 contains a JavaScript program to convert between the Celsius and Fahrenheit temperature scales. The result of loading this page is shown in figure 26.9.
Listing 26.3, A JavaScript program that converts temperature scales.
<HTML> <HEAD> <TITLE>Temperature Converter</TITLE> <SCRIPT LANGUAGE="JavaScript"> function c2f(form) { celsius = form.celsius.value; form.fahrenheit.value = (celsius*1.8)+32; } function f2c(form) { fahrenheit = form.fahrenheit.value; form.celsius.value = (fahrenheit-32)/1.8; } </SCRIPT> </HEAD> <BODY> <FORM> Celsius value <INPUT TYPE="text" NAME="celsius" SIZE=15> is <INPUT TYPE="text" NAME="fahrenheit" SIZE=15> degrees Fahrenheit. <br> <INPUT TYPE="button" VALUE="Calculate" ONCLICK="c2f(this.form)"> <br> </FORM> <FORM> Fahrenheit value <INPUT TYPE="text" NAME="fahrenheit" SIZE=15> is <INPUT TYPE="text" NAME="celsius" SIZE=15> degrees Celsius. <br> <INPUT TYPE="button" VALUE="Calculate" ONCLICK="f2c(this.form)"> <br> </FORM> </BODY> </HTML>
The JavaScript program is loaded, and the fields have no initial values.
The code between the <SCRIPT> and </SCRIPT> elements defines two functions, c2f and f2c, which are used to calculate temperatures. Notice that neither of the functions produces any output. How are these functions used?
The answer is farther down in the document. The ONCLICK attribute of the <INPUT> element is used to execute a JavaScript function, or series of JavaScript statements. In the first form, the function c2f is called. In the second form, the function f2c is called. The parameter to the function call in each of these forms is this.form. All the values in the form are passed to the functions, which interpret the values that the user types into the forms and perform the calculations.
Another thing you may have already noticed about this page is that the JavaScript code is loaded in the HEAD container of the document. Loading the code this way is important so that you can assure the JavaScript functions are loaded before the rest of the page is loaded. This way, you can prevent a user from accidentally trying to interact with a JavaScript program before it is fully loaded. If the user were to press a button before all the functions were loaded, he or she would receive an error.
Figure 26.10 shows the results of typing values in each of the temperature fields and pressing the Calculate button of each form.
The JavaScript program computes the temperature values after the values 25 and 32 are entered and the Calculate buttons are both pressed.
This section gives you only a brief introduction to JavaScript. See the "Web Resources" section at the end of this chapter for additional JavaScript information.
Security should always be of primary concern to you when you download programs into your system. If Java applets are automatically downloaded and run, should you be concerned that you might download a virus?
Fortunately, the answer is no. Security mechanisms built into the Java class structure allow browsers to prevent Java applets from doing anything malicious to your system.
You don't have to worry about having viruses installed or having your private financial files stolen through Java because Java applets that your browser loads from the Web can't read or write files on your hard drive. The security policy in the browser prevents it.
Because files can't be read, Java applets can't start other programs you may already have installed on your system. No need to worry about a rogue applet coming in and wiping out your hard disk.
Java applets can create their own windows outside the browser, however. This could be a problem, too. What if the applet you download looks exactly like another program you already have on your system? What's to prevent you from entering data, like a password, into the applet that you're trying to protect?
Java takes care of this situation, too. To prevent you from thinking that these windows were created by your own system, an applet's window is labeled so that you know a Java applet has created the window. This label cannot be overridden by the Java applet, so you know it is always displayed. Figure 26.11 shows a labeled applet window.
Windows outside the browser contain the words Untrusted Java Applet Window at the bottom of the window.
If you ever see an unexpected window on your screen with the words "Untrusted Java Applet Window, asking for your password, DO NOT type your password. It's likely that someone is trying to use a Java applet to get your password to break into your system. Report the break-in attempt to your local system administrator or your Internet service provider.
Java applets are also incapable of searching through your system's memory to obtain information. The Java language itself doesn't have access to random memory locations in your system, which is a method some criminals use to steal passwords and other confidential information.
The following are just a couple of the most notable Java applets on the Web. They're both great examples of what is possible with Java.
The Impressionist, by Paul Haeberli of Silicon Graphics, is one of the most remarkable applets available (see fig. 26.12). It applies Haeberli's patented computer painting techniques to allow you to draw in the style of an impressionist painter. You select one of the nine pictures available on the page or use one of your own, and start with a blank canvas. As you move your mouse pointer over the canvas, the picture is drawn in the impressionist style. The Impressionist is available from
http://reality.sgi.com/grafica/impression/
The Impressionist.
BulletProof has created the first site on the Internet that uses Java to display stock quotes and stock histories (see fig. 26.13). This subscription service allows you to keep your stock portfolio up to date and to search thousands of different securities. Look for it at
http://www.bulletproof.com/WallStreetWeb/
The WallStreetWeb Java applet by BulletProof.
Creating Java applets and JavaScript programs can be a bit difficult, especially for the novice programmer. If you're interested in writing Java applets or JavaScript programs, there are a number of development tools and informational resources available to you.
Since Sun's announcement, many companies have licensed Java and have created Java development tools. Some free development tools are also available. Here are a few:
Symantec (http://www.symantec.com/) has created an integrated development environment (IDE) for Java called Symantec Cafe. Symantec Cafe is available for Windows 95, Windows NT, and Power Macintosh. You can read more about it at
http://www.symantec.com/lit/dev/javaindex.html
Borland International (http://www.borland.com/) has a new debugger for Java. This graphical debugger is available on the Windows 95, Windows NT, and Solaris platforms.
Silicon Graphics (http://www.sgi.com) has ported Java to their IRIX operating system and has created a development environment called Cosmo Code. Cosmo Code provides an extensive set of utilities for Java programming, including a source-level debugger. It is available only for Silicon Graphics machines.
Javamaker is a free IDE from Korea. It contains an editor and has buttons to compile your Java programs automatically. It's simple but very effective. Javamaker is available from
http://net.info.samsung.co.kr/~hcchoi/javamaker.html
Diva, another IDE available on the Internet is a more sophisticated utility than Javamaker. It provides graphical class representations, the ability to write HTML documents, an integrated editor and more. It is available from
Javasoft has a special WWW site set up especially for Java (see fig. 26.14). You can reach it at http://www.javasoft.com/. You can find the latest version of the HotJava browser and the Java Development Kit (JDK) at http://www.javasoft.com/download.html.
The Java web site has a "What's New" page that's updated frequently with news from Sun. It can be accessed from the Java home page or from: http://www.javasoft.com/new.html
The Gamelan home page (http://www.gamelan.com) keeps an extensive list of Java applets and other Java resources.
The Java Home page.
You can learn more about JavaScript by going to Netscape's Authoring Guide page:
http://home.netscape.com/comprod/products/navigator/version_2.0/script/script_info/index.html
The JavaScript Index (http://www.c2.org/~andreww/javascript/) contains a list of JavaScript links with many examples.
The Internet newsgroups for Java are shown in table 26.2.
Table 26.2 Internet Java newsgroups.
Group | Purpose |
comp.lang.java | General Java language discussions |
comp.lang.javascript | General JavaScript discussions |
alt.www.hotjava | HotJava browser discussions |
Reading these newsgroups is a great way to keep up to date with the most current Java information, and a great way to meet other people who are also interested in Java.
Many mailing lists also support Java. Sun maintains several of these Java mailing lists. You should be aware that some of these mailing lists have a tremendous amount of traffic, so be prepared to receive a lot of e-mail if you subscribe to them.
The java-announce list, a moderated mailing list, distributes press releases and announces new software releases. Subscribe to this mailing list by sending e-mail with the word Subscribe in the message to
java-announce-request@java.sun.com
The java-porting list discusses porting Java to different platforms. If you're interested in porting Java to a new architecture, this is the list for you. Subscribe to this mailing list by sending e-mail with the word Subscribe in the message to
java-porting-request@java.sun.com
The java-interest list is an unmoderated forum for discussing Java programming issues that aren't covered by the other lists. The traffic on this list is also sent to comp.lang.java. If you already read that newsgroup, you don't need to subscribe to this list. Subscribe to this mailing list by sending e-mail with the word Subscribe in the message to
java-interest-request@java.sun.com
|