Tour plugins integration (Tourist.js etc.)

[faycalz]

Hi everyone,

I'm thinking about integrating an interactive tour tutorial (like Tourist.js) in my app.
Has anyone come accross this kind of plugin, and what are the best practices for a good integration ? :
1. One of the issues i'm facing is that that plugin relies on dom element IDs, but SmartGWT abstracts dom elements IDs management.
2. Another issue is that SmartGWT apps are Ajax based, therefore how can the plugin wait for not drawn items to show... etc.

For issue 1, I thought about using the scLocator, which is used for Selenium testing, to be able to get the appropriate widgets in each tour step, but it doesn't seem to exist any public method to get a widget from its scLocator (or maybe a just missed it).

For issue 2, I have no idea, any inputs are welcome :-)

Thank you for your help !

(I'm using SmartGWT Power 4.1)

[Isomorphic]

Take a look at the DOM Integration overview (in general, and because it specifically addresses point #1).

We're not sure what your question is on #2. SmartGWT already has dozens of event handlers and callbacks you can use to wait for various asynchronous things to complete.

[faycalz]

Thank you Isomorphic, I had a look at Dom Integration javadoc - which was an interesting reading.
But it seems like the suggested ways to interact with the dom require to be already planned when writing the webapp code (by adding inner html for example).
Because the tour tutorial might evolve differently than the webapp (by adding/removing steps etc. depending on user feedbacks), I'm looking for a way to interact with the widgets without altering the code of the webapp (kind of additional layer, similar to the way the AutoTest interacts with the widgets by using the scLocator : the webapp should be agnostic to the tour plugin).

It seems like I would need something like the AutoTest.locateByScLocator() method which I found in the selenium extension script.

About point 2. I was clearly out of scope, my need is not related to SmartGWT.

Thanks !

[Isomorphic]

Since getInnerHTML() can return anything you want based on any data whatsoever, no there is no issue with anything having to be planned in advance - the system is fully dynamic.

[faycalz]

Dynamic or not, one must have access to the code of the smartgwt app to use the getInnerHTML() the way you suggest - which as mentionned earlier in my second post is not what I need/want.
Thanks however.

[Isomorphic]

So again, getInnerHTML() can return anything you want based on any data whatsoever: some value provided by a third-party library, a URL param, something typed in by the user, a database value, whatever.

There would never be a need to modify the code of the SmartGWT app to perform this kind of integration. This is elementary stuff.

[faycalz]

Hi,

Said differently, the problem is I can not find a way to get references to smartGWT widgets from a third-party script (without touching the smartgwt app code - this is important), since we can not use getElementById.

I just can't see how a getInnerHtml function can accomplish that, nor any of the Dom Integration techniques in the javadoc (the code samples are not applicable to this case).

Would it be elementary enough to show me a short sample of code please ? ;-)

Thanks.

[Isomorphic]

You are probably missing the solution because it is so simple.

Pick any ID you want that your third party library can target. Have getInnerHTML() return a <div> with that ID. That's it.

[faycalz]

Yes this is what is explained in the doc, but this requires me to override the getInnerHTML() of the widget, doesn't it ?

[Isomorphic]

Yes. And this is a trivial thing to do, just define a getInnerHTML() method just like you would do when subclassing any other Java class.

SmartGWT certainly has no limitations in this area. If you need more help with this simple scenario, please consider purchasing support.

[faycalz]

I agree this is simple and very clear in the doc and in your answer.

But overriding the getInnerHTML() is modifying the smartgwt-based app which is not what I want as mentionned in my previous posts.

Thanks.