grails (11) vaadin (11) meteor (6) java (4) elasticsearch (3) apple (2) centos (1) cloudbees (1) google analytics (1) gradle (1) heroku (1) javafx (1) javascript (1) jdbc (1) jug (1) logback (1) logging (1) mac os (1) management (1) mongodb (1) mongolab (1) mysql (1) twitter (1) ubuntu (1)

Saturday, August 13, 2011

How to add Vaadin Add-on into Grails project

Here is the new version of this tutorial for Vaadin 7: .../vaadin-7-and-grails-how-to-compile.html

I have spent quite a while by integrating Grails and Vaadin Add-on (I decided to use invient-charts). There are many things one has to do in order to get it working. The reason is that support of Vaadin Add-ons is not yet supported by Grails Vaadin plugin...

Versions: Vaadin plugin 1.4, Vaadin: 6.5.1, Grails 1.3.7
  1. Eclipse and GRails plugin - use this tutorial to get it work http://grails.org/STS+Integration 
  2. Create a GRails project (in this tutorial named "your-project") in Eclipse 
  3. Install Vaadin plugin http://www.grails.org/plugin/vaadin 
  4. Download and copy paste jar file into the lib folder: /your-project/lib/invientcharts-0.8.4.jar and add it to Java Build Path in Eclipse
  5. Add this folder to Build Path /your-project/grails-app/vaadin 
  6. Create your package structure and create widgetset configuration file: /your-project/grails-app/vaadin/com/yourproject/ui/vaadin/YourProjectWidgetset.gwt.xml
  7. Add the widgetset set to /your-project/grails-app/conf/VaadinConfig.groovy 
    vaadin {
        // ...
        widgetset = "com.yourproject.ui.vaadin.YourProjectWidgetset"
    }
  8. You have to update the creation of Vaadin page - because you want to use custom JavaScript (so you have to force Vaadin plugin to add it there) - as described in next step. Add the following code into this class: /your-project/.link_to_grails_plugins/vaadin-1.4/src/java/com/vaadin/terminal/gwt/server/GrailsAwareApplicationServlet.java. If you are using GAE, update the another class with GAE text in it's name.
    @Override
    protected void writeAjaxPageHtmlVaadinScripts(Window window, String themeName, Application application, BufferedWriter page, String appUrl, String themeUri, String appId, HttpServletRequest request) throws ServletException, IOException {
      super.writeAjaxPageHtmlVaadinScripts(window, themeName, application, page, appUrl, themeUri, appId, request);
      page.write("<script type=\"text/javascript\">\n");
      page.write("//<![CDATA[\n");
      page.write("document.write(\"<script language='javascript' src='VAADIN/jquery/jquery-1.4.4.min.js'><\\/script>\");\n");
      page.write("document.write(\"<script language='javascript' src='VAADIN/js/highcharts.js'><\\/script>\");\n");
      page.write("document.write(\"<script language='javascript' src='VAADIN/js/modules/exporting.js'><\\/script>\");\n");
      page.write("//]]>\n</script>\n");
    }
  9. Upload JavaScript from invient-chart package 
    1. /your-project/web-app/VAADIN/jquery/jquery-1.4.4.min.js 
    2. /your-project/web-app/VAADIN/js/highcharts.js + sub folders
  10. Compile the widget set (you have to use Ant because this is not supported by Vaadin plugin). Here is the file which must be modified (just go though and fill in missing parts or upload needed jars to "lib" folder). In case you don't know what version of gwt-user.jar and gwt-dev.jar you should use, check the release notes for your version of Vaadin:  http://vaadin.com/download/release/6.5/6.5.1/release-notes.html (you can download these jars from:  http://code.google.com/webtoolkit/versions.html
  11. One more thing, I am not 100% sure - but when you run "clean" then you have to update GrailsAwareApplicationServlet file again (it happens to me quite offten).
I hope that my notes helped you. If you have any questions, just ask me and I will try to provide an answer. 
TextLab for Mac
Ultimate application to validate, clean and format JSON, XML, SQL, HTML.

17 comments:

  1. Thanks a lot for the detailed instructions!
    However I am stuck at one point - maybe you know what the problem is:
    In VaadinConfig a property named 'servletClass' may be set which defines the application-servlet to be used (so you don't have to alter the servlets provided by the vaadin-plugin as mentioned in step 8). Now when I define my own servlet (extending GrailsAwareApplicationServelt, located in src/java) I get a NoSuchMethodError upon launching the grails-application:
    Caused by NoSuchFieldError: r$sfields
    ->> 186 | forName in java.lang.Class
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    | 89 | doCall in VaadinGrailsPlugin$_closure1
    | 140 | doCall . . . . . . . . . in VaadinGrailsPlugin$_closure3
    | 736 | invokeBeanDefiningClosure in grails.spring.BeanBuilder

    This happens on OS X (Java 1.6) and Ubuntu (Java 7).
    Thanks in advance and have a great day!
    Clemens

    ReplyDelete
  2. Hi Clemens,

    make sure you are using latest version of the plugin: https://github.com/ondrej-kvasnovsky/grails-vaadin-plugin/downloads (you should have 1.5.2).

    Installation instructions are located here: https://github.com/ondrej-kvasnovsky/grails-vaadin-plugin/wiki

    If you have the latest version, then check this code in plugin:
    https://github.com/ondrej-kvasnovsky/grails-vaadin-plugin/blob/master/source-code/VaadinGrailsPlugin.groovy#L158

    It says, that if you provide servletClass in VaadinConfig, it is going to be used then.

    If it doesn't work, then share your VaadinConfig and implementation of GrailsAwareApplicationServelt here please (or put it here http://pastebin.com/ and paste a link here).

    ReplyDelete
  3. Hi Ondřej,

    thanks for your reply and sorry for not replying earlier myself...

    I checked out the 1.5.2 version of the plugin and directly referenced it as plugin in my grails app. It all worked fine, as long as I didn't used a subclass of GrailsAwareApplicationServlet as application-servlet. Using the AbstractApplicationServlet as superclass and copying everything from GrailsAwareApplicationServlet to my own implementation did work, but is not the way to go...
    So I further investigated the issue and finally came to the conclusion, that the error (Caused by NoSuchFieldError: r$sfields) goes away, when I change the name of the package, where GrailsAwareApplicationServlet resides in, from com.vaadin.terminal.gwt.server to com.vaadin.grails.terminal.gwt.server.
    For me, it looks like Groovy, Spring, ... has problems resolving something (don't exactly know what r$fields refers to) because of the identical package name in grails-vaadin-plugin and the vaadin JAR itself... At least when you try to extend the class...

    Is there a reason why the package names are the same? Could they be renamed in the plugin (like I did), so that other people might not run into this issue?

    Another question I asked myself: Why is the Vaadin-JAR directly bundled with the plugin and not handled as a dependency, e.g.:
    dependencies {
    compile 'com.vaadin:vaadin:6.7.4'
    runtime 'com.vaadin:vaadin:6.7.4'
    }
    Any idea?

    Thanks a lot & have a great day,

    Clemens

    ReplyDelete
  4. Hi Clemens,

    packages - that is weird, but if the renamed version works, please try to commit/push it into the github project.

    dependencies - well, maybe just from some historical reasons, it would be lovely if you could push it there too.

    I will make a new version and we can test it then.

    ReplyDelete
  5. Well I guess I don't have write-access to the repo, do I? I'm pretty new to Github though...

    ReplyDelete
  6. Oh, yes sorry about that. I have added you as collaborator now. So you should be able to commit/push.

    ReplyDelete
  7. I did it the other way already and sent you a pull request for my commit in the projects fork :)

    ReplyDelete
  8. Good work, it is already merged with master branch! :-)

    ReplyDelete
  9. Regarding NoSuchFieldError: r$sfields, See http://jira.grails.org/browse/GRAILS-9016

    ReplyDelete
  10. It would be great to have this same process for Vaadin 7

    ReplyDelete
  11. That is true, I will publish it very soon on this blog... and it will be in http://www.packtpub.com/creating-rich-internet-applications-in-vaadin-7/book for sure (that is what keeps me busy nowadays).

    ReplyDelete
  12. Hi Ondrej,

    I have a problem, and I think the problem is with the plugin:
    After the recompilation of the vaadin-addons I get a folder-structure like this:

    web-app/VAADIN/js/app.AppWidgetSet/some.js


    and the application wants to load
    web-app/VAADIN/widgetsets/app.AppWidgetSet/some.js


    is there an easy way to change the location where the js-file is expected? my only working fix is to change the folderstructure, where vaadin expects the js

    with every new addon and every recompilation of the widgetsets I have to change the folder-structure again.

    I tried to find the GrailsAwareApplicationServlet but I couldn't find it and therefore I couldn't try to add the code from your article

    If the problem is within my build.xml, the compiler or something else please let me know and I will look into that.

    Thanks for the great work ;)

    greeting ZobbL

    ReplyDelete
  13. What version of the vaadin/grails plugin and Vaadin do you use?

    ReplyDelete
  14. The newest of both.
    Grails 2.2.2
    Plugin Version 1.7.5
    Vaadin 7(.0.6? Im not sure)
    Thanks for the fast response

    ReplyDelete
  15. I see, then you can't use this approach, this one is only for Vaadin 6. I wrote how to compile the widgetset for Vaadin 7 in this book: http://www.packtpub.com/creating-rich-internet-applications-in-vaadin-7/book and I also plan to publish it on the blog (unfortunately, I can't just copy paste it from the book, due to the agreement resctrictions...).

    ReplyDelete
  16. Alright, I should really top using a computer. After I checked my source (which actually was your book: http://www.packtpub.com/library/creating-rich-internet-applications-in-vaadin-7), I saw that just the paths within the build.xml differed and I highly suspect it was my fault.

    thanks for your time and sorry I bothered you
    ZobbL

    ReplyDelete
  17. Here is the tutorial for Vaadin 7: http://ondrej-kvasnovsky.blogspot.cz/2013/06/vaadin-7-and-grails-how-to-compile.html

    ReplyDelete