Even with colorful text and images, most Web pages are static. Java applets help you create animated and interactive Web pages without tedious programming.

While Java programming can be learned by C and C++ programmers, most Web designers don't program. This class provides hand-on experience for non-programmers to use Java applets as building blocks to create more effective Web sites. You explore Java applets step-by-step and learn how to embed them into your Web pages. At the end of the class, you will have learned how to find the applets you need and use them for effective site design.

This course provides hands-on instruction in the UC Berkeley Extension Computer Training Facilities in San Francisco.

Prerequisite: Familiarity with HTML and Web page design or completion of Enhancing Web Pages with HTML.

Course information: (510) 643-6904

MICHAEL WOLFE, M.S., is Vice President of Engineering at Kana Communications, a startup software company focusing on enterprise email support solutions. He has been teaching computer science and developing real-world systems for 10 years at Stanford University, Goldman Sachs, and Wells Fargo. His prior position was as a Director of Engineering of Internet Profiles Corp.

June 20, 8:30 am-5:30 pm UC Extension Downtown, 150 Fourth St. (Near Moscone Center at Howard)

• Introduction
• Java fundamentals
• Where to find Java applets
• Running Applets within a Web Browser
• Adding a Java Applet to HTML
• Customizing Applets Settings

• Enhancing Web Pages with Java Applets for Non-Programmers
• Credit, laboratory course
• We're going to have fun!

• WWW site designers
• Intranet engineers
• Hobbyists
• Might be programmers, might not
• Some HTML experience...this is not an HTML class

• Michael Wolfe (wolfe@cs.stanford.edu)
• Software engineer/manager
• Internet technologies
• Java programming and design

• Talk about what Java is and what it is good for
• How to find Java applets
• How to use Java applets
• Examples
• Exercises
• Project
• Next steps

• Some lecture
• Mostly hands on with demos and help from me
• We'll use my lecture notes as the starting point
• We'll surf the WWW a lot

• You have a machine
• You can use either Netscape or Microsoft browsers (3.0 or above)
• You can use notepad as your text editor
• You can get applets from http://www.vivids.com/ij2.
• We'll pull lots of stuff from the net
• Work with your neighbor
• I might also ask you to share some of what you have done

Java Fundamentals

Java is a language, platform, and religion

• Similar to C++ with some improvements
• Designed for small consumer devices by Sun, but really took off via Internet boom
• Object-oriented, secure, networking, multi-threaded, other buzzwords.
• It is a nice language, but it still requires development skills to build programs
• New tools are making it easier, though

• Libraries for user interfaces, networking, databases, multimedia, I/O
• Build platform-independent programs
• Theoretically can replace Win32, UNIX, Mac
• This is the center of the controversy....which model of computing will prevail: proprietary or open?

• It is a "miniature" application, usually with a single function
• Usually means that it runs within a WWW browser
• Often loaded, used, then discarded. "Disposable" software
• Security restrictions: no access to local resources, no network connections except back to original server
• Traditionally, they have been "cute": animations, banners, etc.
• But, they are getting more sophisticated: online commerce, product configuration, database queries, etc.

• Can do all of the things that any application in any other language can do
• Fewer security restrictions than applets
• Are usually platform independent, although platform hooks are appearing
• Cannot be run through a browser
• We won't look at applications in this seminar

• http://www.espn.com
• http://www.sportsline.com
• http://best4x4.landrover.com/?vehicles/vehicles.html.
• http://www.onr.com/user/jeff/pegd3.htm
• http://www.ginsberg.com/swine
• http://wco.com/~rmd/mort.html

• "God gave you eyes, plagiarize."
• The Instant Java book (http://www.vivids.com/ij2
• http://www.gamelan.com
• http://www.yahoo.com
• Write them

Example, from ESPN:

< APPLET CODEBASE="http://scores-espn.sportszone.com/java" 
CODE="starwave.sportszone.scorepost.ScorePost.class" vspace="1" 
WIDTH="128" 
HEIGHT="182" 
ARCHIVE="ScorePost.zip">
< PARAM NAME="cabbase" VALUE="ScorePost.cab">
< PARAM NAME="bgcolor" VALUE="#638494">
< PARAM NAME="text" VALUE="#FFFFFF">
< PARAM NAME="data" VALUE="/cgi/scoretracker/databuffer.dll?/scoretracker/scorepost/data/all.dat">
< PARAM NAME="ad data" VALUE="/ad/scorepost/all.txt">
< PARAM NAME="target" VALUE="_top">
< PARAM NAME="delay" VALUE="3500">
< PARAM NAME="data time" VALUE="30000">
< PARAM NAME="inactive data time" VALUE="300000">
</APPLET>

The <APPLET> tag

• Required
• Several optional settings
• Wherever this is put in the HTML page is where the applet will be put...it can be anywhere on the page, even in a table or frame
• There can be multiple ones per page

• Required
• Gives the name of the primary class
• Can be absolute or relative
• CODEBASE can define where to find it

• Optional
• Gives a directory, either relative or absolute, where the applets files can be found
• Without it, the CODE setting defines where the files are

• Required
• Controls, well, the height and width of the area that the applet is put into

• Optional
• Designates a compressed file that contain all of the .class files for the applet

• Control settings that the author of the applet has defined
• This is where most of the customization occurs
• The set of available PARAMS for an applet defines the API

http://www.vivids.com/ij2/assorted/Ticker.html

To get set up:

1. Create a working folder for this class
2. Click download to get the .zip file
3. Put it into your working folder
4. Unzip it
5. Click on Ticker.html
6. It should work the same way it does on the http://www.vivids.com site
7. You can now edit Ticker.html to get going

Things to try:

1. Change the HEIGHT setting
2. Change the WIDTH tag
3. Change the "text1" param
4. Add a "text3" param
5. Try different fonts: TimesRoman, Helvetica, Courier, Dialog, DialogInput, ZapfDingbats
6. Try different styles: Plain, Bold, Italic, BoldItalic
7. Play with the delays to see what happens
8. Find a new background out on the net somewhere, load it, and change it
9. Put two banners on one page
10. Change CODEBASE to point to where this applet resides on www.vivids.com/ij2. Hint: you need to look at the page source for the ticker example on the site and try to figure out where the .class file is.

http://www.vivids.com/ij2/text/WaveText.html

Things to try:

1. Change Text
2. Change TxPointSize
3. Change WaveLength
4. Change Amplitude

http://www.vivids.com/ij2/text/Stencil.html

Things to try:

1. Same as above (Text, TxPointSize, etc.)
2. New image
3. Set the TxUrl PARAM

• Look at the applet at http://java.sun.com/applets/BarChart/1.0.2/example1.html.
• Build a WWW page that uses the applet by pointing CODEBASE to the address at Sun where the applet is.
• Now, download the applet to your local machine and change CODEBASE to load the applet from a local directory.

http://www.vivids.com/ij2/assorted/Coalesce.html

Things to try:

1. Change the string
2. Change Steps
3. Change DelayBetweenChars
4. Change text size and style

http://www.vivids.com/ij2/fund/Audio.html

http://www.vivids.com/ij2/image/WaveImage.html

Things to try:

1. Amplitude
2. WaveLength
3. BeginRange, EndRange
4. New graphic

• Platform independent
• Security
• Ubiquitous
• Performance
• Capabilities
• Hype

• ActiveX
• More powerful
• Windows-only
• Security issues
• Appropriate for MS-only environments.
• Javascript (an example. )
• Integrates well with HTML.
• Can do some lighweight client-side processing.
• Ubiquitous.
• VBScript
• Similar to JavaScript, but Windows and IE only.
• Dynamic HTML
• Example.
• Example.
• Other examples.
• Allows you to change and move HTML elements around on the page.
• Usually used in conjunction with JavaScript.
• Will become standard and very common.

• Java 1.2
• Java Foundation classes (JFC)
• Performance improvements
• Relaxed security
• Platform-specific hooks

• Download the applet.
• Try changing the fonts and colors.
• (Useful key to colors is here)
• Try changing the date format.

• A WWW site with some useful navigation applets is http://www.liquidcoolresearch.com/java.
• Very useful applet at this WWW site.
• Look at the example.
• Read the documentation.
• Download and unzip it.
• Change the background image.
• Try different fonts and colors.
• Add and remove menu items.

• Very useful applet at this WWW site.
• Download into a separate directory. Unzip.
• Look at TreeView.html.
• Now, look at TreeView.dat (this is where the interesting part is).
• Remove some nodes.
• Add some nodes.
• Find a very small .gif out on the net and use it.

• Very useful applet at this WWW site.
• Download into a separate directory. Unzip.
• Try changing the graphics and the hyperlinks.

http://www.netcharts.com

Steps:

1. Find a demo applet
2. "View Source"
3. Save the HTML to a local file
4. Change CODEBASE to point to http://www.netcharts.com/netfactory/classes
5. Play with the parameters to make your own charts

1. Sun applets.
2. A Calendar applet.
3. A clock.
4. Java boutique.
5. Java Applet Reviews at JARS

Create your own WWW page from scratch

It should contain several applets, both from our book and from the WWW

Spend about 45 minutes on it

• Practice, practice, practice
• Keep browsing and looking for cool applets
• Keep track of Java developments
• Learn how to program and build your own applets