Tuesday, November 22, 2005

XSLT Quickly book plug and did I mention you should buy Manning books?

I had a comment left on my blog from Bob DuCharme who is the author of the XSLT Quickly from Manning (I am most honoured Bob). Bob has created a master table of contents for all of his XML.com columns about XSLT. These articles include introductions to basic XSLT concepts, hints to approaching typical XSLT problems and tours of XSLT 2.0 features. Many of these articles also feature in his book XSLT Quickly.

Bob DuCharme's "Transforming XML" Columns (master Table of Contents)

You can also obtain Chapter 1 and Chapter 5 sample chapters from XSLT Quickly on the Manning site. Chapter 1 is a brief tutorial introduction to XSLT. Chapter 5 concerns programming using XSLT including coverage of control statements, XSLT extensions, maths, variables and string handling.

At the risk of becoming SPAM! Regular readers (as if I have regular readers!) will have noticed that I have recently succumbed to the commercial dark side by putting Manning banners on my site. I have joined the Manning affiliate programme, this means if you click on one of my banners and actually buy a book I will eventually get some free Manning books. This would be excellent as in the UK we have some kind of 1 pound = 1 dollar exchange thing going on (no wonder we are often called Treasure Island)! Somebody told me that "Borders" is a bargain book shop in the US (not so here), anyhow... Manning books are cool, they are well written by clued up, well respected authors (like Bob) and contain many useful examples (electronic PDF versions are often available). I would have absolutely no hesitation in highly recommending Manning books. Many of these books have become the bibles for their particular technologies e.g. JSTL in Action, Struts in Action, Struts Recipes, Spring in Action. For example I couldn't imagine my developer life without Appendix A: JSTL Reference from Shawn Bayern's JSTL in Action (available for free on the Manning site).

...and the award for most affiliate programme links to Manning in a blog entry goes to...

Friday, November 18, 2005

Yet another Google Suggest clone

A colleague of mine said wouldn't it be really great if we could have Google Suggest like functionality in our web applications. Applications like our contacts directory would really benefit. He said this in such a wistful way that I sensed he thought it was highly unlikely that this would ever happen.

I had a couple of hours to kill so I thought I'd take a look at the problem. Having perused the obfuscated Google Maps JavaScript code previously I knew that reverse engineering Google Suggest was probably a non-starter. I immediately stumbled upon ObjectGraph's Dictionary which exhibit's something like the desired behaviour. There was even a helpful explanation and sample source code written in JavaScript and ASP. This was now far too tempting a challenge to resist so I set about writing a similar application using JSTL.

Firstly the backend database, my initial contact directory example used a dataset of 30000 tuples of data. I wanted to use an embedded database since I was sure that our DBA's would not be happy if I ran a potentially labour intensive application against their important data. I initially tried to import the data into HQLDB but it was flaky and kept running out of memory, not a good start. I had a quick scout about and settled on giving Apache Derby a go. Apache Derby recently graduated from the Apache Incubator but in this case this did not mean it was Alpha code. Derby was only in the incubator for the transition period from the commercial database CloudSpace into the open source Derby project.

Derby contains a very useful interactive shell that I could use from the command line to quickly install my data. For illustrative purposes I have created a tiny version of the application using the chemical element data from the periodic table.

Using Derby's ij to run SQL scripts:

java -cp ./lib/derby.jar;./lib/derbytools.jar -Dij.database=jdbc:derby:elements;create=true org.apache.derby.tools.ij elements_create.sql
java -cp ./lib/derby.jar;./lib/derbytools.jar -Dij.database=jdbc:derby:elements org.apache.derby.tools.ij elements.sql

I knocked up a quick JSTL page to query the database and return the results that would eventually appear in the search drop down.


<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
<%@ taglib prefix="sql" uri="http://java.sun.com/jstl/sql" %>

<sql:setDataSource
var="dataSrc"
driver="org.apache.derby.jdbc.EmbeddedDriver"
url="jdbc:derby:C:/Tomcat/webapps/periodicTableSuggest/WEB-INF/db/elements"
user=""
password=""
/>

<c:set var="sql">
select Name, ElementSymbol, AtomicWeight, AtomicNumber from Element where lcase(Name) like lcase('<c:out value="${param.k}"/>%')
</c:set>

<sql:query var="queryResults" dataSource="${dataSrc}" maxRows="10" sql="${sql}"/>

<c:forEach var="row" items="${queryResults.rows}">
<c:out value="${row.name}"/>;Symbol = <c:out value="${row.elementsymbol}"/>, Atomic Number = <c:out value="${row.atomicnumber}"/>, Atomic Mass = <c:out value="${row.atomicweight}"/>:
</c:forEach>

I thought I would build upon the JavaScript that ObjectGraph are using. However, I wanted more Google Suggest like behaviour. I found two articles on a similar theme; phpRiot's Cloning Google Suggest with AjaxAC and XmlProNews's Building A Suggest List With XMLHttpRequest. Borrowing some of the CSS from the phpRiot article and some of the approach from the XmlProNews article I managed to coble together something that I was happy with and the result can be found at:

http://cse-mjmcl.cse.bris.ac.uk/periodicTableSuggest

Granted this is not yet perfect but I think you'll agree it is nethertheless very impressive and it was not a very complicated thing to do either. Allowing the world at large to access this application will also give me a pretty good idea of how robust this mechanism is although if my blog goes offline you'll know why!

Sunday, November 06, 2005

Web 2.0 podcasts, AJAX and all that...

This week I have been mostly listening to podcasts...

O'Reilly's Distributing the Future podcasts

For those of you in the dark about what a podcast is, a podcast is essentially a RSS feed which links to audio files rather than web pages. The podcast I have been listening to is O'Reilly's Distributing the Future, which as you might expect from O'Reilly contains some very high quality content.

I'm still in the middle of listening to the recent batch concerning Web 2.0 and the O'Reilly sponsored Web 2.0 conference. I may transfer the MP3's to my pre-iPod Creative MuVo 128Mb MP3 player but in contrast to the usual assortment of background music I keep on it, I really do intend to listen to these broadcasts carefully. Some very interesting points were made by Marc Hedlund in the Data for Web 2.0 entry. He was speaking about the merging of online and offline content. He mentioned Google Desktop which I have coincidently been looking at this week.

Google Desktop

Google Desktop's (GD) new sidebar provides some Apple Dashboard / Konfabulator like functionality. The real core functionality of GD is that it provides a search engine facility for the files on the local harddisk, the clever bit is that when I access Google from my browser I now have an additional options to search my local hard disk in the same way as I would search the web. This is partially achieved by the GD client software installing a "web server" on my machine for the local search. Marc Hedlund makes the point that many people do not understand that although they can search their local files via Google that data is not accessible to anyone else using Google!

Oracle Collaboration Suite

I attended a technical presentation given at my workplace by Oracle this week about Oracle Collaboration Suite. [engage rant mode] Now as the old saying goes 'when you all you have is a hammer, everything looks like a nail'. Oracle's Hammer is called the Oracle 10g Database and the nails in question include e-mail, calendar, voicemail, mobile communication, content management, search and file management. Apologies as I might be guilty of paraphrasing this in a quite cynical way! Oracle are completely open standards based and as long as you only every intend to use Oracle's email server, calendar server, LDAP server, application server, database, search technology, single sign-on mechanism, web service APIs, development software, and development tools (and a few other Oracle bits and bobs) you should be just fine!

Undeniably impressive was the concept of "workspaces" which looked like a quick way to get Yahoo/Google Groups style of web presence established quickly.

For quite a bit of the presentation I was told how I could upload my files using WebDAV to a backend database and this could then be accessed by others over the web. I got the impression that all we would need to do this was a hefty 10 processor server with a couple of terabyte hard disk (or 5 suitably configured 2 processor Linux machines), some extensive capacity planning, a cultural overhaul and complete organisational restructure and then the Oracle Collaboration Suite would be a very good fit for our organisation. [disengage rant mode]

To be fair I can see the some clear benefits of this approach but I couldn't help thinking that I could virtually already do some of this "on the cheap" by simply installing a web server on my workstation. It would seem that centralizing all our services on one server in the midst of the general trend to farming our processing to the client side is a bit like urinating into the wind.

The future?

There is currently a finite number of internet ports on my workstation, there is therefore a limit to the number of web servers I can reasonably install on my machine. This becomes especially critical if each client requires multiple ports for secure and insecure connections, etc.

There is a lot of potential for a "mashup" of the technologies using AJAX and Greasemonkey married to the Google Desktop style of local / remote web interaction. The fact that I heard Mitchell Baker talking about Greasemonkey in a "Distributing the Future" podcast and Mark Pilgrim seems to be writing a book about it fills me with expectation that it will soon become an important development tool that I can't ignore. There may well come a time when a local web server installation will become integral part of the web browser itself. If this web server contained a JavaScript scripting engine like Mozilla's Rhino, all the better. If the web is going to make a transformation from Web 1.0 where it is essentially a "Pull" (read only) to Web 2.0 where it will be more "Push and Pull" (read and write) medium then, to me at least, it makes total sense that we will have all have webservers on our workstations (even if this is less obvious than say a local install of Apache HTTPD is now). I hope that the need for this kind of technology is identified more widely soon so that a standards body can emerge and establish a multi-vendor reference implementation and common programming interface. Is this what Web 2.0 will become? I may have more insight when I've finished listening to the "Distributing the Future" podcast!

The future is here it's just not evenly distributed yet...

Apache Struts Bridge: turning Struts apps into Portlets

With the help of Satish Sekharan of the Memorial University of Newfoundland, I have been experimenting with Struts Bridge (part of the Apache Portals Bridges project) which can be used port a Struts application to JSR168 portlet.

See JASIG Wiki for further details:

JASIG Wiki: Struts Bridge

Tuesday, November 01, 2005

A simple JSP Button Maker using Ditchnet's 2D taglib

Luca Zappa's Brilliant Button Maker is a most impressive and useful application. It primarily uses PHP and the GD library to do its heavy lifting. I've used the GD library in a past life when I was a Perl programmer. I thought I'd see just how easy it was to use Ditchnet's 2D taglib to produce 80x15 buttons like Luca's application does. The answer is that 2D taglib is surprisingly easy to use and the resulting JSP page does not leave me feeling dirty like many "hacky" methods I've used previously do. The 2D taglib supports implicit objects in much the same way that JSTL does (I suspect that this is why it appears to require a 2.4 servlet container). Any object I can set on a page using JSP/JSTL I can access inside the 2D taglib scriptlet. I installed the wonderful Silkscreen font which is widely used in antipixel style buttons. I located a Hex2Color method in Traverse Technologies Open Source Fulcrum product and copied it into my page and after a little fiddling I've created a fairly simple JSP page that can create 80x15 buttons like this:

The simple script is shown below (I haven't yet tried the Java 2D API image support). Luca's HTML form and JavaScript cleverness could easily be converted to sit in front of this JSP powered Button Maker.


<%@ taglib prefix="twod" uri="http://ditchnet.org/jsp-2d-taglib" %>
<%

pageContext.setAttribute("outerBorder", hex2Color("#666666"));
pageContext.setAttribute("innerBorder", hex2Color("#ffffff"));
pageContext.setAttribute("barPosition", new Integer(25));

pageContext.setAttribute("leftFill", hex2Color("#ff6600"));
pageContext.setAttribute("leftText", "RSS");
pageContext.setAttribute("leftTextColor", hex2Color("#ffffff"));
pageContext.setAttribute("leftTextPosition", new Integer(5));

pageContext.setAttribute("rightFill", hex2Color("#898E79"));
pageContext.setAttribute("rightText", "VALID");
pageContext.setAttribute("rightTextColor", hex2Color("#ffffff"));
pageContext.setAttribute("rightTextPosition", new Integer(4));

%>
<twod:canvas id="button" width="80" height="15" alt="A button">

importClass(java.awt.BasicStroke);
importClass(java.awt.Font);

var endCap = BasicStroke.CAP_BUTT ;
var join = BasicStroke.JOIN_MITER;
var stroke = new BasicStroke(2,endCap,join);
g.setStroke(stroke);

// Border

g.setColor(pageScope.innerBorder);
g.drawRect(1,1,78,13);

g.setColor(pageScope.outerBorder);
g.drawRect(0,0,80,15);

// Bar

g.setColor(pageScope.innerBorder);
var barPosition = pageScope.barPosition;
g.drawLine(barPosition,1,barPosition,12);

// Left block

g.setColor(pageScope.leftFill);
g.fillRect(2, 2, barPosition, 11);

// Right block

g.setColor(pageScope.rightFill);
g.fillRect(barPosition + 3, 2, 80 - barPosition - 5, 11);

g.setFont(new Font("Silkscreen", Font.PLAIN, 9));

// Left text

g.setColor(pageScope.leftTextColor);
g.drawString(pageScope.leftText, pageScope.leftTextPosition, 10);

// Right text

g.setColor(pageScope.rightTextColor);
g.drawString(pageScope.rightText,pageScope.rightTextPosition + barPosition,10);

</twod:canvas>
<%@page import="java.awt.Color" %>
<%!

// Hex2color method stolen from com.traversetechnologies.fulcrum.util

public static final String HEXSET = "0123456789ABCDEF";

public static Color hex2Color(String hexcolor) {
hexcolor = hexcolor.toUpperCase();
if ( hexcolor.startsWith("#") )
hexcolor = hexcolor.substring(1);
else if ( hexcolor.startsWith("0x") || hexcolor.startsWith("Ox") )
hexcolor = hexcolor.substring(2);

int r = hex2decimal(hexcolor.substring(0,2));
int g = hex2decimal(hexcolor.substring(2,4));
int b = hex2decimal(hexcolor.substring(4,6));
return ( new Color(r, g, b) );
}

private static int hex2decimal(String hex) {
hex = hex.toUpperCase();
int j = HEXSET.indexOf(hex.charAt(0)) * 16;
int k = HEXSET.indexOf(hex.charAt(1));
return (j+k);
}

%>

Scripting graphics and script language scriptlets in JSP

Ditchnet's 2D taglib allows a user to incorporate Java 2D API graphics into their web pages without applets, flash or any other fancy accessories.

I was looking through some JSP graphics tag libraries. I found JFreeChart and CeWolf which for future reference look to be really useful charting libraries. Then I discovered Ditchnet's 2D taglib via a link to another Ditchnet offering an XHTML/CSS menu tabs taglib.

At sometime in the future browser vendors will agree upon a common standard for web graphics using SVG or WHATWG's Canvas tag or some other new standard. Until that time this tag library can enable cross platform dynamic graphics. A slight drawback of the 2D taglib is that it appears to require a 2.4 servlet container (e.g. Tomcat 5+).

I wouldn't describe myself as a AWT programmer but using this tag library was quite easy. I located an example of using the Java 2D API in Sun's Java Tutorial in the section on Constructing Complex Shapes from Geometry Primitives. Adapting the tutorial's example I developed my script thus:


<%@ taglib prefix="twod" uri="http://ditchnet.org/jsp-2d-taglib" %>
<twod:canvas id="pear" width="120" height="120" border="1px" alt="A pear">

importClass(java.awt.geom.Ellipse2D);
importClass(java.awt.geom.Area);
importClass(java.awt.Dimension);
importClass(java.awt.Color);

var circle = new Ellipse2D.Double();
var oval = new Ellipse2D.Double();
var leaf = new Ellipse2D.Double();
var stem = new Ellipse2D.Double();

var circ = new Area(circle);
var ov = new Area(oval);
var leaf1 = new Area(leaf);
var leaf2 = new Area(leaf);
var st1 = new Area(stem);
var st2 = new Area(stem);

var w = 120;
var h = 120;
var ew = w/2;
var eh = h/2;

g.setColor(Color.green);

// Creates the first leaf by filling the intersection of two Area objects created from an ellipse.

leaf.setFrame(ew-16, eh-29, 15.0, 15.0);
leaf1 = new Area(leaf);
leaf.setFrame(ew-14, eh-47, 30.0, 30.0);
leaf2 = new Area(leaf);
leaf1.intersect(leaf2);
g.fill(leaf1);

// Creates the second leaf.

leaf.setFrame(ew+1, eh-29, 15.0, 15.0);
leaf1 = new Area(leaf);
leaf2.intersect(leaf1);
g.fill(leaf2);

g.setColor(Color.black);

// Creates the stem by filling the Area resulting from the subtraction of two Area objects created from an ellipse.

stem.setFrame(ew, eh-42, 40.0, 40.0);
st1 = new Area(stem);
stem.setFrame(ew+3, eh-47, 50.0, 50.0);
st2 = new Area(stem);
st1.subtract(st2);
g.fill(st1);

g.setColor(Color.yellow);

// Creates the pear itself by filling the Area resulting from the union of two Area objects created by two different ellipses.

circle.setFrame(ew-25, eh, 50.0, 50.0);
oval.setFrame(ew-19, eh-20, 40.0, 70.0);
circ = new Area(circle);
ov = new Area(oval);
circ.add(ov);
g.fill(circ);

g.draw(circ);

</twod:canvas>

and lo' and behold it created a Pear (and a mighty fine pear it is too! Sorry I couldn't resist the Benny Hill style innuendo).

I was most impressed and am already thinking about how I might use this to produce a Brilliant Button Maker style application. Another impressive thing is that, this method is virtually a scriptlet and yet I loved it! I started thinking that there must be other ways to create innovative and more generic non-JSP scriptlets inside JSP pages and there is, BSF.

Scripting in JSP, XSLT and BSF

BSF is one of those products that I have seen mentioned before but I have never previously taken the time to find out what exactly it does. It turns out it enables the incorporation of script languages in a JSP (amongst other things). Using BSF I can execute Python, TCL or Javascript (and other scripting languages) directly in my JSP.

Immediately I thought how cool it would be to make use of Rhino's support for E4X in my JSP pages but unfortunately it seems that BSF does not yet work with the latest version of Rhino. Nevertheless it looks like it could be a useful resource. Then I noticed that Xalan supports BSF for scripting. This means I can write an XSLT which, for example, makes use of external JavaScript function. Although this is interesting this seems a little too much like what Microsoft are doing with HTML Applications. Something about the concept of writing a complex Xalan specific application just seems a little standards ignorant and wrong to me.