In order for me to fulfill my project’s goal of implementing the retained-mode graphics API of Draw2d in terms of the retained-mode API of SVG, I need to be able to develop SVG using GWT. I remain confident that this is feasible, but it has been nontrivial to set up.
I’ve since been investigating the feasibility of scripting pure SVG using GWT. The first possibility I looked into was using GWT’s DOM API to manipulate SVG.
The initial consideration was what kind of document would I use to deliver the SVG content? There roughly three possibilities for displaying SVG on the web today, and they are:
1. Via a pure SVG document
2. XHTML document with inline SVG; or an XHTML document with SVG embedded via the object or iframe tags
3. HTML4 document with embedded SVG via the object or iframe tags
HTML5 documents will also allow SVG inlining (without even needing to use XML namespaces!), but I don’t think that there are any browsers that currently support this, so I didn’t consider this.
Option 3 proved to be problematic as well. In principal, what should have occurred was to have the object tag reference an SVG document in its data attribute, and then set an onload event listener on the object tag. Once the object tag has finished loading, then it would be possible to script its DOM via the object tag’s contentDocument property. Setting a load listener on a document before scripting its DOM is a very common pattern in web front-end programming, and so I assumed that this would be straightforward to implement with GWT.
Not so. GWT, unfortunately, doesn’t support setting event listeners on DOM nodes! I couldn’t believe this, because it is such a basic, fundamental feature of HTML DOM, but it’s true. I think the motivation for this is that GWT would prefer that you use its built-in widgets rather than low-level DOM. In any case, the effect of this is that it is not possible to listen for an onload event on a document simply using GWT’s implemnetation of DOM, so I couldn’t script the SVG DOM inside the object tag out of the box with GWT.
I found other problems with GWT’s DOM implementation as well. To begin, it does not implement the standard Java interfaces published by the W3C (distributed by the Apache XML Commons). This is problematic because SVG has its own DOM, and while it is not necessary to use it (you can script everything in terms of the standard XML DOM), it would be beneficial to use the SVG DOM in development. Because of the way GWT’s DOM has been implemented, it cannot be easily extended to make use of the standard W3C interfaces for SVG.
With these two shortcomings in mind, it seemed that the solution was to actually create a full DOM implementation for GWT in a way that used the standard W3C interfaces. The gwt-dom project started to do this back in 2007, but stopped development after GWT 1.5 included a DOM implementation. On the project page, they say that the project has been made “completely obsolete” by GWT 1.5, but I disagree, as there is still a need for a standards-compliant DOM implementation in GWT, at the very least in order to fulfill the needs of this project. Still, it makes sense to reuse as much of GWT’s DOM implementation as possible: it’s less work for me to implement and maintain.
There have been some problems so far with this approach so far, but I think this is mostly me tripping over the me tripping over Java’s type system. I often need to convert between arbitrary objects that implement DOM interfaces, and GWT DOM objects, and this can be a bit tricky. I have a solution, but it’s an ugly one, and I’m hoping to find a better way. I’ll post more about this later.
So, my status is as follows: I have HTML DOM scripting working, and I’m now hooking up events. After that, it should be possible to test scripting of SVG content, and I will hopefully be able to start programming against it with respect to Draw2d very soon.
I’m not to sure where this work is going to live when I’m done… upstream in the now-defunct gwt-dom project? I may try to contact the author and see what he thinks.