how to create custom widgets to overlay other libraries?

[demer]

Hello,

I work in an environment where there is a lots of pre-written javascript that works really well for what the app does. Now, we want to utilize smartgwt with our app. For this, we need to write smartgwt widgets which overlay our widgets and javascript. This causes problems because our JS does not understand smartgwt's dom hierarchy or event model. there is plenty of documentation on how to create a plain gwt custom widget and make with the rest of GWT code. I have not found anything so far on how to create custom widgets with smart though. I am finding my way through reading code on VLayout, Button and other widgets in smartgwt. It looks like merely extending from Canvas or VLayout does not do the trick. Would anyone know how to do this?

Again, I am not trying add gwt widgets to smartgwt or inter mix any other library. i want to write pure smartgwt classes that overlay pre-existing javascript.

Thank you!

Demer

[Isomorphic]

To create custom SmartGWT components just use standard Java techniques of subclassing and composition. There is no need to read framework code to do this. Some advice for typical scenarios is in the Extending SmartGWT chapter in the QuickStart Guide.

As far as "overlay pre-existing JavaScript" - what specifically do you mean?

Do you want to call pre-existing JavaScript methods that represent just calculations such as amortization? This is done using standard JSNI.

Or do you want to embed some non-trivial widgets which use JavaScript to generate DOM elements?

[demer]

last option in your response. we need to write smartgwt widgets to wrap existing JS that creates non-trivial widgets. so, our widgets might fire events that need to bubble up, our widgets need to know about resize and our developers who are already used to smartgwt need to be able to use these new widgets just the way they use smart gwt today. can that be done?

[demer]

further info: our existing JS makes one div element and creates its stuff inside the div. we need to add that div to the smart gwt widget hierarchy so that it will behave like a smart gwt widget.

if i copy past the same pattern in which other smart gwt widgets are created, I end up with code as attached and an error message that looks like this:

Caused by: com.google.gwt.core.client.JavaScriptException: (TypeError): Cannot call method 'create' of undefined
arguments: create,
type: non_object_property_call
stack: TypeError: Cannot call method 'create' of undefined
at [object Object].<anonymous> (unknown source)
at __gwt_jsInvoke (http://127.0.0.1:8888/citi/hosted.html?citi:76:35)
at eval at <anonymous> (http://127.0.0.1:8888/citi/hosted.html?citi:54:12)
at unknown source
__gwt_ObjectId: 40
at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:237)


Thank you!

last option in your response. we need to write smartgwt widgets to wrap existing JS that creates non-trivial widgets. so, our widgets might fire events that need to bubble up, our widgets need to know about resize and our developers who are already used to smartgwt need to be able to use these new widgets just the way they use smart gwt today. can that be done?

[Isomorphic]

Stop looking at SmartGWT internals, you're just confusing yourself. What you're trying to copy has to do with how SmartGWT works with SmartClient and has no relationship at all to the right approach for integrating with some other homebrew JavaScript.

Instead, the Extending SmartGWT chapter in the QuickStart Guide explains what to do: create a Canvas subclass that contains your own HTML and CSS template code.

Typically, you would just override canvas.getInnerHTML(), return HTML for a DIV that has a known ID, and have your JavaScript code generate it's content into that DIV.

We don't know anything about how your existing JavaScript does event handling, so it's hard to provide any specific recommendations there other than needing to use JSNI to do this, however here again, *don't* try to use the SmartGWT event system as a guide, it's entirely specific to SmartClient and not an approach that makes to copy for other JavaScript.

[demer]

That makes sense. Initially, I did not have any success with the "Extending SmartGwt" chapter, however, with a few tweaks to our js and the extended smart gwt widgets, it is all working well now. What was missing was a number of calls that our JS expected from the widget code before it could be completely inited. Thank you.

Stop looking at SmartGWT internals, you're just confusing yourself. What you're trying to copy has to do with how SmartGWT works with SmartClient and has no relationship at all to the right approach for integrating with some other homebrew JavaScript.

Instead, the Extending SmartGWT chapter in the QuickStart Guide explains what to do: create a Canvas subclass that contains your own HTML and CSS template code.

Typically, you would just override canvas.getInnerHTML(), return HTML for a DIV that has a known ID, and have your JavaScript code generate it's content into that DIV.

We don't know anything about how your existing JavaScript does event handling, so it's hard to provide any specific recommendations there other than needing to use JSNI to do this, however here again, *don't* try to use the SmartGWT event system as a guide, it's entirely specific to SmartClient and not an approach that makes to copy for other JavaScript.

[amcculley]

Sorry to open a somehwat older post but I have a question sort of along the same lines.

When extending existing SmartGWT Java Objects, is there a best practice in terms of overloading the parent constructors?

Most of the items seem to have 2-3 constructors... one of which tends to be a JSObject parameter. When we extend SmartGWT classes, do we need to concern ourselves with adding any custom code to this constructor or can we leave it as default and have it call super(JSObject)?

For now, my developers are ignoring the JSObject constructor and just overriding the other constructors, always calling super() first and then putting in our custom constructor stuff.

Is this safe/okay to do or will we run into problems later?