Vaadin and Scala

Just a quick FYI, I ported the TouchKit 2.0 addressbook example (
video
) to Scala using scala-wrappers. It was very easy, the entire process took less than 30 minutes.

Source can be found
here
, and I also deployed a
demo
that should work with iOS, Android and regular browsers.

The project includes a trivial wrapper over some of the TouchKit components, but even that included the SLOC count was reduced by about 50% compared to the original Java version.

Just released version 0.1 of
scala-wrappers
in Vaadin Directory!

Henri,

Great job! I’ve begun to integrate your work into a current project of mine.

What would be the best way to collaborate on this library in the future? Please let me know, as I would love to contribute.

Best regards as always,

Steve Thompson

Nice work!
Keep it coming.

Henri, how about moving the project to github? Forking and pull requests would make it easy for others to contribute.

That’s a good idea. I’ll move the source codes to github.

scala-wrappers can be found from github now:
https://github.com/henrikerola/scala-wrappers
!

My Devoxx presentation about Vaadin, Scala and HTML5 can be seen here:
http://www.youtube.com/watch?v=vk1FYcdBVKM
.

The slides are here:
http://www.slideshare.net/hezamu/using-vaadin-to-create-html5enabled-web-apps-in-pure-scala
and the sources for the demo app are here:
https://github.com/hezamu/Devoxx2011
.

And yes, I used scala-wrappers in the demo :slight_smile:

If you are considering of joining the
Vaadin cruise to JFokus
this year we’ll have some interesting news for you soon :slight_smile:

Great work on promoting Vaadin development with Scala and making it even easier/better :slight_smile: I just wrote a little blog post on using Twirl templates together with Vaadin and Scala so if anyone here is interested you can find it
here

Cheers !

I hadn’t run into Twirl before, it looks pretty nice. Thanks for the blog post!

Following the discussion on
this
StackOverflow question, specifically Henri’s answer (hezamu), here’s what I’m doing on my current Vaadin + Scala project.

I’m not using scala-wrapper because when I started it was still in a very early stage, and also I wanted to improve my Scala by making my own wrapper.

My goal has been to create the
MINIMUM
amount of code to make Vaadin nicer to use in Scala.
Also, I’m relying
ONLY
on implicit conversions (aka pimp-my-library pattern), thus avoiding sub-classing Vaadin’s components.

Main implicits: defining listeners. Here’s a sample:

//button click listener
 class PimpedButton[B <: {def addListener(listener:Button.ClickListener):Unit} ]
(btn:B ){
      def onClick(fn: Button#ClickEvent  => Unit):B = {
        btn.addListener( new Button.ClickListener(){
	       def buttonClick(event:Button#ClickEvent) = fn(event)
	     })
	  btn
      }
	def onClick(fn: => Unit):B = {
	  btn.addListener( new Button.ClickListener(){
	       def buttonClick(event:Button#ClickEvent) = fn
	     })
	  btn
	}
 }
   
 implicit def pimpButton[B <: {def addListener(listener:Button.ClickListener):Unit}]
(btn:B) = new PimpedButton(btn)

Using it:

val btn = new Button("do stuff") onClick {
  //do some fancy logic here
}

Notes:

  • I’m using duck typing, thus pimping any classes that define an addListener that accepts a ClickListener. This way I don’t have to keep track of what classes need this pimp.
  • I’m returning the object on the onClick methods, this makes it more convenient to use directly on object creation
  • I’m defining two onClick variants, one that receives the event object, and another without it, this is just for code simplicity when I don’t need the event object (which is most of the time)

I’m defining similar implicits for types that have:

addListener(listener : Property.ValueChangeListener)
addListener(listener : ItemClickListener)
addListener(listener : TextChangeListener)
addListener(listener : MouseEvents.ClickListener)
addListener(listener : FragmentChangedListener)

Another nice pimp, which I dubbed “anti-repetition”:

   class PimpedAddComponent(obj:{def addComponent(c:Component):Unit}) {
      def addComponents(comps:Component*) = comps foreach {c=>obj.addComponent(c)}
   }
   
   implicit def pimpAddComponent(obj:{def addComponent(c:Component):Unit}) = new PimpedAddComponent(obj)

The idea is to avoid this kind of boring repetition:

class SomeComponent {
  addComponent(x)
  addComponent(y)
  addComponent(z)
} 

and replace it with:

class SomeComponent {
  addComponents(x,y,z)
}

much nicer :slight_smile:

And adding collections of components comes for free, for example:

val l = List("label text 1","label text 2","label text 3")
addComponents(l map {new Label(_)} : _*)

I’ve created an implicit like this also for types defining:

addItem(a:Any)

That’s basically it (there’s a couple other things, like the Upload component listeners). It’s not much, but it’s enough to remove the most annoying boilerplate.

PS: maybe I should have put this up on GitHub or something, but I didn’t think it was worthy of such :slight_smile:

Very nice! I hope you don’t mind if we steal your ideas and adapt them to Scaladin? :slight_smile:

Not at all! :slight_smile:

Uploaded couple of Scaladin use examples I have been using on presentations to GitHub:


https://github.com/jojule/Stocks
is an example showing how to use Canvas on the server-side to build a simple stock listing application:


https://github.com/jojule/DocumentManager
is a simple document manager application written both in Java as well as in Scala. See the creation of the application

step by step in Java
. And also take a look at
“scalafied” application
.

That’s pretty awesome, thanks for sharing it!
Would be even more awesome if it used maven\sbt for build :slight_smile:

I posted a tutorial + example app on Vaadin, Scala and MongoDB integration:
Tutorial
&
app @ GitHub
. The example app that the tutorial uses is just ~100 lines of code in a single file, but the repo also contains a more fully fledged example which is properly broken into different classes in different files. Note that the tutorial uses the API of the brand new Scaladin 2.0.

I also updated the
Giter8 template
to use Scaladin 2.0.

Hi,

Is it possible to mix Scaladin components into plain Vaadin ComponentContainers?

I have a plain Vaadin Window with a VerticalLayout like so:

      MediaViewingPanel mvp = new MediaViewingPanel();
      
      VerticalLayout vLayout = new VerticalLayout();
      vLayout.setSizeFull();
      vLayout.addComponent(mvp);
      vLayout.setComponentAlignment(mvp, Alignment.MIDDLE_CENTER);
      
      Window mainWindow = new Window("MediaViewingPanel TEST");
      mainWindow.setContent(vLayout);

and MediaViewingPanel is a Scaladin CustomComponent:

   import vaadin.scala._

   class MediaViewingPanel extends CustomComponent {
     ...
   }

However, the line “vLayout.addComponent(mvp);” in the first block above gives the following errors:

no suitable method found for addComponent(org.versi.vaadin.scala.MediaViewingPanel)
    method com.vaadin.ui.AbstractOrderedLayout.addComponent(com.vaadin.ui.Component,int) is not applicable
      (actual and formal argument lists differ in length)
    method com.vaadin.ui.AbstractOrderedLayout.addComponent(com.vaadin.ui.Component) is not applicable
      (actual argument org.versi.vaadin.scala.MediaViewingPanel cannot be converted to com.vaadin.ui.Component by method invocation conversion)

Or would I need to rewrite all existing Vaadin code with Scaladin in order to use Scaladin on an existing project?

thanks.

Hi,

Try to say

vLayout.addComponent(mvp.p)

Field p is the actual Vaadin component that’s wrapped inside a Scaladin wrapper.

-Henri

Hi,

Any news on Vaadin 7 support. Scaladin branch 3.0 seems promising but do you have an estimate on when there would be a release that supports Vaadin 7?

Is the 3.0 branch stable enough that we could use it now and upgrade once it is released?

br,
Matti Heinola