Dec 31, 2010

A simple vaadin application

This is a simple vaadin application which get 2 values and give it's sum.

To create this you need Eclipse IDE. (or you can use maven archetype:generate.).
You must install maven-eclipse and vaadin-eclipse plugins.

Then create a new project using maven. You can do it by creating a vaadin project also. But if you use maven, it will be very helpful.
This will create the project and there will be a sample project, but if you view the source code it will prompt some errors. Don't worry just run it once. When it is running, it will download all relevant library files including vaadin.jar.

Now you can add a new class file and insert this coding.

package org.thilina.vaadin;

import com.vaadin.Application;
import com.vaadin.ui.Button;
import com.vaadin.ui.Layout;
import com.vaadin.ui.TextField;
import com.vaadin.ui.Window;
import com.vaadin.ui.Button.*;
import com.vaadin.ui.Form;
import com.vaadin.ui.HorizontalLayout;
import com.vaadin.ui.Window.Notification;


/**
 * The Application's "main" class
 */
@SuppressWarnings("serial")
public class MyVaadinApplication extends Application {

    private Window window;
    private TextField tf,tf2;
    private Double a,b,sum;
    private Button ok,reset;
    private Notification notification;

  
    @Override
    public void init() {
        window = new Window("My Vaadin Application");
        setMainWindow(window);
        createForm();
    }

    private void createForm() {
        Form form = new Form();
        form.setCaption("Form Caption");
        tf = new TextField("Value 1");
        form.addField("value_1",tf);
      
        tf2 = new TextField("Value 2");
        form.addField("value_2",tf2);

        form.setFooter(new HorizontalLayout());
        Layout okbar = form.getFooter();
        ok=new Button("OK", this, "commit");
        okbar.addComponent(ok);
        reset=new Button("Reset", this, "reset");
        okbar.addComponent(reset);
        window.addComponent(form);
    }

    public void commit(Button.ClickEvent event){
        String temp;
        temp=tf.getValue().toString();
        a=Double.parseDouble(temp);
        temp=tf2.getValue().toString();
        b=Double.parseDouble(temp);
        sum=a+b;
        notification = new Notification("Answer is : "+sum,Notification.TYPE_WARNING_MESSAGE);
        window.showNotification(notification);
    }

    public void reset(Button.ClickEvent event){
    tf.setValue("");
    tf2.setValue("");
    }
}


You need to change the package details in the first row. Then check the class name and file name.

Then you can remove auto generated file.

There are sample source code in the vaadin website. http://demo.vaadin.com/sampler/
Select a part and in that window there is a description about it. Next to that there is a small link to view the source code of the selected item.

Dec 28, 2010

Creating a Clojure web project.

We can create a website using clojure programming language. It is very similar to java websites and it need a servelet container to host the site. If we can develop a .war file ti is very easy to distribute and use. So Lets try to do that. There is a simple open source war project, we can use as the base of our project. You can download it from this link;

git clone https://github.com/alienscience/leiningen-war.git

Do; lein install

git clone https://github.com/alienscience/compojure-war-example.git
(To get this you need to install GIT version control system.)


The source code will be like this.

├── project.clj
├── README.md
└── src
    ├── boot.clj
    ├── context.clj
    ├── deploy
    │   └── servlet.clj
    ├── html
    │   ├── index.html
    │   └── stylesheet.css
    ├── pages.clj
    ├── routes.clj
    └── web.xml


You can add dependencies in project.clj. Then you can check the "routes.clj" code. In that you can see some code segment like this;

"  (GET  "/app/dump" request
    (pages/dump-request request) "

When you run this in a web server and if you send a request to <host>/app/dump, it will links page which created by the class called pages.clj's "dump-reguest" function. If you view the "pages.clj" file you can see some thing like this.
(defn dump-request ...


You can add another function similar to this like;

(defn about
  (html
   [:html
    [:head
     [:title "About Me"]
     [:link {:rel "stylesheet"
             :href (context/link "/stylesheet.css")
             :type "text/css"}]]
    [:body
     [:h1 "About Me"]
     [:p "Hi ..."]]]))

And add this in the routes.clj file.
   (GET "/app/about" request
(pages/about request))

Then you can add your "about" page to the index page in html/index.html.

After that you need to compile the source code and make the war file. To do these things, first you must run;
lein compile  (you need leiningen environment)
This will download all jar files and first time it will take some time. Then, if there is no compilation error you can run

lein uberwar

Now you can see the war file. Now you need to put that war in a servlet container and run. Then visit <host>/app/about.

Dec 27, 2010

Create a project using Clojure.

First of all you need to install Clojure leiningen environment.
You can install it from the website - https://github.com/technomancy/leiningen

Then you need to run
lien new ui_project

This will create a project directory call ui_project. Inside that you will see some files like project.clj src/ui/core.clj.

Then you must edit the project.clj file and add main class. It will be like  " :main ui.core" and you can add dependencies as in maven. You can create a pom.xml but first you need to add all dependencies in the project.clj file. After that it will be like this.

If the pom dependency is like this;
    <dependency>
      <groupId>group.id</groupId>
      <artifactId>artifact</artifactId>
      <version>1.0.0</version>
    </dependency>


(defproject ui "1.0.0-SNAPSHOT"
  :description "FIXME: write"
  :dependencies [[org.clojure/clojure "1.2.0"]
                 [org.clojure/clojure-contrib "1.2.0"]
                 [group.id/artifact "1.0.0"]]
  :main ui.core)

Then you can use maven also.

Dec 22, 2010

Vaadin - Introduction

Vaadin is a Java library which is used to develop web-based user interfaces. Java developer can use SWING SWT or AWT to create the web page as he/she is designing a software with a UI. Knowledge of HTML or CSS is not necessary. Therefor, the developer need only to think a bout the logic of the web application and develop it in the way he/she develop a desktop software.
Vaadin use AJAX and Javascripts. Therefor it will only create a single window and all other things will viewed by using AJAX. This will minimize the loading time and increase the performance.

To use Vaadin we need to download Vaadin library from its website. Then we can create a Java web based project and import thar library file as a dependent to the project. For some IDEs there are some plugins too. There is a maven archetype also. Vaadin runs on any Applet Server like Apache-tomcat, Jetty etc. So in order to use Vaadin you must install some applet server. All these things are based on Java and therefor it needs Java Development Kit or JDK.

Now we can try a simple code. If you use Eclipse you will get a system generated sample code. It will be like this.


import com.vaadin.Application;
import com.vaadin.ui.Label;
import com.vaadin.ui.Window;

public class MyVaadinApplication extends Application
{
    private Window mainWindow;

    @Override
    public void init()
    {
        mainWindow = new Window("Myproject Application");
        Label label = new Label("Hello Vaadin user");
        mainWindow.addComponent(label);
        setMainWindow(mainWindow);

    }

}

In here we haven't use any HTML or CSS thing. But if you view the source of that HTML, you can see HTML tags with some javascripts. We just need to use lables, buttons and related things like in software development, Vaadin will create a web site for us.

Vaadin - Introduction

Vaadin is a Java library which is used to develop web-based user interfaces. Java developer can use SWING SWT or AWT to create the web page as he/she is designing a software with a UI. Knowledge of HTML or CSS is not necessary. Therefor, the developer need only to think a bout the logic of the web application and develop it in the way he/she develop a desktop software.
Vaadin use AJAX and Javascripts. Therefor it will only create a single window and all other things will viewed by using AJAX. This will minimize the loading time and increase the performance.

To use Vaadin we need to download Vaadin library from its website. Then we can create a Java web based project and import thar library file as a dependent to the project. For some IDEs there are some plugins too. There is a maven archetype also. Vaadin runs on any Applet Server like Apache-tomcat, Jetty etc. So in order to use Vaadin you must install some applet server. All these things are based on Java and therefor it needs Java Development Kit or JDK.

Now we can try a simple code. If you use Eclipse you will get a system generated sample code. It will be like this.


import com.vaadin.Application;
import com.vaadin.ui.Label;
import com.vaadin.ui.Window;

public class MyVaadinApplication extends Application
{
    private Window mainWindow;

    @Override
    public void init()
    {
        mainWindow = new Window("Myproject Application");
        Label label = new Label("Hello Vaadin user");
        mainWindow.addComponent(label);
        setMainWindow(mainWindow);

    }

}

In here we haven't use any HTML or CSS thing. But if you view the source of that HTML, you can see HTML tags with some javascripts. We just need to use lables, buttons and related things like in software development, Vaadin will create a web site for us.

Dec 17, 2010

Let's ride the Camel - The simplest program to understand Camel

Camel Is and integration framework. It can pass data from one system to another. Here I will create a simple program to copy a file another place. Maybe this is simple but I think this easiest way to understand camel. I will use camel core and Java to do this. Then I will use Maven to do the same thing.

Think you need to copy a file call "File_A" in "Inbox" directory and you need to copy that file into "Outbox" directory. We can write a simple java I/O program to do that. It will be like this;

import java.io.*;

public class FileCopier {

   public static void main(String args[]) throws Exception {

File inboxDir= new File("Inbox");
File outboxDir= new File("Outbox");

outboxDir.mkdir();
File[] files=inboxDir.listFiles();
for (File source : files)
   if (source.isFile()){
File dest=new File(outboxDir.getPath() + File.separator + source.getName());
copyFile(source, dest);
}
   }

   public static void copyFile(File source, File dest) throws IOException {

  OutputStream out = new FileOutputStream(dest);
byte[] buffer=new byte[(int) source.length()];
FileInputStream in= new FileInputStream(source);
in.read(buffer);
try {
out.write(buffer);
}
finally {
out.close();
in.close();
}
   }
}

Note : You may need to create the Inbox directory in the same directory where FileCopier.java ecesis. Otherwise you must give the correct path. Next thing is, before you run this program make sure that the file Inbox/File_A ecesis.


Now we can try the same thing with camel.
To use camel we need to download camel library files (http://camel.apache.org/), and place them in the classpath. Then try this;

import org.apache.camel.CamelContext;
import org.apache.camel.builder.RouteBuilder;
import org.apache.camel.impl.DefaultCamelContext;

public class FileCopierWithCamel {

   public static void main(String args[]) throws Exception{

CamelContext context = new DefaultCamelContext();
context.addRoutes(new RouteBuilder(){
  public void configure(){ from("file:Inbox?noop=true").to("file:Outbox");}
});
context.start();
Thread.sleep(10000);
context.stop();
   }

}


So, I think now you can see the difference. Thread.sleep() is to give some time to copy the file. In this program, it required to download camel. But If we use maven, maven will manage that part. No need to copying to class paths and so on.

To do the same thing with the help of maven you can try;
mvn archetype:generate

Then chose the default one - "maven-archetype-quickstart" and give relevant details. This will create a files and a directory. It will look like pom.xml, src. Source code will be placed in src directory and pom.xml will contain all dependencies and plugin details. We use camel as a dependency, so we need to edit the pom.xml. Add this code segment in between the <dependencies> </dependencies> tags.

   <dependency>
     <groupId>org.apache.camel</groupId>
     <artifactId>camel-core</artifactId>
     <version>2.5.0</version>
   </dependency>

For this program, it will require only the camel-core, but for some programs there are many dependencies. You can find these details from the camel website.

Now we need to replace the code part. You can simply replace the maven generated "App.java" from previously created FileCopierWithCamel.java file. You should insert the package details in the FileCopierWithCamel.java file and that can be grabbed from the "App.java" file.
As previous, we need to create "Inbox/File_A". It should create where the pom.xml ecesis. Now the directory structure will like pom.xml, src, Inbox.

Then you can run it by;
mvn compile java:exec -Dexec.mainClass=<package name>.FileCopierWithCamel

Now you can see, that the program had created the "Outbox" Directory and inside that, you can see the "File_A".