if you really want to do this through Javascript, i think you have to look at the Vaadin mechanisms to do so.
Here are some Vaadin / CUBA docs on that:
I’m not really sure if this works, but it is probably the best starting point (technically it is definitively interesting). Nevertheless, can you explain a little bit more in detail how you want to communicate through the tabs?
With “1. A child browser window is opened…” you mean a totally different application that will act like a remote for the CUBA app, or are you talking about another screen of the CUBA app that should update the first CUBA app tab?
However, can you explain the use cases that you want to establish besides opening a screen? In fact, opening a screen is easily possible without using javascript hooks at all… I wrote a blog post a few month ago about it: Deep Links for Resources – Road to CUBA and beyond...
Basically since the state of the screens is stored on the web server, when you open a link in the browser (like described in the blog post) CUBA will add another “in-app tab” with the desired screen while the other screen is still accessible, without the need to login etc.)
But depending on other communication patterns you want to do, it might be worth trying out to implement some kind of JS hook.
I want to host a map in a new browser tab (not the Google map that Cuba supports already). The use cases are these:
From a Cuba browse screen, open a new child window that hosts the map. Pass as parameters to the window the id(s) of the selected records in the browse screen.
From the map, select one or more records and pass their id(s) to the Cuba application. It looks like this could be done using the
Javascript.getCurrent().addFunction()
method but I’d want to do this at startup somehow so I could have “myFunction()” available from any screen.
For the second use case, is it possible to programmatically create/update record sets in the folders panel?
But how do you want to communicate from the google map tab back to the CUBA tab only through javascript? This is generally not possible due to the security restrictions of the browsers. See here for more information.
My example with addFunction has been in the CustomerBrowser just because of convenience. You can add it to any screen (or add it to the mainwindow).
For opening the different elements from the CUBA app i would just use openWebPage method in the controller. For opening screens in the CUBA app, you can use the above mentioned method. This should be far easier…
If you want to make JS function available for any screen - just initialize it in the main window. You can extend mainWindow from CUBA and add your init logic to the ready life cycle method. In this case function will be initialized at mainWindow initialization.
Thanks for sharing your recipe! It can be slightly improved. You can override CubaBootstrapListener bean and include your JS overriding to the header of HTML page instead of eval.
Actually, I do not recommend overriding window.open, it is too invasive and can be broken in the future. You can use your own window.open code with eval (instead of showWebPage call) and at the same time register your child windows somewhere.