Is it possible to build stand alone widgets as opposed to full blown applications in GWT ? For example, I could use a create a slider widget as a jquery plugin and use it to add interactivity to my existing HTML page (which may be a JSF or JSF etc. generatd HTML) along side some other jquery based widgets from third parties on the same page ? Is this possible with GWT ?
Yes you can, and some of standard widgets have allready implemented static methods for attaching them without use of Rootpanel (so you can do "DOM programming"), for example look at HTML Widget. It has static method wrap for that purpose:
public static HTML wrap(Element element) {
// Assert that the element is attached.
assert Document.get().getBody().isOrHasChild(element);
HTML html = new HTML(element);
// Mark it attached and remember it for cleanup.
html.onAttach();
RootPanel.detachOnWindowClose(html);
return html;
}
so in your code you can use it for attaching widget to existing DOM elements:
HTML html = HTML.wrap(Document.get().getBody().getFirstChildElement());
//or using selector engine (maybe wrapped Sizzle?):
HTML html = HTML.wrap(GSizzle.findOne("div.someClass:first"));
you can make similar static method in your widget:
class MyWidget extends Widget {
public static MyWidget wrap(Element element) {
MyWidget w = new MyWidget(element);
w.onAttach();
RootPanel.detachOnWindowClose(w);
return w;
}
//Widget has protected constructor Widget(Element)
//but it only creates widget but onAttach is called as Widget
//is added to Parent Widget-Panel
protected MyWidget(Element e) {
super(e);
}
//"plain" constructor for widget-panel-workflow
public MyWidget() {
super(Document.get().createDivElement());
}
}
but crucial is to call widgets protected method onAttach before attaching to dom - it subscribes the widget to global dom event broadcaster, and call RootPanel.detachOnWindowClose on your widget to prevent memory leaks.
Short answer is yes. Basically your html page with have a container for the gwt widget with a specified id. Then in your gwt module you'd write this:
RootPanel.get("ContainerId").add(MyWidget)
Keep in mind this can get complicated, especially when if comes to communication betweek the gwt widget and the html page.
Have a look at GWT Exporter.
It was initially built to make Chronoscope usable by non-GWT developers: http://code.google.com/p/gwt-chronoscope/