[Glenn Puckett]

I am extremely new to MyEclipse for Spring and under pressure to make my first milestone of my first Spring project. I used the scaffold to generate the CRUD and security for my application. I am slowly starting to understand what is going on. I don’t have time to get to know how everything fits together as quickly as I would prefer.

I want to reorganize the menu.jsp that was generated by the scaffold. The first thing is to break up the activities into a tabbed menu. I was going to use jQuery UI tabs but saw references to Dojo and the fact that MyEclipse for Spring uses Dojo. So I started looking into that.

I have found the Dojo javascript libraries in Spring-js-2.0.7.RELEASE.jar which is part of Spring MVC 3 Libraries. In main.jsp which was generated by the scaffold I find:

<style type="text/css" media="screen">
  @import url("${pageContext.request.contextPath}/resources/dojo/resources/dojo.css");
  @import url("${pageContext.request.contextPath}/resources/dijit/themes/tundra/tundra.css");
/style>

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/dojo/dojo.js" djconfig="parseOnLoad: true" ></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/spring/Spring.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/spring/Spring-Dojo.js"></script>
<script type="text/javascript">dojo.require("dojo.parser");</script>

This is interpreted as:

<style type="text/css" media="screen">
  @import url("/MyApp/resources/dojo/resources/dojo.css");
  @import url("/MyApp/resources/dijit/themes/tundra/tundra.css");
/style>

<script type="text/javascript" src="/MyApp/resources/dojo/dojo.js" djconfig="parseOnLoad: true" ></script>
<script type="text/javascript" src="/MyApp/resources/spring/Spring.js"></script>
<script type="text/javascript" src="/MyApp/resources/spring/Spring-Dojo.js"></script>

I do have a resources directory under my main project in MyEclipse. But there are no dojo, dijit or spring directories there.

I have tried adding the code to display tabs on the menu.jsp. But nothing happens.

Here is the code I am using for that:

<script type="text/javascript"> 
  dojo.require("dojo.parser");
  dojo.require("dijit.layout.ContentPane");
  dojo.require("dijit.layout.TabContainer");
  dojo.require("dijit.form.Button");
</script>
 
<div id="mainTabContainer" dojoType="dijit.layout.TabContainer" style="width:100px; height=50px" >
  <div id="tab1" dojoType="dijit.layout.ContentPane" title="Login" selected="true" closable="true">Login</div>    
  <div id="tab2" dojoType="dijit.layout.ContentPane" title="Users" closable="true">Users</div>
  <div id="tab3" dojoType="dijit.layout.ContentPane" title="Application" closable="true">Application</div>
  <div id="tab4" dojoType="dijit.layout.ContentPane" title="Codes" closable="true">Codes</div>
  <div id="tab5" dojoType="dijit.layout.ContentPane" title="Curves" closable="true">Curves</div>
  <div id="tab6" dojoType="dijit.layout.ContentPane" title="Wizard" closable="true">Wizard</div>    
  <div id="tab7" dojoType="dijit.layout.ContentPane" title="Accounts" closable="true">Accounts</div>     
  <div id="tab8" dojoType="dijit.layout.ContentPane" title="Logout" closable="true">Logout</div>    
</div>

At this point I am assuming it can’t find the javascript or css files that are needed are not linked properly. It’s difficult to debug something when you don’t even know to worry about loading the support files or debugging code.

What have I done wrong?

[Glenn Puckett]

I have been able to get this working only if I bring in the dojo and dijit javascripts from external sources. But it won’t allow me to change the theme no matter what I do. I tried changing to another theme in sitemesh-decorators/main.jps but nothing ever happens. It appears locked into tundra no matter what I do. I’ve given up for the moment with modifying the look and feel as generated by scaffold. It is important to get the code working. But I will need to revisit this soon.

I hope I can find a tutorial on how to customize a project after it has been generated by the Spring scaffold. Otherwize the scaffold tutorial is not helpful at all if you can’t use the application as is out of the box.

[maywa36]

let to follow

[jkennedy]

The Dojo css is loaded directly from the spring-js-2.0.x.Release.jar file which is on the classpath of your project.
You can review Spring JS for more details.

If you open this jar file you will see that dojo and dijit are in the META-INF folder of this distribution.

The web.xml file has been configured to pass urls that begin with /resources/ through to the Spring org.springframework.js.resource.ResourceServlet which takes care of loading Dojo etc directly from the Spring JS jar file.

In the generated main.jsp file you will see that there is a Style section that reads:
<style type=”text/css” media=”screen”>
@import url(“${pageContext.request.contextPath}/resources/dojo/resources/dojo.css”);
@import url(“${pageContext.request.contextPath}/resources/dijit/themes/tundra/tundra.css”);
</style>

This causes all of the pages to be decorated with the same import for CSS which loads the Dojo and dijit themes from the Spring JS jar file.

If you would like to use a different Dojo theme, you should be able to change the line that includes /tundra/trundra.css to /soria/soria.css for example.

You would also need to change the <body class=”tundra spring” in this file to include your theme.

One thing to note, many of the buttons and table headers in the generated solution are using images and CSS other than the dojo css.

You should take a look at the file style.css which is in the WebRoot/css/ directory. This is where most of the styling takes place.
You should also look at the /WebRoot/images/ directory to see the images that are being used.

Thanks,
Jack

[Glenn Puckett]

Thanks Jack. I have been coding complex Java applications for a number of years now (12) but never encountered or thought to create the capability of loading non-class files from a jar. I guess that is rather narrow minded of me but we get locked into doing things certain ways and lack the time to learn alternative ways of doing things. Part of this entire exercise was to take the opportunity on a new project to jump past EJB 2 and Struts 1 technology that I have used up to now.

[jkennedy]

Here is a link with a little more detail:
http://static.springsource.org/spring-webflow/docs/2.0.x/reference/html/ch11s02.html

This is a Spring JS approach that we support, but don’t feel narrow minded on this one, I wouldn’t have taken this approach by default either.

There is something to be said for having web resources visible in the web folders… 🙂 and that is why you will find our generated CSS and images there.

I hope you are able to get the effect you are looking for, but please let me know if you need any assistance.

Thanks,
Jack

[Glenn Puckett]

Early in J2EE development the conventional wisdom appeared to be let the web server serve web content and let the java server serve java content. So I have always implemented Apache for the web content and jBoss for the java content. This has forced me to separate the css, js, images and other content from the EAR and WAR files. That makes me wonder. In order to implement this in a split environment of Apache/JBoss will I have to extract out the contents of the Spring JS jar files to the WWW directory structure I use for Apache? I think this is the case. But I’m not sure how Spring works underneath the “covers”. Or do you advise developers to not separate the application like that any more?

[jkennedy]

You should not have to extract the file, the servlet mapping that maps /resources/ to the Servlet on the App Server in the web.xml would remain in place and should continue to pass through as expected.

Let me know if you have any issues, thanks.

Jack

[DynDasE]

I want to ask , can I override the dojo calendar’s year in Spring and add 543 to it ?

[Glenn Puckett]

@jkennedy wrote:

You should not have to extract the file, the servlet mapping that maps /resources/ to the Servlet on the App Server in the web.xml would remain in place and should continue to pass through as expected.

Let me know if you have any issues, thanks.

Jack

This reminded me. I work on pretty high performance websites. One rule that was beat into me was let the web server do what the webserver does best and let the java server do what it does best. Apache can server web content much quicker and more efficiently than Tomcat, JBoss, etc can. Also it is very inefficient to tie up the Apache-Tomcat connection with web traffic. Just what I have learned over the years.

With that in mind I would be very reluctant to allow /resources/ to map to Tomcat, or JBoss in my case, so it can extract web content out of a jar file. That might be very effective for architects of api’s such as Spring MVC to include any web content in with the api, but not when it comes time for practical application. It’s a nice concept while testing in MyEclipse. I think I would be inclined to extract all web content out of the jar file and put it where Apache can handle it directly when it’s time to install in the production environment.

BTW.. I changed the css include in main.jsp to soria.css and the body class from tundra to soria. The pages did not change. So that did not solve the problem.

I do appreciate the assistance.

[jkennedy]

Sure, as I mentioned before, the idea of loading that content from a Servlet that pulls from the Jar file is a Spring JS construct, not a preference of our generation approach.

I am glad you were able to find the place to change the default theme.

I had mentioned in my previous post (it may have gotten lost in the details) that most of our UI controls use css and images that are generated rather than using the themes that are coming from Dojo.

Here is the section from the post above:

One thing to note, many of the buttons and table headers in the generated solution are using images and CSS other than the dojo css.
———-
You should take a look at the file style.css which is in the WebRoot/css/ directory. This is where most of the styling takes place.
You should also look at the /WebRoot/images/ directory to see the images that are being used.
———–
So go and review and modify these images and the css to suite your needs.
One other nice thing about our generated css and images is that they are served from the web folder and not a servlet.

Let me know if this helps.

Thanks,
Jack

[Author]

Posts