xPages and Javascript Libraries/Toolkits

When it comes to developing web applications
in xPages I’ve heard a number of discussions around which JavaScript library
or toolkit you should be using. There are many excellent JavaScript toolkits
the most common being MooTools, JQuery, YUI, EXT etc etc. There are tons
of them and they all have their own benefits and community of users around
them which will tell you that their particular toolkit is better then all
the rest.

When it comes to xPages there is already
a JavaScript toolkit pre-installed on the domino server called Dojo. If
you have looked at Dojo in any way you are probably thinking that IBM selected
Dojo because it has no documentation and would therefore be a perfect fit
in the xPages world because the documentation for xPages is also practically
nonexistent, but you would be wrong.

JQuery and MooTools on their own are
very lightweight libraries, the powerful features only start to appear
when you add in plugins that the developer communities around both libraries
have created, however this can pose a problem, when jQuery or MooTools
gets updated there are no guarantees that the plugins your using will still
work and lets not forget about licensing, are those plugins your using
licensed for use in corporate applications.

Dojo on the otherhand comes with Dijits
and DojoX as part of the package. These optional libraries that are easily
added to your page by using a dojo.require statement are the equivilent
of plugins in the other libraries but because they are part of the package
you know that when dojo gets updated all these extras will also get updated.
That is an incredible bonus for the dojo user community.

Now you may have seen some really cool
MooTools or JQuery examples and want to use them in your website, you could
add the Jquery or MooTools layer on top of the Dojo layer in xPages but
why stuff loads of unnecessary files down the pipe to your users when you
could do it all in Dojo. There is very little you can do in JQuery or MooTools
that can’t be done in dojo. At the end of the day the logic is the same
its really just a case of a slightly different syntax.

As an example of what I mean I found
a really cool ‘sliding login’ written by Jeremie Tisseau of web-kreation.com.
He has a version written for MooTools ( demo – tutorial ) and a
version writen for JQuery ( demo – tutorial ). I would
love to use this in a xPages application but it is not written in dojo.
I could just add JQuery to my page or I could rewrite it in dojo.

Rewriting the sliding login in dojo
was a lot easier then I imagined. I was able to take the tutorial from
web-kreation.com and look at the logic behind
how the sliding panel was created and then take that logic and apply it
to dojo. Then once I had the scripts working in dojo I was able to break
it down and apply it to an xPages application using tricks like #{id:controlname}
to get the xPages renderd ID names at runtime and by adding the onClick
events directly to the xPage controls in Domino Designer rather then link
them during a dojo.ready event.

Want to see the xPages version in action?
Here’s a demo* of how it stands
right now. While I have yet to implement the registration component the
login part is working perfectly and it does all it’s work via an AJAX call
to the domino server to determine if the person logging in has rights to
the database or not.

So now when your wondering about which
JavaScript library to use stand back a bit and ask if you can write the
function in dojo so that your not pushing extra files down to the client
that are not really needed.

* The Sliding Login panel will be released
on OpenNTF under the Apache Public License V2 when it is finished. The
original version by Jeremie Tisseau was released under the Creative Commons
License V3.0 which allows it to be included in an APL2 code release.