GSOC2008: Integrating Rolodex to Guvnor

In Guvnor, there are many different widgets that are used to display or edit different assets. One interesting widget is about to be added - a widget that could accept images and display them. For this purpose, rolodex, a widget that can display a stack of images, can be used. Rolodex uses deferred binding for the image generation and animation. Let's see how can we quickly add a new widget displaying some predefined images.

First, create a class, implementing RolodexCardBundle interface (from the rolodex library) and declare a few methods that will return the images (just like ImageBundle described in the book):

public abstract class Images implements RolodexCardBundle {

    /**
     * @gwt.resource img_3861.jpg
     */
    public abstract RolodexCard imgA();

    /**
     * @gwt.resource img_3863.jpg
     */
    public abstract RolodexCard imgB();

    /**
     * @gwt.resource img_3865.jpg
     */
    public abstract RolodexCard imgC();

    ...

    private final RolodexCard[] cards = new RolodexCard[]{
            imgA(), imgB(), imgC()
    };

    public RolodexCard[] getRolodexCards() {
        return cards;
    }

Next, to display those images, create ImageSetWidget (or you-name-it) class extending DirtyableComposite:

public class ImageSetEditor extends DirtyableComposite {
  // asset and viewer are not used now...
  public ImageSetEditor(RuleAsset asset, RuleViewer viewer) {
    final Images images = (Images) GWT.create(Images.class);
    final RolodexPanel rolodex 
         = new RolodexPanel(images, 3, images.imgA(), true);
    initWidget(rolodex);
  }
}

For Guvnor to be able to launch the editor, we have to modify EditorLauncher class:

...
else if (asset.metaData.format.equals(AssetFormats.IMAGE_SET)) {
  return new ImageSetEditor(asset, viewer);
...

AssetFormats should be supplied with the new constant for this new type, of course.

To allow user to create such widgets in UI, a new menu item needs to be added.


This means, ExplorerLayoutManger#rulesNewMenu() should be modified:

m.addItem(new Item("New ImageSet", 
  new BaseItemListenerAdapter() {
    public void onClick(BaseItem item, EventObject e) {
      launchWizard(AssetFormats.IMAGE_SET, "New ImageSet", true);
    }
}, "images/rule_asset.gif"));

And last, but not least we need to include the following line in Guvnor.gwt.xml:

<inherits name='com.yesmail.gwt.rolodex.Rolodex'/>

Now, after the project has been rebuilt and redeployed we get the following widget on the screen:


Currenly, the widget is displaying a predefined set of images and animates them as we roll the mouse over. So we have now a rolodex-powered widget inside Guvnor. Sounds cool! :)

Now, there are a lot of TODOs to make use of this new cool widget.

• Menus should be pluggable. So far I knew that the only class that we should generate in order to support adding new rule editor widgets. Without doubt, a user needs a button to create the widget in his workspace, and therefor we should inject the new menu item. I suppose we can generate this part also. Therefore we need to extract the ExplorerLayoutManger#rulesNewMenu() method into a separate class.
  Currently I have an ant task ready to generate a new EditorLauncher class source to plug a new asset type editor. But perhaps, if we have more of these classes to be generated, I'd better add a new ruby script to do this job.


• Upload of new images. There's no use of this widget if it can redisplay only the predefined set of images.
  
  
  


• RuleAsset support for images.The images should be supplied via the RuleAsset, i.e. the content should be a class that could represent a set of images.
  
  


• A content handler is required as well.