General Interface Primer

There's now an open-source Ajax GUI builder called General Interface which looks quite promising. A bunch of components that are somewhat familiar to Swing developers. Of course, all logic is Javascript :-(

After installation, here some tips that could come in handy:

1. Look at the video tutorials, the best one for tables(matrix) isn't actually on that page, but here.
2. Defining Javascript functions doesn't always work, even after Save/Reload. Try to restart and reload the page before giving up.
3. You might sneeze at the package names, but trust me, in Javascript conflicts are easy to create. Here's a simple example on a function called jmsw.doAction(index) :

   
   // name of the package to create: jmsw
   jsx3.lang.Package.definePackage(  "jmsw", function(jmsw) {
    jmsw.doAction = function(index) // define doAction(index)
    {
      ...
    };
   });
   

4. Do Control+Click on a component (such as a button) to locate its definition in the 'Component Hierachy'.
5. Float a Palette to get more space or to move it to the bottom panel: Upper Right Corner of a Palette View, click on 'Floating'. Use Menu->Palettes to enable/disable a palette.
6. The 'XML Mapping Tool' always starts with the same default of ..Address.wsdl, but this will not be the one you will be working with. To change the default of this initial URI, edit C:\TIBCO\gi-3.8-max\GI_Builder\plugins\jsx3.ide.mapping\components\Inputs\wsdl.xml and search for 'Address, comment it out and add your own WebService URI:

   
          <!-- use different default for XML Mapping Tool:
          <strings jsxname="jsx_schema_wsdlurl" jsxvalue="jsxplugin://jsx3.ide.mapping/samples/Address.wsdl" jsxwidth="100%"/>
          -->
   
          <strings jsxname="jsx_schema_wsdlurl" jsxvalue="http://127.0.0.1:9876/rs?wsdl" jsxwidth="100%"/>
   

Ajax: Xpath-enabled Json queries

In the Ajax world, there is a big discussion about XML versus Jsonas a means of transporting data from the Server to the Browser. After looking at the first examples of using a DOM API in Javascript, I knew, I'll not be using XML in Javascript. Using Json instead, feels very nice and natural. But Json is just a means of transport. Nothing else. The simplisticclasses work, but no query language to select the interesting data before sending it over. If you structure your Web-Gui well, the resulting data should be simple. Hence no need for the complex XML structure. XML offers however, two goodies, I wouldn't want to miss: Object to XML serializers (e.g. XStream) and XPath to select parts of the XML. So my idea is this: why not marry both approaches ? Transform the Java object into XML, apply an XPath query to select what you really want and then transform the result to Json to send it over. Even more flexible, support a 'class' and 'method' (and an optional 'args') parameter to select which data to get. Here is how it works: 1) Ajax Request: On the Browser, request a Json object with parameters class,method, xpath:

requestList( "class=TibjmsAdmin&method=getTopics&xpath=/*/*/name",
"name",
isAsync,
topicList );

2) Java Method call: On the Server-side, this request will execute the method TibjmsAdmin.getTopics() and create a Java object with some code similar to this:

if( className.equals("TibjmsAdmin") ) { // TODO: use ClassLoader (security?)
 Object invokee = jmsAdmin;
}
... others ...

// get specified method on specified class
className = invokee.getClass().getName();
Class c = Class.forName(className); // className is TibjmsAdmin
Method m = c.getMethod(method,argClasses); // method is getTopics, argClasses is null

// invoke method and get return object
  returnObj = m.invoke(invokee, argObs);

3) Java to XML: the next step is now to serialize this Java object to XML. I like to use XStream for this purpose because its extremly simple and straight-forward.

XStream xstream = new XStream();
String xml = xstream.toXML(returnObj);

If the returned object does not produce the required results, you can do some magic by plugging in an XStream 'Converter' (not shown here). 4) Apply Xpath: Now that that we have the XML, we can apply the specified XPath to fiddle out the data that is really interesting for us. The following code will create a list of selected XML nodes.

    NodeList nl = XmlUtils.selectNodeList(docBuilder,xmlString,xpath);
StringBuffer sb = new StringBuffer("");
for( int i=0;i<nl.getLength();i++ ) {

  Node node = nl.item(i);
  sb.append("<" + node.getNodeName() + ">" );
  sb.append( node.getTextContent() );
  sb.append("" );
}
sb.append("\n");

5) Return Json result: finally return the Json object back to the Browser using the Json tools.

JSONObject json = XML.toJSONObject(xml);
  response.setContentType("text/plain");
if( out.equals("pretty") ) // pretty JSON
  response.getWriter().print( json.toString(2) );
else // or not
  response.getWriter().print( json.toString() );