How to embed a Smart GWT canvas into a GWT-Ext panel

[IGx89]

I know this is probably a few years too late, but for those people who still are supporting legacy GWT-Ext applications and are looking for a way to migrate them to Smart GWT in bits and pieces, here's something that might help you.

Our GWT-Ext app was far too large and our team far too small to do an entire rewrite all at once, so we came up with a wrapper class that allows us to embed Smart GWT canvases into GWT-Ext panels. Our plan is to slowly convert our UI to Smart GWT from the bottom up, on a per-tab basis, and this works wonderfully for us.

Class:

public class SmartGWTPanel extends Panel {
	
	private final Canvas canvas;
	
	public SmartGWTPanel(Canvas canvas, String title) {
		this.canvas = canvas;
		
		setTitle(title);
		setLayout(new FitLayout());
		
		canvas.setWidth100();
		canvas.setHeight100();
		
		// necessary so that the SmartGWT canvas properly responds to the panel being resized
		addListener(new PanelListenerAdapter() {
		    public void onBodyResize(Panel panel, String width, String height) {
		    	canvas.setWidth(width);
		    	canvas.setHeight(height);
		    }
		});
		
		addListener(new ComponentListenerAdapter() {
			// necessary so that the canvas elements get properly removed from the DOM
		    public boolean doBeforeDestroy(Component component) {
		    	canvas.markForDestroy();
		        return true;
		    }
			
		    // render the canvas on-demand instead of immediately (calling add(canvas) triggers an immediate render)
		    public boolean doBeforeRender(Component component) {
		    	add(canvas);
		        return true;
		    }
		    
		    // these show/hide calls are necessary so that the canvas can know when it's not visible
		    public void onShow(Component component) {
		    	canvas.show();
		    }
		    
		    public void onHide(Component component) {
		    	canvas.hide();
		    }
		});
	}
}

Script to prevent GWT-Ext Plus from being broken by Smart GWT javascript global pollution:

		<script type="text/javascript">
			// necessary due to GWT-Ext Plus -- without this over-override, deserializing of data fields on beans fails
			isc.addMethods(Date, {
				parseDate : function(A,C){
					if(Date.parseFunctions[C]==null){
						Date.createParser(C)
					}
					var B=Date.parseFunctions[C];
					return Date[B](A)
				}
			});
		</script>

You'll also need to make a small tweak to ext-all.css, removing the td element from the first line (Smart Client wasn't designed to work with CSS reset).

Hope this helps someone!