Hacking JSpecView: Enhancing the User Interface

Rich Apodaca — Fri, 01 Feb 2008 11:25:00 -0500

The last installment of this series showed how to set up an HTML testing harness for JSpecView. With the preliminaries taken care of, this installment will show how to enhance the user interface.

The Goal

The live applet shown above illustrates the changes that were made. As you move your mouse cursor into the spectrum area, you'll see a vertical red line appear and track the movements of the mouse. As you presss the mouse key to begin a selection, a grey rectangle will show you exactly where the selection area will be.

If you can't view the applet, be sure you system has JDK 1.5 or higher installed, and that you've enabled applets for your browser.

Clearly, these modifications need more work. For example, you can extend the selection box outside the boundary of the spectrum area. And green might be a better color for the cursor. Then again, maybe the cursor should use an alpha channel. But I digress.

One More Thing

Being a longtime Eclipse user, I prefer this tool for my Java development. So far, only the use of Ant has been described. Fortunately, Eclipse offers an elegant way to import an existing Ant project. File->New gives a dialog like the one shown below:

Selecting "Java Project from Existing Ant Buildfile" gives this dialog:

Filling in the fields as shown should give a fully-functional Eclipse project.

Still One More Thing

If you check the HTML source for this page, you'll notice that the applet tag is used to display the applet. Yet on Internet Explorer, there is no "click to activate" message. The reason is that Depth-First is using the excellent JavaScript library JActivating, which re-writes the applet tag so that it isn't detected by the Eolas workaround. This lets us stick with plain HTML, rather than using document.write to specify the applet.

Changing the Source Code

Too many changes were made to detail individually. In general, they related to:

Removing non-applet classes such as those involved with the desktop application.
Removing code flagged by Eclipse as unused.
Editing the jspecview.common.JSVPanel source to add the UI modifications. The drawGraph, drawCursor, and drawZoomBox methods contained most of the changes.

The complete Eclipse project should be available from SourceForge shortly.

Conclusions

Given the right tools, modifying JSpecView is not that difficult. We've gone from raw souce code to a complete Eclipse project, and even added some functionality in the process.

Where would you like to take JSpecView?

My Favorite Eclipse Shortcut: Quick Fix

Rich Apodaca — Fri, 11 Jan 2008 10:27:00 -0500

Eclipse is one of those great tools that is both easy to learn and extremely powerful. Eclipse's power comes, in part, from the number of features it offers, which seems to grow with every new release. This creates a problem though; the more features that are added to Eclipse, the more difficult it is to find them. This article focuses on one feature that every Eclipse user should know about: Quick Fix.

Let's say you're creating a class from scratch and you need to add a variable. Because you're working in Java, you'll also need to specify a type. If that type is one that doesn't already appear in the file you're working on, you'll either need to create it or import it. It may not seem like a big deal to scroll to the top of your file, add an import statement, and scroll back down to continue writing, but it can really break the flow of concentration - especially considering that it may need to be done several times in just one method.

Wouldn't it be great if Eclipse could handle this tedium for you?

Enter Quick Fix. In this example, we're creating a class called Molecule and need to add a List to hold its atoms. We begin by declaring the atoms variable:

Eclipse recognizes that List is a new type. Instead of manually inserting an import statement at the top of the file, let's use Quick Fix.

Highlighting the error and pressing [Ctrl-1] opens Quick Fix and gives us a list of options to choose from:

Quick Fix can also create a class or interface template instead of importing a class, as the screenshot above suggests.

We need to import the java.util.List interface. Double clicking on the Import 'List'(java.util) option inserts the import statement and allows us to continue writing:

Eclipse is packed with these kinds of useful but hard to find features. Future Depth-First articles will highlight some of them.