Aug 23, 2012

Using third-party JS libraries in SmartGWT

Although GWT frameworks and include it their words "richest set of GWT UI components", in fact, it turns out, for example, that their ability to visualization a very, very limited or practically absent in the free version (SmartGWT). As a result, finding the desired functionality in the libraries of JavaScript, in sight seeing such wonderful things as Raphaël and D3.
In fact, it turns out that the use of Smart GWT's extensive server-side components are not as easy as expected. How to do this is described below.
First, came the idea to use HtmlFlow, especially since this class supports the method:

setEvalScriptBlocks(Boolean evalScriptBlocks)

After futile attempts, i found information that this method is not suitable for our purposes.

JSNI - JavaScript Native Interface best suited for this task. In short, you create a native Java method and conclude your JavaScript code in a special comments:

Inside the method, you can access to class fields, using the signature:

obj.@className::fieldName

Also you can access to static and instance class methods:

[instance-expr.]@class-name::method-name(param-signature)(arguments)

I want to mention one more important thing. Your JSNI JavaScript code will be slightly different from the standard JS code that may need to use $wnd to access window object and $doc to access document object. If you get a JavaScript error on the page, "JavaScript library is not found", even though it has access from WEB-server - this is exactly the case.

Another detail - you can not use java arays even primitive types like String [] or int [] in your JSNI code. It is unclear why the developers are not yet implemented this feature. Instead it is proposed to use JsArrays:

Heiko, meaning a solution that receives data is by calling not a java method, but which uses a REST service with data in JSON format.Because GWT requests to the server asynchronously, and receive data at the library means synchronous, You have to write additional code that leads to the GWT request to synchronous form. Since REST request \ response are synchronous, we have a significant advantage.