Webnoob » Web Development

Webnoob » Web Development http://www.webnoob.com I am a noob on the World Wide Web Sun, 06 Sep 2009 06:12:32 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Sping Framework – step by step tutorial (2) http://www.webnoob.com/2009/06/spring-tutorial-2/ http://www.webnoob.com/2009/06/spring-tutorial-2/#comments Tue, 30 Jun 2009 08:25:41 +0000 NDLoc http://www.webnoob.com/?p=151 Part 2 – Developing and Configuring the Application

his is Part 2 of a step-by-step account of how to develop a web application from scratch using the Spring Framework. In Part 1 (Steps 1 – 12) we configured the environment and set up a basic application that we will build upon.

This is what we have to start with.

An introduction page index.jsp.
A DispatcherServlet with a corresponding springapp-servlet.xml configuration file.
A controller springappController.java.
A view hello.jsp.

We will now improve on these parts to build a more useful application.

Step 13 – Improve index.jsp

We will make use of JSP Standard Tag Library (JSTL) so I will start by copying the JSTL files we need to our WEB-INF/lib directory. Copy jstl.jar from the 'spring-framework-1.2/lib/j2ee' directory and standard.jar from the 'spring-framework-1.2/lib/jakarta-taglibs' directory to the springapp/war/WEB-INF/lib directory. I am also creating a “header” file that will be included in every JSP page that I'm going to write. This will make development easier and I will be sure that I have the same definitions in all JSPs. I am going to put all JSPs in a directory named jsp under the WEB-INF directory. This will ensure that only the controller has access to the views - it is not possible to get to these pages by entering them directly as a URL in the browser. This strategy might not work in all application servers and if this is the case with the one you are using, just move the jsp directory up a level. You would then use springapp/war/jsp as the directory instead of springapp/war/WEB-INF/jsp in all the code examples that will follow.

springapp/war/WEB-INF/jsp/include.jsp

JAVA:

<%@ page session="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>

Now we can change index.jsp to use this include and since we are using JSTL we can use the tag for redirecting to our Controller. This ties the index.jsp into our application framework.

springapp/war/index.jsp

JAVA:

<%@ include file="/WEB-INF/jsp/include.jsp" %>

<%-- Redirected because we can't set the welcome page to a virtual URL. --%>

Step 14 – Improve the view and the controller

I am going to move the view hello.jsp to the WEB-INF/jsp directory. The same include that was added to index.jsp gets added to hello.jsp. I also add the current date and time as output that I will retrieve from the model, passed to the view, using the JSTL tag.

springapp/war/WEB-INF/jsp/hello.jsp

JAVA:

<%@ include file="/WEB-INF/jsp/include.jsp" %>

<html>
<head><title>Hello :: Spring Application</title></head>
<body>
<h1>Hello - Spring Application</h1>
<p>Greetings, it is now <c:out value="${now}"/>
</p>
</body>
</html>

For SpringappController.java there are a few changes we need to make. Change the view to WEB-INF/jsp/hello.jsp since we moved the file to this new location. Also add a string containing the current data and time as the model.

springapp/src/SpringappController.java

JAVA:

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

public class SpringappController implements Controller {

/** Logger for this class and subclasses */
protected final Log logger = LogFactory.getLog(getClass());

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

String now = (new java.util.Date()).toString();
logger.info("returning hello view with " + now);

return new ModelAndView("WEB-INF/jsp/hello.jsp", "now", now);
}
}

Now we are ready to try this after we build and deploy this new code. We enter http://localhost:8080/springapp in a browser and that should pull up index.jsp, which should redirect to hello.htm, which in turn gets us to the controller that sends the data and time to the view.

spring_3

Step 15 – Decouple the view and the controller

Right now the controller specifies the full path of the view, which creates an unnecessary dependency between the controller and the view. Ideally we would like to map to the view using a logical name, allowing us to switch the view without having to change the controller. You can set this mapping in a properties file if you like using a ResourceBundleViewResolver and a SimpleUrlHandlerMapping class. If your mapping needs are simple it is easier to just set a prefix and a suffix on the InternalResourceViewResolver. The latter approach is the one that I will implement now, so I modify the springapp-servlet.xml and include this viewResolver entry. I have elected to use a JstlView which will enable us to use JSTL in combination with message resource bundles and it will also support internationalization.

springapp/war/WEB-INF/springapp-servlet.xml

XML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.org/dtd/spring-beans.dtd">

<beans>
<bean id="springappController" class="SpringappController"/>

<bean id="urlMapping" class="org.springframework.web.servlet.handler.SimpleUrlHandlerMapping">
<property name="mappings">
<props>
<prop key="/hello.htm">springappController</prop>
</props>
</property>
</bean>

<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="viewClass"><value>org.springframework.web.servlet.view.JstlView</value></property>
<property name="prefix"><value>/WEB-INF/jsp/</value></property>
<property name="suffix"><value>.jsp</value></property>
</bean>
</beans>

So now I can remove the prefix and suffix from the view name in the controller.
springapp/src/SpringappController.java

JAVA:

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

public class SpringappController implements Controller {

/** Logger for this class and subclasses */
protected final Log logger = LogFactory.getLog(getClass());

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

String now = (new java.util.Date()).toString();
logger.info("returning hello view with " + now);

return new ModelAndView("hello", "now", now);
}
}

Compile and deploy and the application should still work.

Step 16 – Add some classes for business logic

So far our application is not very useful. I would like to add a little bit of business logic in form of a Product class and a class that will manage all the products. I name this management class ProductManager. In order to separate the web dependent logic from the business logic I will create two separate packages for the Java source – web and bus. If this was an application for a real company I would name the packages something like com.mycompany.web and com.mycompany.bus, but since this is just a demo application I will keep the package names real short. The Product class is implemented as a JavaBean – it has the default constructor (automatically provided if we don't specify any constructors) and getters and setters for the two instance variables description and price. I also make it Serializable, not necessary for our application, but could come in handy later on if we have to pass this class between different application layers.

springapp/src/bus/Product.java

JAVA:

package bus;

import java.io.Serializable;

public class Product implements Serializable {

private String description;
private Double price;

public void setDescription(String s) {
description = s;
}

public String getDescription() {
return description;
}

public void setPrice(Double d) {
price = d;
}

public Double getPrice() {
return price;
}
}

The ProductManager holds a List of Products, and again this this class is implemented as a JavaBean.

springapp/src/bus/ProductManager.java

JAVA:

package bus;

import java.io.Serializable;
import java.util.List;

public class ProductManager implements Serializable {

private List products;

public void setProducts(List p) {
products = p;
}

public List getProducts() {
return products;
}

}

Next, I modify the SpringappController to hold a reference to this ProductManager class. As you can see, it is now in a separate package called web – remember to move the source to this new location. I also add code to have the controller pass some product information to the view. The getModelAndView now returns a Map with both the date and time and the product manager reference.

springapp/src/web/SpringappController.java

JAVA:

package web;

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import java.io.IOException;
import java.util.Map;
import java.util.HashMap;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

import bus.Product;
import bus.ProductManager;

public class SpringappController implements Controller {

/** Logger for this class and subclasses */
protected final Log logger = LogFactory.getLog(getClass());

private ProductManager prodMan;

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

String now = (new java.util.Date()).toString();
logger.info("returning hello view with " + now);

Map myModel = new HashMap();
myModel.put("now", now);
myModel.put("products", getProductManager().getProducts());

return new ModelAndView("hello", "model", myModel);
}

public void setProductManager(ProductManager pm) {
prodMan = pm;
}

public ProductManager getProductManager() {
return prodMan;
}
}

Step 17 – Modify the view to display business data and add support for message bundle

Using the JSTL tag, I add a section that displays product information. I have also replaced the title, heading and greeting text with a JSTL tag that pulls the text to display from a provided 'message' source – I will show this source in a later step.

springapp/war/WEB-INF/jsp/hello.jsp

JAVA:

<%@ include file="/WEB-INF/jsp/include.jsp" %>

<html>
<head><title><fmt:message key="title"/></title></head>
<body>
<h1><fmt:message key="heading"/></h1>
<p><fmt:message key="greeting"/> <c:out value="${model.now}"/>
</p>
<h3>Products</h3>
<c:forEach items="${model.products}" var="prod">
<c:out value="${prod.description}"/> <i>$<c:out value="${prod.price}"/></i><br><br>
</c:forEach>
</body>
</html>

Step 18 – Add some test data to automatically populate some business objects

I am not going to add any code to load the business objects from a database just yet. Instead, we can “wire up” a couple of instances using Spring's bean and application context support. I will simply put the data I need as a couple of bean entries in springapp-servlet.xml. I will also add the messageSource entry that will pull in the messages resource bundle ('messages.properties') that I will create in the next step.

springapp/war/WEB-INF/springapp-servlet.xml

XML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.org/dtd/spring-beans.dtd">

<beans>
<bean id="springappController" class="web.SpringappController">
<property name="productManager">
<ref bean="prodMan"/>
</property>
</bean>

<bean id="prodMan" class="bus.ProductManager">
<property name="products">
<list>
<ref bean="product1"/>
<ref bean="product2"/>
<ref bean="product3"/>
</list>
</property>
</bean>

<bean id="product1" class="bus.Product">
<property name="description"><value>Lamp</value></property>
<property name="price"><value>5.75</value></property>
</bean>

<bean id="product2" class="bus.Product">
<property name="description"><value>Table</value></property>
<property name="price"><value>75.25</value></property>
</bean>

<bean id="product3" class="bus.Product">
<property name="description"><value>Chair</value></property>
<property name="price"><value>22.79</value></property>
</bean>

<bean id="messageSource" class="org.springframework.context.support.ResourceBundleMessageSource">
<property name="basename"><value>messages</value></property>
</bean>

<bean id="urlMapping" class="org.springframework.web.servlet.handler.SimpleUrlHandlerMapping">
<property name="mappings">
<props>
<prop key="/hello.htm">springappController</prop>
</props>
</property>
</bean>

<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="viewClass"><value>org.springframework.web.servlet.view.JstlView</value></property>
<property name="prefix"><value>/WEB-INF/jsp/</value></property>
<property name="suffix"><value>.jsp</value></property>
</bean>
</beans>

Step 19 – Add the message bundle and a 'clean' target to build.xml

I create a 'messages.properties' file in the war/WEB-INF/classes directory. This properties bundle so far has three entries matching the keys specified in the tags that we added to the hello.jsp.

springapp/war/WEB-INF/classes/messages.properties

JAVA:

title=SpringApp
heading=Hello :: SpringApp
greeting=Greetings, it is now

Since we moved some source files around, it makes sense to add a 'clean' and an 'undeploy' target to the build scripts. I add the following entries to the build.xml file.

XML:

Now stop the Tomcat server, run the clean, undeploy and deploy targets. This should remove all old class files, re-build the application and deploy it. Start up Tomcat again and you should see the following:

spring_4

NDLoc, 30/06/2009

Spring Framework tutorial 1

References:
- Thomas Risberg, Rick Evans, Portia Tung: Developing a Spring Framework MVC application step-by-step

]]> http://www.webnoob.com/2009/06/spring-tutorial-2/feed/ 0 Spring Framework – step by step tutorial (1) http://www.webnoob.com/2009/06/spring-tutorial-1/ http://www.webnoob.com/2009/06/spring-tutorial-1/#comments Mon, 29 Jun 2009 06:32:17 +0000 NDLoc http://www.webnoob.com/?p=137 Part 1 – Basic Application and Environment Setup

This is a step-by-step account of how to develop a web application from scratch using the Spring Framework.

Prerequisites:

Java SDK (I am currently using version 1.4.2)
Ant (using version 1.6.2)
Apache Tomcat (using version 5.0.2)

You should also be reasonably comfortable using the above software.

I am not going to cover a lot of background information or theory in this document -- there are plenty of books available that covers this in depth. Instead we will dive right into developing the application.

Step 1 – development directory

We are going to need a place to keep all the source and other files we will be creating, so I create a directory that I name 'springapp'. You can place this directory in your home folder or in some other location. I created mine in a 'projects' directory that I already had in my home directory so the full path to my directory is '/Users/trisberg/projects/springapp'. Inside this directory I create a 'src' directory to hold all Java source files. Then I create another directory that I name 'war'. This directory will hold everything that should go into the WAR file, that we would use to deploy our application. All source files other than Java source, like JSPs and configuration files, belongs in this directory.

Step 2 – index.jsp

I will start by creating a JSP page named 'index.jsp' in the war directory. This is the entry point for our application.

springapp/war/index.jsp

JAVA:

<html>
<head><title>Example :: Spring Application</title></head>
<body>
<h1>Example - Spring Application</h1>
<p>This is my test.</p>
</body>
</html>

Just to have a complete web application, I create a web.xml in a WEB-INF directory that I create under the war directory.

springapp/war/WEB-INF/web.xml

XML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC '-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN' 'http://java.sun.com/dtd/web-app_2_3.dtd'>

<web-app>

</web-app>

Step 3 – deploying the application to Tomcat

Next, I write an Ant build script that we are going to use throughout this document. There are tasks for building and deploying the application. A separate build script contains the app server specific tasks There are also tasks for controlling the application under Tomcat.
springapp/build.xml

XML:

<?xml version="1.0"?>

<project name="springapp" basedir="." default="usage">
<property file="build.properties"/>

<property name="src.dir" value="src"/>
<property name="web.dir" value="war"/>
<property name="build.dir" value="${web.dir}/WEB-INF/classes"/>
<property name="name" value="springapp"/>

<path id="master-classpath">
<fileset dir="${web.dir}/WEB-INF/lib">
<include name="*.jar"/>
</fileset>




<fileset dir="${appserver.home}/common/lib">
<include name="servlet*.jar"/>
</fileset>
<pathelement path="${build.dir}"/>
</path>

<target name="usage">
<echo message=""/>
<echo message="${name} build file"/>
<echo message="-----------------------------------"/>
<echo message=""/>
<echo message="Available targets are:"/>
<echo message=""/>
<echo message="build --> Build the application"/>
<echo message="deploy --> Deploy application as directory"/>
<echo message="deploywar --> Deploy application as a WAR file"/>
<echo message="install --> Install application in Tomcat"/>
<echo message="reload --> Reload application in Tomcat"/>
<echo message="start --> Start Tomcat application"/>
<echo message="stop --> Stop Tomcat application"/>
<echo message="list --> List Tomcat applications"/>
<echo message=""/>
</target>

<target name="build" description="Compile main source tree java files">
<mkdir dir="${build.dir}"/>
<javac destdir="${build.dir}" target="1.3" debug="true"
deprecation="false" optimize="false" failonerror="true">
<src path="${src.dir}"/>
<classpath refid="master-classpath"/>
</javac>
</target>

<target name="deploy" depends="build" description="Deploy application">
<copy todir="${deploy.path}/${name}" preservelastmodified="true">
<fileset dir="${web.dir}">
<include name="**/*.*"/>
</fileset>
</copy>
</target>

<target name="deploywar" depends="build" description="Deploy application as a WAR file">
<war destfile="${name}.war"
webxml="${web.dir}/WEB-INF/web.xml">
<fileset dir="${web.dir}">
<include name="**/*.*"/>
</fileset>
</war>
<copy todir="${deploy.path}" preservelastmodified="true">
<fileset dir=".">
<include name="*.war"/>
</fileset>
</copy>
</target>

<taskdef name="install" classname="org.apache.catalina.ant.InstallTask">
<classpath>
<path location="${appserver.home}/server/lib/catalina-ant.jar"/>
</classpath>
</taskdef>
<taskdef name="reload" classname="org.apache.catalina.ant.ReloadTask">
<classpath>
<path location="${appserver.home}/server/lib/catalina-ant.jar"/>
</classpath>
</taskdef>
<taskdef name="list" classname="org.apache.catalina.ant.ListTask">
<classpath>
<path location="${appserver.home}/server/lib/catalina-ant.jar"/>
</classpath>
</taskdef>
<taskdef name="start" classname="org.apache.catalina.ant.StartTask">
<classpath>
<path location="${appserver.home}/server/lib/catalina-ant.jar"/>
</classpath>
</taskdef>
<taskdef name="stop" classname="org.apache.catalina.ant.StopTask">
<classpath>
<path location="${appserver.home}/server/lib/catalina-ant.jar"/>
</classpath>
</taskdef>

<target name="install" description="Install application in Tomcat">
<install url="${tomcat.manager.url}"
username="${tomcat.manager.username}"
password="${tomcat.manager.password}"
path="/${name}"
war="${name}"/>
</target>

<target name="reload" description="Reload application in Tomcat">
<reload url="${tomcat.manager.url}"
username="${tomcat.manager.username}"
password="${tomcat.manager.password}"
path="/${name}"/>
</target>

<target name="start" description="Start Tomcat application">
<start url="${tomcat.manager.url}"
username="${tomcat.manager.username}"
password="${tomcat.manager.password}"
path="/${name}"/>
</target>

<target name="stop" description="Stop Tomcat application">
<stop url="${tomcat.manager.url}"
username="${tomcat.manager.username}"
password="${tomcat.manager.password}"
path="/${name}"/>
</target>

<target name="list" description="List Tomcat applications">
<list url="${tomcat.manager.url}"
username="${tomcat.manager.username}"
password="${tomcat.manager.password}"/>
</target>

</project>

This script now contains all the targets that we are going to need to make our development efforts easier. I am not going to cover this script in detail since most if not all of it is pretty much standard Ant and Tomcat stuff. You can just copy the above build file and put it at the root of your development directory tree. We also need a build.properties file that you should customize to match your server installation. This file belongs in the same directory as the build.xml file.

springapp/build.properties

JAVA:

# Ant properties for building the springapp

appserver.home=${user.home}/jakarta-tomcat-5.0.28
deploy.path=${appserver.home}/webapps

tomcat.manager.url=http://localhost:8080/manager
tomcat.manager.username=admin
tomcat.manager.password=tomcat

If you are on a system where you are not the owner of the Tomcat install, then the Tomcat owner must either grant you full access to the webapps directory or the owner must create a new directory named 'springapp' in the 'webapps' directory of the Tomcat installation, and also give you full rights to deploy to this newly created directory. On Linux I run the command chmod a+rwx springapp to give everybody full rights to this directory.

If you are using a different web application server, then you can remove the Tomcat specific tasks at the end of the build script. You will have to rely on your server's hot deploy feature, or you will have to stop and start your application manually.

Now I run Ant to make sure that everything is working OK. You should have your current directory set to the 'springapp' directory.

JAVA:

[trisberg@localhost springapp]$ ant
Buildfile: build.xml

usage:

[echo] springapp build file
[echo] -----------------------------------

[echo] Available targets are:

[echo] build --> Build the application
[echo] deploy --> Deploy application as directory
[echo] deploywar --> Deploy application as a WAR file
[echo] install --> Install application in Tomcat
[echo] reload --> Reload application in Tomcat
[echo] start --> Start Tomcat application
[echo] stop --> Stop Tomcat application
[echo] list --> List Tomcat applications

BUILD SUCCESSFUL
Total time: 2 seconds

Last action here is to do the actual deployment. Just run Ant and specify 'deploy' or 'deploywar' as the target.

JAVA:

[trisberg@localhost springapp]$ ant deploy
Buildfile: build.xml

build:
[mkdir] Created dir: /Users/trisberg/projects/springapp/war/WEB-INF/classes

deploy:
[copy] Copying 2 files to /Users/trisberg/jakarta-tomcat-5.0.28/webapps/springapp

BUILD SUCCESSFUL
Total time: 2 seconds

Step 4 – Test the application

Let's just quickly start Tomcat and make sure that we can access the application. Use the 'list' task from our build file to see if Tomcat has picked up the new application.

JAVA:

[trisberg@localhost springapp]$ ant list
Buildfile: build.xml

list:
[list] OK - Listed applications for virtual host localhost

[list] /admin:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/server/webapps/admin

[list] /webdav:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/webdav

[list] /servlets-examples:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/servlets-examples

[list] /springapp:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/springapp

[list] /jsp-examples:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/jsp-examples

[list] /balancer:running:0:balancer

[list] /tomcat-docs:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/tomcat-docs

[list] /:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/webapps/ROOT

[list] /manager:running:0:/Users/trisberg/jakarta-tomcat-5.0.28/server/webapps/manager

BUILD SUCCESSFUL
Total time: 1 second

If it is not listed, use the 'install' task to get the application installed in Tomcat.

JAVA:

[trisberg@localhost springapp]$ ant install
Buildfile: build.xml

install:
[install] OK - Installed application at context path /springapp
<p style="text-align: left;">BUILD SUCCESSFUL
Total time: 2 seconds

Now open a browser and browse to http://localhost:8080/springapp/index.jsp.

spring_1

Step 5 – Download Spring distribution

If you have not already downloaded the Spring Framework Release file, now is the time to do so. I am currently using 'spring-framework-1.2-with-dependencies.zip' that can be downloaded from www.springframework.org/download.html. I unzipped this file in my home directory. We are going to use several files from this download later on.

This completes the setup of the environment that is necessary, and now we can start actually developing our Spring Framework MVC application.

Step 6 – Modify web.xml in WEB-INF directory

Go to the 'springapp/war/ WEB-INF' directory. Modify the minimal 'web.xml' file that we created earlier. Now we will modify it to suit our needs. We define a DispatcherServlet that is going to control where all our request are routed based on information we will enter at a later point. It also has a standard servlet-mapping entry that maps to the url patterns that we will be using. I have decided to let any url with an '.htm' extension be routed to the 'springapp' dispatcher.

springapp/war/WEB-INF/web.xml

XML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC '-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN' 'http://java.sun.com/dtd/web-app_2_3.dtd'>

<web-app>

<servlet>
<servlet-name>springapp</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>springapp</servlet-name>
<url-pattern>*.htm</url-pattern>
</servlet-mapping>

<welcome-file-list>
<welcome-file>
index.jsp
</welcome-file>
</welcome-file-list>

</web-app>

Next, create a file called 'springapp-servlet.xml' in the springapp/war/WEB-INF directory (you can copy an example of this file from the Spring distributions sample/skeletons/webapp-minimal directory). This is the file where definitions used by the DispatcherServlet should be entered. It is named based on the servlet-name from web.xml with '-servlet' appended. This is a standard naming convention used in the Spring Framework. Now, add a bean entry named springappController and make the class SpringappController. This defines the controller that our application will be using. We also need to add a url mapping so the DispatcherServlet knows which controller should be invoked for different urls:

springapp/war/WEB-INF/springapp-servlet.xml

XML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.org/dtd/spring-beans.dtd">

<beans>
<bean id="springappController" class="SpringappController"/>

<bean id="urlMapping" class="org.springframework.web.servlet.handler.SimpleUrlHandlerMapping">
<property name="mappings">
<props>
<prop key="/hello.htm">springappController</prop>
</props>
</property>
</bean>
</beans>

Step 7 – Copy jars to WEB-INF/lib

First create a 'lib' directory in the 'war/WEB-INF' directory. Then, from the Spring distribution, copy spring.jar (spring-framework-1.2/dist/spring.jar) to the new war/WEB-INF/lib directory. Also copy commons-logging jars to the war/WEB-INF/lib directory (spring-framework-1.2/lib/jakarta-commons/commons-logging.jar). We are also going to need a log4j jar. Copy log4j-1.2.9.jar to the war/WEB-INF/lib directory (spring-framework-1.2/lib/log4j/log4j-1.2.9.jar). These jars will be deployed to the server and they are also used during the build process.

Step 8 – Create your Controller

Create your Controller – I named mine SpringappController.java and placed it in the springapp/src directory.

springapp/src/SpringappController.java

JAVA:

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

public class SpringappController implements Controller {

/** Logger for this class and subclasses */
protected final Log logger = LogFactory.getLog(getClass());

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

logger.info("SpringappController - returning hello view");

return new ModelAndView("hello.jsp");
}
}

This is as basic a Controller as you can use. We will be expanding this later on, and we will also later on extend some provided abstract base implementations. The Controller “handles” the request and returns a ModelAndView. We have not yet defined any Views, so right now there is nothing to do.

Step 9 – Build the Application

Run the 'build' task of the build.xml. Hopefully the code compiles OK.

JAVA:

[trisberg@localhost springapp]$ ant build
Buildfile: build.xml

build:
[javac] Compiling 1 source file to /Users/trisberg/projects/springapp/war/WEB-INF/classes

BUILD SUCCESSFUL
Total time: 2 seconds

Step 10 – Copy and modify log4j.properties

The Spring Framework uses log4j for logging so we have to create a configuration file for log4j. Copy the log4j.properties from the sample Petclinic application (spring-framework-1.2/samples/petclinic/war/WEB-INF/log4j.properties) to the war/WEB-INF/classes directory (this directory should have been created in the previous step). Now uncomment or modify the log4j.rootCategory property and change the name and location of the logfile that will be written. I decided to have it written to the same directory as all other Tomcat logs.

springapp/war/WEB-INF/classes/log4j.properties

JAVA:

# For JBoss: Avoid to setup Log4J outside $JBOSS_HOME/server/default/deploy/log4j.xml!
# For all other servers: Comment out the Log4J listener in web.xml to activate Log4J.
log4j.rootLogger=INFO, stdout, logfile

log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d %p [%c] - <%m>%n

log4j.appender.logfile=org.apache.log4j.RollingFileAppender
log4j.appender.logfile.File=/Users/trisberg/jakarta-tomcat-5.0.28/logs/springapp.log
log4j.appender.logfile.MaxFileSize=512KB
# Keep three backup files.
log4j.appender.logfile.MaxBackupIndex=3
# Pattern to output: date priority [category] - message
log4j.appender.logfile.layout=org.apache.log4j.PatternLayout
log4j.appender.logfile.layout.ConversionPattern=%d %p [%c] - %m%n

Step 11 – Deploy Application

Run the 'deploy' task and then the 'stop' and 'start' tasks of the build.xml. This will force a reload of the application. We have to check the Tomcat logs for any deployment errors – there could be typos in the above xml files or there could be missing classes or jar files. This is an example of what it should look like. (/Users/trisberg/jakarta-tomcat-5.0.28/logs/springapp.log)

JAVA:

2005-04-24 14:58:18,112 INFO [org.springframework.web.servlet.DispatcherServlet] - Initializing servlet 'springapp'
2005-04-24 14:58:18,261 INFO [org.springframework.web.servlet.DispatcherServlet] - FrameworkServlet 'springapp': initialization started
2005-04-24 14:58:18,373 INFO [org.springframework.beans.factory.xml.XmlBeanDefinitionReader] - Loading XML bean definitions from ServletContext resource [/WEB-INF/springapp-servlet.xml]
2005-04-24 14:58:18,498 INFO [org.springframework.web.context.support.XmlWebApplicationContext] - Bean factory for application context [WebApplicationContext for namespace 'springapp-servlet']: org.springframework.beans.factory.support.DefaultListableBeanFactory defining beans [springappController,urlMapping]; root of BeanFactory hierarchy
2005-04-24 14:58:18,505 INFO [org.springframework.web.context.support.XmlWebApplicationContext] - 2 beans defined in application context [WebApplicationContext for namespace 'springapp-servlet']
2005-04-24 14:58:18,523 INFO [org.springframework.core.CollectionFactory] - JDK 1.4+ collections available
2005-04-24 14:58:18,524 INFO [org.springframework.core.CollectionFactory] - Commons Collections 3.x available
2005-04-24 14:58:18,537 INFO [org.springframework.web.context.support.XmlWebApplicationContext] - Unable to locate MessageSource with name 'messageSource': using default [org.springframework.context.support.DelegatingMessageSource@8dacb]
2005-04-24 14:58:18,539 INFO [org.springframework.web.context.support.XmlWebApplicationContext] - Unable to locate ApplicationEventMulticaster with name 'applicationEventMulticaster': using default [org.springframework.context.event.SimpleApplicationEventMulticaster@5674a4]
2005-04-24 14:58:18,549 INFO [org.springframework.ui.context.support.UiApplicationContextUtils] - No ThemeSource found for [WebApplicationContext for namespace 'springapp-servlet']: using ResourceBundleThemeSource
2005-04-24 14:58:18,556 INFO [org.springframework.beans.factory.support.DefaultListableBeanFactory] - Pre-instantiating singletons in factory [org.springframework.beans.factory.support.DefaultListableBeanFactory defining beans [springappController,urlMapping]; root of BeanFactory hierarchy]
2005-04-24 14:58:18,557 INFO [org.springframework.beans.factory.support.DefaultListableBeanFactory] - Creating shared instance of singleton bean 'springappController'
2005-04-24 14:58:18,603 INFO [org.springframework.beans.factory.support.DefaultListableBeanFactory] - Creating shared instance of singleton bean 'urlMapping'
2005-04-24 14:58:18,667 INFO [org.springframework.web.servlet.DispatcherServlet] - Using context class [org.springframework.web.context.support.XmlWebApplicationContext] for servlet 'springapp'
2005-04-24 14:58:18,668 INFO [org.springframework.web.servlet.DispatcherServlet] - Unable to locate MultipartResolver with name 'multipartResolver': no multipart request handling provided
2005-04-24 14:58:18,670 INFO [org.springframework.web.servlet.DispatcherServlet] - Unable to locate LocaleResolver with name 'localeResolver': using default [org.springframework.web.servlet.i18n.AcceptHeaderLocaleResolver@318309]
2005-04-24 14:58:18,675 INFO [org.springframework.web.servlet.DispatcherServlet] - Unable to locate ThemeResolver with name 'themeResolver': using default [org.springframework.web.servlet.theme.FixedThemeResolver@c11e94]
2005-04-24 14:58:18,681 INFO [org.springframework.web.servlet.DispatcherServlet] - No HandlerAdapters found in servlet 'springapp': using default
2005-04-24 14:58:18,700 INFO [org.springframework.web.servlet.DispatcherServlet] - No ViewResolvers found in servlet 'springapp': using default
2005-04-24 14:58:18,700 INFO [org.springframework.web.servlet.DispatcherServlet] - FrameworkServlet 'springapp': initialization completed in 439 ms
2005-04-24 14:58:18,704 INFO [org.springframework.web.servlet.DispatcherServlet] - Servlet 'springapp' configured successfully

Step 12 – Create a View

Now it is time to create our first view. I will use a JSP page that I decided to name hello.jsp. I'll put it in the war directory to begin with.

springapp/war/hello.jsp

JAVA:

Example :: Spring Application
<h1>Hello - Spring Application</h1>
Greetings.

Nothing fancy here, but it will do for now. Next we have to modify the SpringappController to forward to this view.

springapp/src/SpringappController.java

JAVA:

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

public class SpringappController implements Controller {

/** Logger for this class and subclasses */
protected final Log logger = LogFactory.getLog(getClass());

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

logger.info("SpringappController - returning hello view");

return new ModelAndView("hello.jsp");
}
}

While I was modifying this class, I also added a logger so we can verify that we actually got here. Changes are highlighted in red. The model that this class returns is actually resolved via a ViewResolver. Since we have not specified a specific one, we are going to get a default one that just forwards to a url matching the name of the view specified. We will modify this later on.

Now compile and deploy the application. After instructing Tomcat to stop and then start the application, everything should get reloaded.

Let's try it in a browser – enter the url http://localhost:8080/springapp/hello.htm and we should see the following:

spring_2

We can also check the log – I'm only showing the last entries, but we can see that the controller did get invoked and that it forwarded to the hello view. (/Users/trisberg/jakarta-tomcat-5.0.28/logs/springapp.log)

JAVA:

2005-04-24 15:01:56,217 INFO [org.springframework.web.servlet.DispatcherServlet] - FrameworkServlet 'springapp': initialization completed in 372 ms
2005-04-24 15:01:56,217 INFO [org.springframework.web.servlet.DispatcherServlet] - Servlet 'springapp' configured successfully
2005-04-24 15:03:57,908 INFO [SpringappController] - SpringappController - returning hello view

Summary

Let's take quick look at the parts of our application that we have created so far.

1. An introduction page index.jsp that does not do anything useful. It was just used to test our setup. We will later change this to actually provide a link into our application.
2.A DispatcherServlet with a corresponding springapp-servlet.xml configuration file.
3.A controller springappController.java with limited functionality – it just forwards a ModelAndView to the ViewResolver. Actually, we only have an empty model so far, but we will fix this later.
4.A view hello.jsp that again is extremely basic. But the whole setup works and we are now ready to add more functionality.

NDLoc, 29/06/2009

Spring Framework tutorial 2

References:
- Thomas Risberg, Rick Evans, Portia Tung: Developing a Spring Framework MVC application step-by-step

]]> http://www.webnoob.com/2009/06/spring-tutorial-1/feed/ 0 UniNet – a Sakai plugin built on Spring and Hibernate http://www.webnoob.com/2009/06/uninet/ http://www.webnoob.com/2009/06/uninet/#comments Mon, 29 Jun 2009 04:38:26 +0000 NDLoc http://www.webnoob.com/?p=126 UniNet is a university-scoped social network built on Spring and Hibernate and integrated into Sakai portal as a independent module.

The purpose of UniNet is to provide a communication channel where students can contact with each other seeking help , looking for other students (from the same country, or city; speaking the same language; doing the course or subject; having some skills or interest) or to team up a group (of their interest or to do a project).

Sakai is a community of academic institutions, commercial organizations and individuals who work together to develop a common Collaboration and Learning Environment (CLE). The Sakai CLE is a free, community source, educational software platform distributed under the Educational Community License (a type of open source license). The Sakai CLE is used for teaching, research and collaboration. Systems of this type are also known as Course Management Systems (CMS), Learning Management Systems (LMS), or Virtual Learning Environments (VLE).

Sakai is a Java-based, service-oriented application suite that is designed to be scalable, reliable, interoperable and extensible. Version 1.0 was released in March 2005.

As of July 2007, Sakai is in production at over 150 institutions and being piloted by over 100 more.

UniNet is developed on the MVC model of Spring framework and Object Mapping technique of Hibernate framework. The module follows Sakai standards and integrated into Sakai project as a plug-in tool.

During the development and testing phase, the module used Tomcat as virtual web server, MySQL as database server and Maven as deployment tool. Project timeline and management activities has been done through Trac; code version was controlled by Subversion through Eclipse plug-in (Subclipse).

System Architecture:

Description:

when a student enrolls in a course, he will automatically has a UniNet page but it is up to him to activate his page or not.
UniNet page contain the contents about Personal information, Group list, Course information, Subject information , Interests, Skills

Functionalities:

User can customize the information he wants to post on his page (except Course information) : he can choose what information to be displayed; upload his represent pictures; write and edit entries, upload images in the entry
User can search for students from any countries or cities; for students who are doing the same course or units with him; for students with specific interests; for students with specific skills
User can create a group and give a description about the group such as, then he could invite other users to join his group. Each group will have a group page where all members can write entries and upload images about the group activities.
When join a group, user can send internal emails to all members of group as well as receive emails from others

MVC structure
uninet_5

Sample code

Model : UserManager.java

JAVA:

package model;

import org.hibernate.HibernateException;
import org.hibernate.Session;
import java.util.*;
/**
* Model : class UserManager
*/
public class UserManager {

public UserManager(){}

public List getUserList(){
List list = null;
Session session = HibernateUtil.getSessionFactory().getCurrentSession();
session.beginTransaction();
try
{
list = session.createQuery("from User").list();
session.getTransaction().commit();
}
catch (HibernateException e)
{
session.getTransaction().rollback();
throw e;
}
Collections.sort(list);
return list;
}
}

Controller: UserController.java

JAVA:

package controller;

import org.springframework.web.servlet.mvc.Controller;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import java.io.IOException;
import java.util.*;
import model.*;

public class UserController implements Controller{
private UserManager userManager;
protected final Log logger = LogFactory.getLog(getClass());

public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

String dateSt = (new java.util.Date().toString());
logger.info("User access homepage on: " + dateSt);

Map myModel = new HashMap();
int userID= Integer.parseInt((String)request.getParameter("id"));
int home = request.getSession(true).getAttribute("home")!=null?
(Integer)request.getSession(true).getAttribute("home"):0;

if (home==0){
home = userID;
}
User user= userManager.getUser(userID);
myModel.put("home", home);
myModel.put("user", user);
int state = user.getState();
if(state==0 && home!=userID){
request.getSession(true).setAttribute("home",home);
String rs = "This user has not been activated";
myModel.put("notActive", rs);
return new ModelAndView("activate", "ToActivate", myModel);

}
else if(state==0 && home==userID) {
String rs ="Click the following link to activate your UniNet";
myModel.put("doActive", rs);
return new ModelAndView("activate", "ToActivate", myModel);
}
else{
request.getSession(true).setAttribute("home",home);
List subList = userManager.getSubList(userID);
List skillList = userManager.getSkillList(userID);
List intList= userManager.getIntList(userID);
List courseList = userManager.getCourseList(userID);
List groupList = userManager.getGroupList(userID);
List newMsg = userManager.getMessageOfUser(userID,0);

myModel.put("subList", subList);
myModel.put("courseList", courseList);
myModel.put("skillList", skillList);
myModel.put("intList", intList);
myModel.put("groupList", groupList);
myModel.put("newMsg",newMsg.size());

return new ModelAndView("home", "Home", myModel);
}
}

public void setUserManager(UserManager uMage) {
userManager = uMage;
}

public UserManager getUserManager() {
return userManager;
}

}

View: search.jsp

HTML:

<%@ include file="include/include.jsp" %>

<fmt:message key="search"/>
<div class="body_container">
<div class="header">SEARCH RESULT</div>
<a class="home" href="/uninet/home.htm?id=<c:out value="></a>">Home
<div class="main">
<div class="info">
<ul>
<li> <a href="/uninet/home.htm?id=<c:out value=">
"></a></li>
</ul>
</div>
</div>
</div>

Screen shot

uninet_1 Home page

uninet_3

Message Box

Download: sakai-uninet.rar

NDLoc, 29/06/2009

]]> http://www.webnoob.com/2009/06/uninet/feed/ 0 Flickr Panda – a mashup written in Ruby on Rail and Ajax http://www.webnoob.com/2009/06/flickr-panda/ http://www.webnoob.com/2009/06/flickr-panda/#comments Sun, 28 Jun 2009 03:53:14 +0000 NDLoc http://www.webnoob.com/?p=90 Flickr is one of the largest online photo management and sharing application which claims to host more than 3.6 billion of images as June 2009. Flickr provides APIs for outside developers to develop mashup application which can interact with Flickr services. Flickr Panda is a set of AIPs allows users to take a list of recent public and safe photos.

In web development, a mashup is "a web page or application that combines data or functionality from two or more external sources to create a new service. The term mashup implies easy, fast integration, frequently using open APIs and data sources to produce results that were not the original reason for producing the raw source data.

An example of a mashup is the use of cartographic data from Google Maps to add location information to real estate data, thereby creating a new and distinct Web service that was not originally provided by either source.

Below is a step by step instruction to develop a simple Flickr Panda mashup application using in Ruby on Rail and Ajax.

Installation and configuration

Install Ruby on Rail:

The easy way to install Ruby on your machine is to visit download section of rubyonrails.org, and download the bundle install package, then download and install RubyGem.
When you have Gem installed, then you can install Rails by command:

gem install rails

Configure MySQL

By default, ROR bundle comes with a light weight database carrier call SQLite but I think that many web developers are fans of MySQL. To install MySQL :

gem install mysql

After installing MySQL, when you start your application, you may suffer the following error:

"!!! The bundled mysql.rb driver has been removed from Rails 2.2. Please install the mysql gem and try again: gem install mysql."

The problem is because MySQL 5.1 client library doesn't play well with Rails - the solution is simple however:

download older MySQL client library, for example one from InstantRails: http://instantrails.rubyforge.org/svn/t ... bmySQL.dll
copy the downloaded file to C:\Ruby\bin (or wherever you installed Ruby)

Create ROR application

rails flickr

The above command will generate a ROR standard directory structure
ruby_create
ruby_dir

Change the configuration of the database in Rails application:
Browse to flickr/config, open the file database.yml by wordpad and make some change:

JAVA:

# MySQL version

# gem install
development:
adapter: mysql
database: ruby
encoding: utf8
username: root
password: admin
host: localhost

* You may need to change the values database, username and password to the setting on your machine

Start webrick server:

In flickr directory:

ruby script/server

By default, webrick server will start on port 3000, open a web browser and type in:

http://localhost:3000/flickr/

to view your ROR application.

Note: even that your application does not need to use any database, you still have to install and config MySQL ( or another database carrier ) accurately in order for ROR to start a service.

Now, you have everything ready, let start to code.

Coding

ROR follows MVC model with a very strict naming convention, you need to pay a good attention to the names of model, view and controller

Model

To create a ROR model, you can go flickr/app/models , then create a new file named flickr.rb, but there is a better way

rails script/create model flickr

This command will automatically generate all necessary files and folders, such as controller, view, layout, test and set up the configuration as well.
Browse to flickr/app/models/ and open file flickr.rb to add some codes.
We are going to use 3 APIs from Flickr:

flickr.panda.getList : get a list of available Pandas
flickr.panda.getPhotos : get a list of photos under a Panda name
lickr.photos.getInfo: get information of a specific photo.

Noting that , in order to use Flickr APIs, you need to have a API key, to obtain a new key go to
http://www.flickr.com/services/api/keys/apply/

Because Flickr API will return a XML document, so we need to have to import rexml package to handle XML and of course net package to send REST request, you model will start with:
require 'net/http'
require 'rexml/document'
Sample code :

JAVA:

require 'net/http'
require 'rexml/document'
# key : ce8cc447f982b2f864ba423b8dff3e1a
# secret : 3abb6ef1ec9e1d75
# http://www.flickr.com/services/api/explore/?method=flickr.panda.getList
class Flickr
#@@proxy_addr = 'localhost'
#@@proxy_port = 8000
@@api_key=''
@@uri_list = 'http://api.flickr.com/services/rest/?method=flickr.panda.getList'
@@uri = 'http://api.flickr.com/services/rest/?method=flickr.panda.getPhotos'
@@uri_info = 'http://api.flickr.com/services/rest/?method=flickr.photos.getInfo'

def initialize(key)
@@api_key = key
@@uri ="#{@@uri}&api_key=#{@@api_key}"
@@uri_list ="#{@@uri_list}&api_key=#{@@api_key}"
@@uri_info ="#{@@uri_info}&api_key=#{@@api_key}"
end

def get_list()
#res = Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(@@uri_list)).body
res = Net::HTTP.get_response(URI.parse(@@uri_list)).body
xml = REXML::Document.new(res)
re="
<ul id="list">"
xml.elements.each('rsp/pandas/panda') do |e|
re = re + "
<li>" +"<a href="\"javascript:getPanda('#{e.text}')\"">"+ e.text+"</a>"+ "</li>
"
end
re = re + "</ul>
"
puts re
return re
end

def get_panda(panda_name,limit=10)
panda_name = panda_name.gsub(' ','+')
uri_temp = "#{@@uri}&panda_name=#{panda_name}&per_page=#{limit}&page=1"
#res= Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(uri_temp)).body
res= Net::HTTP.get_response(URI.parse(uri_temp)).body
xml = REXML::Document.new(res)
photos =[]

xml.elements.each('rsp/photos/photo') do |e|
photos <<e
end
i=0
re= "
<div id="panda_inside">
<h2>List #{limit} photos of Panda #{panda_name}</h2>
"
re= re + "
<ul id="panda_list">"
while i

if photos[i].attributes["title"]==""
photos[i].attributes["title"]="No Title"
end
re= re + "
<li>" + "<a href="\">" + photos[i].attributes["title"] + "</a></li>
<a href="\">"
i+=1
end
re=re + "</a></ul>
</div>
<a href="\">"
puts re
return re
end</a>

def get_info(id)
uri_temp = "#{@@uri_info}&photo_id=#{id}"
#res= Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(uri_temp)).body
res= Net::HTTP.get_response(URI.parse(uri_temp)).body
xml = REXML::Document.new(res)
owner=""
title=""
date=""
xml.elements.each('rsp/photo/owner') do |e|
owner = "Author: " + e.attributes["realname"] + ". Location: " + e.attributes["location"]
end

xml.elements.each('rsp/photo/title') do |e|
title = e.text
end

xml.elements.each('rsp/photo') do |e|
date= e.attributes["dateuploaded"]
date = Date.jd(date.to_i)
date=date.strftime("%B %d, %Y")

end
re= "<span id="info">Title: " + title + "
Uploaded date in Julian: " + date.to_s + "
" + owner + "</span>"
return re
end

def get_image(farm,server,id,secret)
src = "'http://farm#{farm}.static.flickr.com/#{server}/#{id}_#{secret}.jpg'"
img = "<img src="#{src}" alt="" />"
info = get_info(id)
re = img + "
" + info
return re
end
end

if your program runs through a proxy, then uncomment

#@@proxy_addr = 'localhost'
#@@proxy_port = 8000

and use the net command with proxy:

#res = Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(@@uri_list)).body
#res= Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(uri_temp)).body
#res= Net::HTTP::Proxy(@@proxy_addr, @@proxy_port).get_response(URI.parse(uri_temp)).body

Controllers
rails script/create model flickr

ROR will generate a controller name flickr_controller.rb under the directory flickr/app/controllers/
We will need three actions to handle to different request from the views:

index
get_panda
get_image

Sample code:

JAVA:

class FlickrController <ApplicationController @@flickr = Flickr.new('ce8cc447f982b2f864ba423b8dff3e1a') def index @fl = @@flickr end def get_panda @fl = @@flickr panda_name = params[:panda_name] re = @fl.get_panda(panda_name) render :text=>re
end

def get_image
@fl = @@flickr
farm = params[:farm]
server = params[:server]
id=params[:id]
secret = params[:secret]
re = @fl.get_image(farm,server,id,secret)
render :text=>re
end
end

Views
go to flickr/app/views/flickr/, create a file named index.html.erb

HTML:

Ruby on Rails - Panda Search
<%= javascript_include_tag "flickr.js" %>;
<%= stylesheet_link_tag "flickr.css" %>;
<div id="wraper">
<div id="top"><%= image_tag "rails.png" %><span id="header"> Ruby on Rails</span>
<h1>Flickr Panda Search</h1>
<div><%= render :text=>@fl.get_list() %></div>
</div>

JavaScript<

The javascript will be stored under directory flickr/public/javascripts/
Create a file named flickr.js and use the syntax bellow to include a javacript in the View
<%= javascript_include_tag "flickr.js" %>

JAVASCRIPT:

var asyncRequest;

function getPanda(name){
//alert(query.value);

try{
asyncRequest = new XMLHttpRequest();
asyncRequest.onreadystatechange = displayPanda;

var url ="http://localhost:3000/flickr/get_panda?panda_name=" + name;
url=url+"&sid="+Math.random();
//alert(url);
asyncRequest.open('GET',url,true);
asyncRequest.send(null);
document.getElementById('panda').innerHTML = '<img id="loader" src="/images/loader.gif" alt="" />';
document.getElementById('img').innerHTML = '';
}
catch(exception){
alert(exception);
}
setCookie("panda",name,180,'/');
}

function displayPanda(){
//alert(query.value);
if(asyncRequest.readyState==4 && asyncRequest.status==200){
var display =asyncRequest.responseText;
document.getElementById('panda').innerHTML=display;
setCookie("panda_list",display,180,'/');
}
}
function getImage(farm,server,id,secret){
try{
asyncRequest = new XMLHttpRequest();
asyncRequest.onreadystatechange = displayImage;

var url ="http://localhost:3000/flickr/get_image?farm="
+ farm + "&server=" + server + "&id=" + id + "&secret=" + secret;
url=url+"&sid="+Math.random();
asyncRequest.open('GET',url,true);
asyncRequest.send(null);
document.getElementById('img').innerHTML = '<img id="loading" src="/images/loading.gif" alt="" />';
}
catch(exception){
alert(exception);
}
}

function displayImage(){
if(asyncRequest.readyState==4 && asyncRequest.status==200){
var display =asyncRequest.responseText;
document.getElementById('img').innerHTML=display;
}
}

CSS

The stylesheet will be stored under directory flickr/public/stylesheets/
Create a file name flickr.css and use the syntax bellow to include a CSS in the View

<%= stylesheet_link_tag "flickr.css" %>

CSS:

body {margin:0px;padding:0px;font-family: Verdana, Arial, sans-serif;font-size:9pt;}
#wraper{width:1003px;min-height:600px;margin:0 auto;border:7px inset #666666; padding:10px 20px 20px 20px;}
#header {font-size:20pt;font-weight:bold;}
#footer{clear:both;}
.middle{float:left;vertical-align:text-top;}

Screen shots:

flickr_2

Download: flick_panda.rar

NDLoc, 28/06/2009

]]> http://www.webnoob.com/2009/06/flickr-panda/feed/ 0 Allimports – MVC and Ajax CMS http://www.webnoob.com/2009/06/allimports/ http://www.webnoob.com/2009/06/allimports/#comments Sat, 27 Jun 2009 04:03:24 +0000 NDLoc http://www.webnoob.com/?p=64 Allimports is content management system (CMS) that I developed for a car importer locating in Haberfield, Sydney. The system is a fully functional Ajax CMS in which I created a new MVC model on my own.

The website provides all features of a standard CMS and addresses the specific functions required for a car trading website, such as Special Offer, New Arrival list, multiple input search, email spam, to name just a few.

The system is developed by using the cutting edge web techniques, Ajax and MVC. Coining in 2005, for the last couple of years the term Ajax has captured a great concern of all web developers around the world and be considered as the hottest technique nowadays.

Ajax, Asynchronous JavaScript and XML, is a group of interrelated web development techniques used on the client-side to create interactive web applications or rich Internet applications. With Ajax, web applications can retrieve data from the server asynchronously in the background using XMLHttpRequest object without interfering with the display and behavior of the existing page(wikipedia).

Web site: www.allimports.com.au

Functionalities

Visitor:

View car list, special offer, details, photo show (using Mootool framwork)
Search, send enquiry, subscribe
....

Users:

View cars, add new, update, remove.
Add, remove, update photos
View enquiries, reply, remove
View user, update user state, unsubscribe
Manage profile
....

Admin

Add, remove users, disable users
Change system setting.
....

The new MCV model

Model–view–controller (MVC) is an architectural pattern used in software engineering. Successful use of the pattern isolates business logic from user interface considerations, resulting in an application where it is easier to modify either the visual appearance of the application or the underlying business rules without affecting the other.

- The model represents the information (the data) of the application.
- The view corresponds to elements of the user interface such as text, checkbox items, etc., and is responsible for the communication of data from the model to the user interface.
- The controller manages the communication of data from the user interface to the model, and the application of business rules to this data.

Typically, a view and a controller exist as a pair, and many such pairs exist in an application, each corresponding to very specific user interface elements.

In the analysis phase of the project, I intended to use an open source framework like CakePHP or Zend, therefore I have CakePHP installed and configured properly on my machine already. However, after examining CakePHP, I realized that the key factor underlying the MVC model of the framework is XMLHttpRequest, so I decided to develop a MVC model on my own using XMLHttpRequest as the request carrier.

MVC model

Below is how models, views and controllers communicate with each other:

When a request is sent from a View, such as user clicks a link or submit a search query, a JavaScript function of a Carrier is raised and send a XMLHttpRequest to the controller match with this view.
The action of the Controller will user a Model to perform some tasks, the return will be put back to the XMLHttpRequest
The View then receives response of the XMLHttpRequest and partially update the page to display the result.

Sample code

class.user.php

PHP:

require_once('setting.php');
class User{
function addSpecialDeal($car_id){
$start_date = date('Y-m-d');
$query="INSERT INTO specials(car_id,start_date) VALUES(".$car_id.",'".$start_date."')";
$result= mysql_query($query)
or die("Error addSpecialDeal - the query could not be executed\n");
return $result;
}
function updateCarState($car_id,$value){
$query="UPDATE cars SET value=".$value." WHERE car_id=".$car_id;
$result= mysql_query($query)
or die("Error updateCarState - the query could not be executed\n");
return $result;
}
}

controller-subscribe.php

PHP:

require_once('../model/class.view.php');
$name = $_REQUEST["name"];
$emial = $_REQUEST["email"];
$inform ="";
$check=true;

if($name==""){
$inform =$inform."
Please fill in your name";
$check=false;
}
if($emial==""){
$inform =$inform."
Please fill in your email";
$check=false;
}
if($check==true){
if(View::checkSubscribe($emial)==true){
$result = View::subscribe($name,$emial);
if($result==true){
$inform = '<span class="text_alert">You have joined Allimports.</span>';
}
else $inform = '<span class="text_alert">Please try again.</span>';
}
else $inform = '<span class="text_alert">You already subscibed to Allimports.</span>';
}
print $inform;

class.user.js

JAVASCRIPT:

var xmlHttp;
function GetXmlHttpObject() {
var xmlHttp = null;
try {
// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function removeEnquiry(id,page){
pos="car_list";
xmlHttp = GetXmlHttpObject();
if (xmlHttp == null) {
alert("Your browser does not support AJAX!");
return;
}
var url = "../controller/controller-remove-enquiry.php?id="+id+"&page="+page;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
document.getElementById(pos).innerHTML = xmlHttp.responseText;
}
};
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}

Screen shots:

Homepage
allimports_screenshot

User dashboard

allimports_user

NDLoc, 27/06/2009

]]> http://www.webnoob.com/2009/06/allimports/feed/ 0