| CustomJSB

Building the CustomJSB Component

JavaScript Bean re-usable components can be made even more powerful by adding a Customizer. By specifying a Customizer, the user of a JavaScript Bean can be presented with an easy-to-use graphical interface that assists the user in setting up the component for use.

A JavaScript Bean Customizer, like a customizer for a JavaBean, is written in Java and works in an almost identical fashion. For information on building a Customizer for a Java Bean, see the CustomProperty sample.

This sample shows a simple JavaScript Bean for animating a message in the browser status bar. The code for the JavaScript Bean contains a JSB_DESCRIPTOR that specifies the customizer class:

       <JSB_DESCRIPTOR NAME="netscape.samples.widgets.ScrollingBanner"
                       ENV="client"
                       DISPLAYNAME="Scrolling Banner"
                       SHORTDESCRIPTION="JavaScript Scrolling Banner"
                       CUSTOMIZER="netscape.samples.widgets.ScrollingBannerCustomizer"
                       HELP_URL="netscape/samples/widgets/ScrollingBanner_jsb.html">

The Customizer is a Java class file which extends `java.awt.Panel` and implements `java.beans.Customizer` and `netscape.palomar.beans.NSCustomizer`. The class "java.beans.Customizer" is a standard JavaBean interface from the BDK, and NSCustomizer is provided with the CDK in the `CDKINSTALL/samples/utils` directory.

The Customizer provides a textfield for setting the message and speed properties of the JavaScript Bean, as well as providing a preview of approximately what the message will look like when scrolling in the status bar. The animation algorithm has been ported directly from JavaScript to Java (due to their similarities, it is very easy to move well-structured code from Java to JavaScript or vice-versa). Take a look at the code in the `paintScroller` method in the ScrollingBannerCustomizer source. Upon comparison with the code in the JSB, you will note that the paintScroller method is very similar to the code for the method "start" in the JSB which gets called over and over using a JavaScript timer.

The CustomJSB.jar file is created from a batch file / shell script that compiles the Java class for the Customizer, and prepares the JSBDoc and JavaDoc for the appropriate classes (the automatically generated files will serve as the documentation for this example). The results are placed in a JAR along with the icons for the component, using a manifest which notes that the CustomJSB JavaScript Bean (JSB) is a JavaBean:

`CustomJSB.mf:`

    Manifest-Version: 1.0

    Name: netscape/samples/widgets/ScrollingBanner.jsb
    Java-Bean: True

To build a simple Web Application, simply import the JAR file containing the JSB into the palette. Drag the component to a new page, and wire the onLoad event for the document's body to the "start" event in the component. Now double-click on the component in the page, to set the message. Instead of a default Inspector being instantiated, you are now presented with a complete GUI for controlling your re-usable component's behavior! Of course, the user can always choose to return to the default inspector and set properties that way. With the power of the JavaScript Bean component architecture, when a property that is updated by the user via the Customizer, the new value is instantly reflected in the inspector, and vice-versa.

By providing a complete GUI for customizing your re-usable JavaScript component at design-time, end-users of your component will be able to use your code in an even more efficient manner.

( return to the top of the page )