Ajax for the Real World

The first release of SmartGWT Enterprise Edition is now available.

Download it here.  Check out the Showcase here.

What is it?

SmartGWT Enterprise Edition (SmartGWT EE for short) is to SmartGWT what SmartClient Enterprise Edition is to SmartClient - an enterprise version of the product that includes Java Server side functionality, additional tools, and a classic commercial license in lieu of the LGPL.

For teams with existing Java functionality, SmartGWT EE provides greatly accelerated integration with SmartGWT’s visual components.  In many cases it is possible to take existing Java methods in an application and bind a SmartGWT grid or form to those methods without writing any new code, simply by specifying what method to call in a DataSource XML file.

For those using Hibernate, it’s even simpler.  A Wizard within Visual Builder allows you to simply pick any registered Hibernate entity from a list, and SmartGWT EE will create a SmartGWT DataSource that provides full read-write binding to that Hibernate entity.  Just provide the generated DataSource to a SmartGWT grid or form with no other configuration, and you have a full CRUD UI: create, retrieve, update, and delete Hibernate-managed entities.  It can even execute the complex search criteria that the FilterBuilder allows a user to specify.  There’s no need to create redundant Data Transfer Objects (DTO’s), or worry about Hibernate-managed lazy associations between entities in your domain model. Only those properties mapped in the data source are passed to the client, and during updates only those properties that have been modified (and not the entire bean data) are sent from the client to the server with the changes transparently reflected in your server.

A corresponding Wizard exists for binding to database tables stored in any popular database, again with full read-write binding.  And in both cases, you can easily add business logic that runs before or after the Hibernate or SQL binding, which can modify the request before it executes, modify the output, or take any other action.

There’s even a “batch” version of the binding tool.  Do you have a large application with 1000+ Java Beans, or 1000+ SQL tables?  Make them all accessible to SmartGWT UI widgets in one step.  The batch version of the tool includes source code, so you can customize how generation is done.  Do you have Java annotations that could be used to drive UI behaviors like required:true or canEdit:false?  There’s sample code for that.  Do you need to show a special input control or add special validators wherever a field with a certain Java type is used?  Easy change.

This is ideal for large scale enterprise development:

1. you get all the benefits of model-driven development, including rapid prototyping and the ability to make pervasive changes driven by changes in the model
2. you retain full extensibility: you’re working with a UI platform that allows you to build completely customized interfaces where necessary
3. your customizations are minimal and easy to maintain; you don’t have to maintain the “code soup” typically output by code generator tools

SmartGWT EE future features

This first release of SmartGWT EE omits certain advanced components and services, including the CubeGrid and the Messaging module.  These are coming soon; we’ll be rolling out enhancements to SmartGWT EE at a rapid clip similar to what we’ve been doing with SmartGWT.

Also in this release, while Visual Builder is fully functional, it currently saves screens as XML files which cannot (yet) be readily converted into Java code for use outside of the tool.  These XML files are in SmartClient’s Component XML format and can be edited and re-loaded by Visual Builder (as with SmartClient).  Future versions of Visual Builder for SmartGWT EE will include tools to generate Java from this format, so any screens you build now are forward compatible.

Pricing

As part of the final release of SmartGWT Enterprise Edition, we’re introducing a new pricing level that works better for small teams, called SmartGWT / SmartClient Pro.  This product will have all of the client-side functionality of SmartGWT / SmartClient LGPL as well as server-side functionality similar to the 6.5.1 release of SmartClient Enterprise - server connectors, validation, basic Hibernate and SQL connectors, as well as Visual Builder - and will be offered at a price that approaches $600-800 per developer for a team license.  There will no longer be a distinction between an Intranet vs a Small Vendor Edition license.   In a nutshell this very closely matches the existing Enterprise offering, but is now less expensive.

SmartClient and SmartGWT Enterprise Edition will now come with a different license suited to larger deployments which will carry stronger legal guarantees (eg indemnity), and for that reason will also be a “Contact us” licensing level.  A handful of new features in 7.0 will be held back to the Enterprise level license, including two shown in the new SmartGWT EE showcase: a feature we call Transaction Chaining which is demonstrated in the Queued Master/Detail Add example, and the batch mode of the DataSource generator mentioned above.  Hence the need to announce the upcoming pricing changes today - further details on the feature breakdown will be posted soon.

Anyone who has already bought licenses to SmartClient Enterprise will be able to continue to renew at the currently posted pricing, which we will also continue to honor for the next 45 days (including any quotations).  So, now is a great time to purchase Enterprise Edition, as you have an opportunity to purchase the Enterprise feature set at slightly above the price of Pro, if one of our website licenses works for you.

About SmartClient 7.0

Everything discussed for SmartGWT EE above is also included in SmartClient 7.0.  Our apologies to users of the free version for the delay in getting a final release out (most enterprise customers opted to get certified on an interim build).  However, it’s worth the wait.  If we were to take a cue from the Mozilla foundation, who recently renamed Firefox 3.1 to 3.5 to reflect how much is new, we might have to skip a few numbers (kidding - we’ll stick with 7).  Stay tuned.

Yes, it’s true! A project has been underway for some time to create a GWT (Google Web Toolkit) wrapper for SmartClient.

The project, dubbed SmartGWT, will be made available under the same LPGLv3 license as SmartClient LGPL, with commercial licensing available as well. It will be hosted on Google Code with public SVN access, and external committers will be welcome to participate as with SmartClient LGPL.

We are happy to say that Sanjiv Jivan, the creator of another popular GWT wrapper, is involved in the development of SmartGWT. Sanjiv brings expertise in precisely the right areas, and with his help we’ve been able to make much more rapid progress with SmartGWT than would otherwise be possible. We expect a preview release sometime in late October to early November.

Our Approach

(if you’re asking ‘what is GWT?’ read “Why GWT?” below)

Anyone who has looked deeply knows that SmartClient is a vast, very complete system - a recent count is that SmartClient supports more than 4000 documented, supported APIs. Translated to Java, this number will be far larger.

For this reason, we’ve taken an approach of generating GWT code from SmartClient’s documentation, combined with hand-coding portions that can’t feasibly be generated. By tweaking our documentation set to contain additional metadata (some of it GWT-specific), we’ve been able to generate code you might not otherwise expect, including things like enumerated constants and convenience constructors.

What this means is that the first release of SmartGWT will provide the complete SmartClient API, fully documented. Out of the gate, SmartGWT will be the most complete GWT platform in existence. And of course, all future versions of SmartGWT will match the API set of the latest SmartClient release.

Why GWT?

GWT allows you to write Java code which is translated to JavaScript by a special compiler, so that it can be run in the browser. This is best explained by example:

You write Java like:

import org.smartgwt.client.*;
import org.smartgwt.client.widgets.Button;

...

Button button = new Button("myButton", "Click me");
button.addClickListener(new ClickListener() {
    public void onClick(ClickEvent event) {
        ISC.say("Hello World!");
    }
});

This means the same thing as:

isc.Button.create({
    ID:"myButton",
    title:"Click me",
    click:"isc.say('hello world!')"
})

There are many approaches for “hiding” JavaScript behind a server-side Java abstraction (such as JSF, JMaki, etc). All these approaches have a common flaw that any code you write in Java requires a trip to the server to execute. The more customization, the more trips to the server, throwing away the primary benefits of Ajax (scalability and responsiveness). In these frameworks, something like a custom drag and drop interaction is essentially impossible - it’s not realistic to contact the server every onmousemove().

GWT differs fundamentally from these server-oriented Ajax approaches. In GWT, the Java code you write actually executes as JavaScript in the browser. So you can write event handlers, drag and drop logic, even custom subclasses of SmartClient widgets, and all of this code executes in-browser, exactly as though you were using SmartClient directly via JavaScript.

In a nutshell, with GWT you get the robust toolset of Java and the performance and scalability of a true “smart client” architecture.

It’s also important to understand that, although you are using Java instead of JavaScript to build your UI, you aren’t tied to a Java server. You can use SmartGWT with any server technology supported by SmartClient itself, including XML or JSON services built in PHP, or WSDL web services. And that combination is still an entirely free, open source offering.

Get Involved

If you are interested in getting the absolute first available sneak peak of SmartGWT, or if you are interested in getting involved in the project, send email to smartgwt at isomorphic.com.

In the meantime, it’s important that anyone choosing platforms right now knows about this very compelling option.  Please help us spread the word - to your colleagues, and to the Ajax blogs and sites you read most!

Thanks,

              Charles

This is a sneak peak at some of the features planned for SmartClient 7.0.

FilterBuilder / AdvancedCriteria

The FilterBuilder is a form that allows the user to input advanced search criteria, including operators on field values such as “less than”, and sub-clauses using “AND” and “OR” operators.  See screenshot below:

As you can guess, the green plus icons allow the user to add new expressions and the button with a “+()” allows sub-clauses to be created, grouped by a logical operator.  As shown, the user has set up criteria that will find South American countries with some kind of federal government, above a certain threshold of either population or gdp.

Part of what’s cool here is how neatly this component fits into the existing DataSource system.  This is the actual code to create a FilterBuilder:

isc.FilterBuilder.create({ dataSource:”countryDS” });

The DataSource tells us what all the fields are, what all the field types are, and can optionally define what operators are allowed on which fields.  The FilterBuilder is type-sensitive, so for example, for a field of type:”date”, the FilterBuilder will show a date picker automatically.

All of this is highly customizable and extensible - you can even define new operators, and define custom FormItems allowing users to pick values to compare against - eg, if you define a “zipCode” type, maybe the picker opens a Google map.

The DataSource subsystem provides the ability to actually execute the search, client-side or server-side as necessary, similar to existing simple criteria searches.

This is another core ListGrid feature that, like grouping, frozen columns, inline filtering, charting, etc, can be enabled for any grid by just setting a flag.  The overall thrust here is to give end users the level of control over the data that ordinarily only the developers have access to.  That way the developers take more vacations

TileList

This is a component that renders objects in a grid of tiles, frequently found in online stores, photo sharing apps, directory sites and the like.  It has a rich set of UI interactions: rollover, selection (including shift- and ctrl-select), hoop selection, etc.  Animations and drag and drop are planned as well.

But again what really shines is the databinding system - TileLists are a DataBoundComponent, so they use a DataSource and ResultSet just like a ListGrid.  As with a ListGrid, you get a reasonable, type-sensitive default view by just binding to a DataSource, for example, fields of type “image” will actually show the image, as in the view above.  Likewise, because the TileList uses a ResultSet, it supports the full set of sorting, filtering, data paging, and other data-related features supported by a ListGrid, with the same APIs.

The TileList also has incremental rendering support, so it’s safe for use with very very large datasets.

The upshot is, because of the uniformity in how a TileList is configured and accesses data, a menu item on a ListGrid for “Show as tiles” makes sense, and we’ll have a ListGrid flag that enables this with no further configuration.

.. these are quite substantial features, but they are just a part of what’s planned in 7.0.  Stay tuned for more - we plan to make beta versions available via this blog for those who like to live on the edge.

Cheers