Include javascipt file in vaadin application

Vaadin 6 / 7 / 8
1

Hi,

My Requirement:

  2. Use single Browser window to display different web page content (Help information) on help Button click event.
  3. When help button is clicked : Set focus back on the allready opened Browser window when in case if the Browser window is minimized or behind other browser windows
  4. I am using vaadin 7

I have tried using BrowserWindow Opener but it does not serves my above mentioned requirement 2 as we do not get any handle to the opened browser windw in vaadin.
Related posts:

https://vaadin.com/forum#!/thread/4752167


https://vaadin.com/forum#!/thread/4731272

Now i understand that only way to implement the above mentioned requirements is through javascript.
For this i have written sample html/javascript code, but i am not sure how to use the same in vaadin application to achive the expected application behaviour.

Can anyone please help me on this, thanks in advance.

Following is the HTML/javascript code for the reference:

<html>
<head>
 <script type="text/javascript">
  var applicationHelpWindow = null;
  var previousUrl;

  function openRequestedSinglePopup(helpUrl)
  {
       /*If help window is null or closed - open new window*/
       if(applicationHelpWindow == null || applicationHelpWindow.closed)
           {
            applicationHelpWindow = window.open(helpUrl, "HelpPopup","resizable,scrollbars,status");
           }
       /*If help URL is changed - set new URL to existing opened window*/
       else if(previousUrl != helpUrl)
           {
            applicationHelpWindow = window.open(helpUrl, "HelpPopup","resizable,scrollbars,status");
            //applicationHelpWindow = window.open(helpUrl, "HelpPopup","resizable=yes,scrollbars=yes,status=yes");
           }
       
        previousUrl = helpUrl;
       
        /*set focus to application help window*/
        if(applicationHelpWindow != null)
            {
        applicationHelpWindow.focus();
            }   
          }
 </script>

</head>
 <body>
  <input type="button" value="Vaadin" onclick="openRequestedSinglePopup('https://vaadin.com/');" >
  <input type="button" value="Google" onclick="openRequestedSinglePopup('https://www.google.co.in/');" >
 </body>
</html>

Regards,
Kunal Patil

2

Have a look at
this page
 and the Using Javascript Section on
this one
.
One thing you could maybe do would be to integrate your javascript as an extension for the help button to capture the click event and send it to the client-side javascript connector using callFunction.
…and if you want even the html in your Vaadin page you can use a Browser (former Embedded) component to embed the entire page or use a customlayout to use the html as a template in which you can add your buttons.