Facilitating Teamwork with XML and XSL

In this article I return to problems of teamwork among Web designers and programmers. On the one hand, the problem looks as though it does not exist at all. On another—in the development of complex and difficult sites, with huge files, and frequently varying data—this question of cooperation between Web designers and programmers is a big and important question!

Designers usually are not technical geeks. They also tend to not want to learn to program in order to help the programmers. And they are right, because they need to do their own jobs well. So, what happens when the programmers make a big change to the business logic within a project? They need to inform the designers, who will have to work with complex code, that may consists of numerous lines of HTML, JavaScript, and other code. It could be painful.

What is a solution to ease this pain? I see an easy one: XML with XSL.

In my opinion, it is difficult to exaggerate the opportunities and advantages that XML/XSL technologies provide to developers. Also, you can imagine a situation when it is necessary for you to deploy the same document on different devices (the personal computer, mobile phone, a handheld computer, and so forth); in that case, you can store the document as XML and apply to it different XSL schemes. And, it is worth mentioning that the division of the data on various files allows us to optimize working hours and correctly divide duties of all programmers and designers (actually, with what we also have begun in this article).

From the very beginning, I would like to mention that I do not want to talk too much about how it works. You can get all the theoretical information from different books; a lot of them already exist. My goal is to show you everything in practice. So, let’s start that.

We will use the JBoss 3.2.3 application server, which already comes with the Tomcat Web container. Of course, you can use any Web server you like. It can be anything—Tomcat, but separated from JBoss; Blazix; or any other code that we will prepare—is J2EE spec-based, so it’s independent of the Web container. Any Web container that supports the J2EE specification will suit us. I assume that you also are familiar with the development of J2EE applications, anyway. I will present you with everything step by step, but for a deep understanding you need to know the basics.

Let’s begin. Create a directory somewhere, and title it as you like. Then, create the WEB-INF/, WEB-INF/classes/, src/, and src/demo/ subdirectories inside it. First of all, we will need to create our custom tag lib. Here it will is: demo/src/TransformTag.java.

package demo;

import javax.xml.parsers.*;
import javax.xml.transform.*;
import javax.xml.transform.dom.*;
import javax.xml.transform.stream.*;
import javax.servlet.jsp.*;
import javax.servlet.jsp.tagext.*;
import org.w3c.dom.*;
import org.xml.sax.*;

public class TransformTag extends BodyTagSupport {

   private String xsl = null;

   public TransformTag() {
   }

   public void setXsl(String xsl) {
      this.xsl = xsl;
   }

   public String getXsl() {
      return xsl;
   }

   public int doStartTag() throws JspException {
      return BodyTag.EVAL_BODY_TAG;
   }

   public int doAfterBody() throws JspException {
      try {
         DocumentBuilderFactory dbf =
            DocumentBuilderFactory.newInstance();
         dbf.setNamespaceAware(true);

         DocumentBuilder db = dbf.newDocumentBuilder();
         Document body = db.parse(new
            InputSource(bodyContent.getReader()));

         Document xslDom = db.parse(pageContext.getServletContext().
                                    getRealPath(xsl));

         Transformer transformer = TransformerFactory.newInstance().
                                   newTransformer(new DOMSource
                                                  (xslDom));
         transformer.transform(new DOMSource(body),
                               new StreamResult(getPreviousOut()));
      } catch(Exception e) {
         throw new JspException(e.getMessage());
      }

      return BodyTag.SKIP_BODY;
   }
}

To compile it, we need to type the following (please assume that JBoss, in our case, is installed into the c:jboss-3.2.3 directory):

javac -classpath c:jboss-3.2.3serverdefaultlib
                   javax.servlet.jar -d ../../WEB-INF/classes/
                    TransformTag.java

That was easy. The compiled class will appear in the WEB-INF/classes/demo directory and will be called TransformTag.class. Our next step will be the creation of a TLD file for our custom tag library and, of course, a web.xml configuration file. So, here they are: WEB-INF/web.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>
   <taglib>
      <taglib-uri>xmljsp</taglib-uri>
      <taglib-location>/WEB-INF/xmljsp.tld</taglib-location>
   </taglib>
</web-app>

And WEB-INF/xmljsp.tld:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE taglib PUBLIC
   "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.1//EN"
   "http://java.sun.com/j2ee/dtds/web-jsptaglibrary_1_1.dtd">
<taglib>
   <tlibversion>1.0</tlibversion>
   <jspversion>1.2</jspversion>
   <shortname>xmljsp</shortname>
   <tag>
      <name>proceed</name>
      <tagclass>demo.TransformTag</tagclass>
      <bodycontent>JSP</bodycontent>
      <attribute>
         <name>xsl</name>
         <required>true</required>
         <rtexprvalue>true</rtexprvalue>
      </attribute>
   </tag>
</taglib>

You will never believe it, but there are only two files left to finish: index.jsp itself:

<%@ page contentType="text/html" %>
<%@ taglib uri="xmljsp" prefix="xml" %>
<xml:proceed xsl="test.xsl">
<personality>
   <item>
      <name>Olexiy Prokhorenko</name>
      <email>green@prohorenko.com</email>
      <website>http://www.prohorenko.com</website>
   </item>
   <item>
      <name>Alexander Prohorenko</name>
      <email>white@prohorenko.com</email>
      <website>http://www.prohorenko.com/white</website>
   </item>
</personality>
</xml:proceed>

And the stylesheet, of course: test.xsl:

<?xml version="1.0" ?>
<xsl:stylesheet version="1.0"
 xmlns_xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<center>
<table border="1" width="80%">
<tr>
<td align="center"><b>NAME</b></td>
<td align="center"><b>EMAIL</b></td>
<td align="center"><b>WEBSITE</b></td>
</tr>
<xsl:apply-templates select="personality"/>
</table>
</center>
</body>
</html>
</xsl:template>
<xsl:template match="item">
<tr>
<td align="center"><xsl:value-of select="name"/></td>
<td align="center"><xsl:value-of select="email"/></td>
<td align="center"><xsl:value-of select="website"/></td>
</tr>
</xsl:template>
</xsl:stylesheet>

The explanation of why you need this or that file will be given later. It’s practice, and it means that we first need to run everything and see that it works. And, we are almost done. To create a WAR with our Web application, you need to type the following (you need to be in the directory that you created at the beginning of this article):

jar -cvf xmljsp.war *

You now need to deploy your WAR file. If you are using JBoss need to run JBoss and copy the file, xmljsp.war, into c:jboss-3.2.3serverdefaultdeploy (or you can copy first, then run; it does not matter). Once deployed, you can use it. Point your browser to http://localhost:8080/xmljsp/index.jsp and enjoy. If you did everything correctly, then you will see the following window:

Looks good, doesn’t it?

Now, everything is pretty simple. The stylesheet format is plain XML, as well as the format of the current JSP.

The goal of an XSL file is to transform a tree of an XML file to another tree. This new tree can correspond to HTML or WML, thus representing the information in a different formatted view. The JSP file presented carries this transformation out with maximum simplicity. More important is that it completely excludes the design from itself, and contains only the necessary and simple way of presenting the data. Everybody can easily modify it—programmer or Web designer—it does not matter. A programmer could change the data format as easily as a Web designer could change the page design and layout.

The given example represents the easiest and most elementary way of implementating XML/XSL technology usage in JSP. Although you will be creating real systems, it is necessary to note that:

• As far as an XSL file is static, to increase speed it is possible to keep pre-compiled XSL (objects of a class javax.xml.transform.Templates).
• There is no necessity to create a DOM tree of XML contents because it is possible to take advantage of the SAX parser for a single-pass transformation that could also raise speed.

Click here to download xmljsp.war as a zip file.

I hope you can use this article as your first step into the real world of useful technologies such as XML/XSL.