OpenWAF - Learn

Home Features Demo Learn Download Documentation Contact

To build OpenWAF application you don't need any Plugin or any other IDE. It works with standard/popular IDE's like NetBeans or eclipse.

To Use OpenWAF you need NetBeans/Eclipse(Latest Version) and Python 2.X(Python 2.6 and above) Get Python

Get the necessary files(latest openwaf-xxx.zip) from Here
Extract the file to directory. This directory will be referred as OpenWAF_ROOT

or you can checkout latest version from svn (Recommended)

svn checkout http://openwaf.googlecode.com/svn/trunk/ openwaf-read-only
Checked out directory will be referred as OpenWAF_ROOT

Lets create a simple Hello World application.It takes less than 2 minutes to create it.

Step 1: Create Standard Java Web Application
- To Create new project select File->New Project , then select 'Web Application' from 'Java Web'
- Click next and Specify Project Name as HelloOpenWAF(Your may choose different)
- Then Click next and click Finish
Step 2: Create Another Standard Java Web Application

This project is a target project where Compiled files will be placed to run.
Use Project name as HelloOpenWAF_Compiled

Step 3: Create a config file in Source Project

Right click on 'HelloOpenWAF/Web Pages' then click on New->XML Document(or New->Other then select XML->XML Document)
Specify file name as OpenWAFConfig , click Next then Click Finish

Add following code to OpenWAFConfig.xml file
```
<?xml version="1.0" encoding="UTF-8"?>
<openwaf-web-app>
    <target-path>D:/Personal/OpenWAFPublic/projects/SampleApplications/HelloOpenWAF_Compiled</target-path>
    <lib-paths>
        <path>D:/Personal/OpenWAFPublic/projects/release/WAFJavaLib</path>
        <path>D:/Personal/OpenWAFPublic/projects/release/WAFLib</path>
    </lib-paths>
    <target-ide>netbeans</target-ide>
    <target-web-app-server>apache</target-web-app-server>
    <compile-mode>test</compile-mode>
    <proxy-servlet-url>WAFProxy</proxy-servlet-url>
    <compiled-js-file>open-waf-compiled.js</compiled-js-file>
    <code-gen-settings mode="test">
        <compatible-with-ie6>false</compatible-with-ie6>
        <waf-root-object-name>$w</waf-root-object-name>
        <add-prefix-to-gen-code>false</add-prefix-to-gen-code>
        <gen-line-code-prefix> </gen-line-code-prefix>
        <remove-unused-code>false</remove-unused-code>
        <mark-unused-code>true</mark-unused-code>
        <unused-code-marker>/** UNUSED **/</unused-code-marker>
        <enable-array-getter-setter>true</enable-array-getter-setter>
        <getter-setter-optimization>false</getter-setter-optimization>
    </code-gen-settings>
    <code-gen-settings mode="deploy">
        <compatible-with-ie6>true</compatible-with-ie6>
        <waf-root-object-name>$w</waf-root-object-name>
        <obfuscate>true</obfuscate>
        <minify>true</minify>
        <remove-unused-code>true</remove-unused-code>
        <enable-array-getter-setter>true</enable-array-getter-setter>
        <getter-setter-optimization>true</getter-setter-optimization>
        <aggregate-strings>true</aggregate-strings>
    </code-gen-settings>
</openwaf-web-app>
                    
```
Step 4: Configuring Config file

Now we need only 3 changes in OpenWAFConfig.xml file
- target-path: Set this to the root directory of target Project in this case HelloOpenWAF_Compiled.
  To get the path easily Right Click on HelloOpenWAF_Compiled Project and click 'Properties'. Copy Project Folder and paste in target-path in OpenWAFConfig.xml.
- lib-paths/path:Set this path to the required libraries for Compilation
  Here we need 2 basic libraries. These can be found in OpenWAF_Root directory where you have extracted/checked out the OpenWAF files.
  Correct these two paths to point them [OpenWAF_Root]/WAFJavaLib and [OpenWAF_Root]/WAFLib
Step 5:Including Libraries(JAR Files) to Source Project

Now we need JAR Files to be added in source project. To do this Right click on Source Project i.e. HelloOpenWAF and click on 'Properties'.
Then click on Libraries. Now click on 'Add JAR/Folder'. Select WAFLib.jar from [OpenWAF_Root/bin] and Click 'Open'.

Step 6: Creating First Page

Add new Page to HelloOpenWAF as Hello.jsp and add following code in body tag.
<WAF:Button id="btnSayHello" text="Say Hello" />
Create new package in 'Source Packages' as 'controllers' and add new class in controllers package as Hello(filename Hello.java)
And copy paste following code in file
```
package controllers;

import com.openwaf.client.core.Window;
import com.openwaf.client.event.dom.ClickEvent;
import com.openwaf.client.event.dom.ClickHandler;
import com.openwaf.client.ui.annotation.ViewElement;
import com.openwaf.client.ui.basic.Button;
import com.openwaf.core.framework.WAFController;

public class Hello extends WAFController {
    @ViewElement
    private Button btnSayHello;
    public Hello(){
        btnSayHello.addClickHandler(new ClickHandler() {
            public void onClick(ClickEvent ce) {
                Window.alert("Hello World!!!");
            }
        });
    }
}
```
Step 7: Compile & Run

In order compile the project you need a command prompt(Terminal in Linux). From command prompt change working directory to [OpenWAF_Root]/OpenWAFCompiler and run following command
python WAFAppCompiler.py [Source Project Root] e.g. python WAFAppCompiler.py D:\Personal\OpenWAFPublic\projects\SampleApplications\HelloOpenWAF
To get a root Directory of the project Right Click on Source Project and click Properties. Copy path from here.
It will take a while to compile the project around 20-30 seconds.

Now go to Netbeans in target Project i.e. HelloOpenWAF_Compiled. Here you will see couple of files added to 'Web Pages'.
Home.jsp and open-waf-compiled.js. Right click on Hello.jsp and click run. Thats it. You have successfully created your first OpenWAF Application