Sunday, September 13, 2009

Continuing Appfuse Application Using Eclipse



We already have the application
, it's all inside the folder tunasbangsa, but it's hard if we maintain and updating files scratch, we use eclipse for the IDE, just download eclipse, get the latest version, the Galileo version. after extract in the preferred folder, just run eclipse by double click eclipse.exe.

Adding Project
Add new project -> Java Project -> Create from existing source, point to folder tunasbangsa. At first, we gonna an error sign in our folder in project explorer, something like cannot find ant.jar or junit.jar. To resolve this error. Go to Project -> Properties -> Java Build Path, set the missing jar into the right path, I add New Variable, the button is right of list, I set into my Ant folder "D:/Java/apache-ant-1.7.0", and then I fix the missing jar into "ANT_HOME/lib/ant.jar". There should be no error anymore.


Setting Ant From Eclipse

Window -> Show View -> Ant, and then add buildfiles, point it into tunasbangsa build.xml, collapse the icon and there will be list of command we can call, we need only to double click it, for example for clean or deploy. We call deploy every we made a change into our application.
In appfuse, the default if we deploy, we also drop the database and create new again, so we don't need that again, just comment the value of db-drop and db-load, db-drop is for drop the database, db-load is for loading value from sample-data.xml. Do not comment everything, but comment the value in case of both of that command called by other command.
<target name="db-drop" depends="hibernatedoclet" description="drops database tables">
<!-- <taskdef name="schemaexport", ....

Setting Tomcat From Eclipse
We can debug altough it is a web application by setting tomcat inside eclipse, Window -> Show View -> Servers, add new server -> Tomcat 5.5, set the installation Directory into the appropriate folder, e.x in "C:\apache-tomcat-5.5.28", And then press finish, so in the Server view there will our new tomcat server, double click it. In the server locations, choose "Use Custom Location", if the radio disabled, just create new Tomcat Server, usually it is disabled if we already used the server. And browse Server path into our tomcat folder, and then choose radio Use Tomcat Installation, and save. And also set the Timeouts into 90 seconds, sometimes it needs more than 45 second for starting tomcat via eclipse.

Changing the Template of TunasBangsa
In appfuse we used sitemesh decorator to handle the UI, the styles are in folder "tunasbangsa\web\styles" there are three styles already, the default that we used so far is simplicity, to change the style, modify file web.xml in folder "tunasbangsa\web\WEB-INF\", there are a lot of context parameters, goes to the param-name=csstheme, the value=simplicity, change into "puzzlewithstyle", deploy it, run tomcat, I try to make it simple but not as simple as simplicity.

And also change the name of the application, in the web.xml changse the property of display-name into "Tunas Bangsa" and in the ApplicationResources.properties change "webapp.name=Tunas Bangsa".

I inspired by my campus site, I use the similar header and footer, I save the sites, I modify the header, add "Tunas Bangsa IKA ITS Jakarta Raya" in the right of the header. The template is similar with puzzlewithstyle, there are menu in header, so I copy folder puzzlewithstyle inside folder styles, I name it tunassimple, and inside the folder I paste the new header and footer. I change many things in .css files specially the color of the fonts, I just change and deploy to get my preferred stile. On thing important I met is I shuld add property height inside body, to make an html <table> tag using css.
body {
...
height:100%;
}
and inside header and footer I add property height
div#header {
...
height: 147px;
}
So, it similar with table and tr height, I did not use table because it not recommended nowadays, people recommend using style or css.

For the application's icon, I go to ITS logo site, I copy ITS logo, and modify using photoshop, I'm not using gimp anymore, but the first header of this application I use gimp on my laptop. I only take the ITS name because I only need to show small icon that shows in the tab of my application. Deploy again and run tomcat, the result shows in the capture above.

No comments: