Getting Started

Download & Usage

The library is available as a jar on clojars.org. For Leinigen, add this to your dependencies:

    [com.prajaninc/functional-vaadin "0.1.1"]

You will also need to add dependencies for your chosen Vaadin libraries e.g.

    [com.vaadin/vaadin-server "7.6.5"]
    [com.vaadin/vaadin-client-compiled "7.6.5"]
    [com.vaadin/vaadin-themes "7.6.5"]

Then simply require the namespaces you need:

The primary namespace, containing all the builder functions:

(require [functional-vaadin.core :refer :all])

RxClojure integrations are in:

(require [functional-vaadin.rx.observers :as obs]
         [functional-vaadin.rx.operators :as ops])

Useful conversion functions are in:

(require [functional-vaadin.conversions :as conv])

These help you convert between Clojure immutable data structures and Vaadin data binding objects

The Fundamentals

Functional Vaadin implements a DSL for building and configuring Vaadin UI component hierarchies. The DSL is implemented as a Builder pattern by providing a function for each Vaadin component. These execute in a context that holds state for the building.

Each builder function takes a set of arguments that either configure the component, or provide children (where appropriate). Thus, UI component hierarchies are built by nested calls to builder functions. The configuration arguments to the functions can be a combination of component constructor arguments and/or a Map that specifies values for any property setter (setXXX method) on the component.

A Simple Example

Say you had a simple you had a simple UI, created the 'old' way i.e. calling Vaadin java methods directly. It would look like this:

(defn- create-main-layout []
    (doto (VerticalLayout.)
    (.addComponent (Label. "Functional Vaadin"))
    (.addComponent (TextField. "Field Caption" "Initial Content"))))

This creates a VerticalLayout with two components, a Label and a TextField. Using functional-vaadin, this would be written as:

(defn- create-main-layout []
    (vertical-layout
        (label "Functional Vaadin")
        (text-field "Field Caption" "Initial Content")))

Not a lot simpler, but definitely an improvement.

We need to put this in a UI object, so in the original case we would then create a sub-class of com.vaadin.ui.UI, and add that as the root component. The full source file would be:

(ns my-app.MyApplicationUI
    (import [com.vaadin.ui VerticalLayout Label TextField])
    (:gen-class :extends com.vaadin.ui.UI))

(defn- create-main-layout []
    (doto (VerticalLayout.)
    (.addComponent (Label. "Functional Vaadin"))
    (.addComponent (TextField. "Field Caption" "Initial Content"))))

(defn -init [main-ui request]
    (doto main-ui (.setContent (create-main-layout))))

Using functional-vaadin we would then have:

(ns my-app.MyApplicationUI
    (:require [functional-vaadin.core :refer :all]
    (import [com.vaadin.ui VerticalLayout Label TextField])
    (:gen-class :extends com.vaadin.ui.UI))

(defn- create-main-layout []
    (vertical-layout
        (label "Functional Vaadin")
        (text-field "Field Caption" "Initial Content")))

(-main [main-ui request]
    (defui main-ui
        (create-main-layout)))

Notice the addition of the 'defui' call. This sets the context for the UI builder, and sets it's second argument as the content of the UI.