IWebMvc 1.0

Last week I silently released IWebMvc latest version, labeled 1.0. Finally, I'll add! I've been working for six months to reach this point and I'm quite proud of the result. Even more so if I consider it's been a one man effort all the way from the start.

IWebMvc is a complete framework for dealing with enterprise applications with a JEE/Spring backend and an AJAX frontend. It's also the result of my experience as an architect (what a devalued title nowadays!) and my contribution to the community. I think it's a well built platform and a good (working) example to understand very complex technologies.

Unfortunately, it can't be any more. IWebMvc competes in a very crowded space against other projects like JSF/Richfaces, Grails or Wicket (among others!). All of them are supported by either big corporations, companies or foundations that can provide many resources. I just can't keep up! I have a work, contributions to other OSS projects, IWebMvc and a real life. Just too much. During the last month or so I've being lagging behind so a decision had to be made.

That said, IWebMvc has reached a state that can be of use to many as it provides:

• Full Spring support
  Including Webflow 2.0 and Security 2.0 and working code to configure transactions, AOP, MVC (controllers, locales, AJAX) and all.
• JPA support
  A generic service to persist entities using Hibernate as the provider. Includes solutions for many problems common to any application (full text search, transactions, DAO hierarchies, filters, complex relations, multiple DB/server support, automatic schema creation).
• AJAX
  IWebMvc offers, hands down, the most complete DWR 3.0 integration (for pull requests) out there.
• Project configuration
  Working scripts to kick start a project, download transitive dependencies, compile, test and package everything, deploy to an embedded server or integrate with a CI server.
• Widgets
  Dozens of them based on dojo! And Google AJAX APIs! Many of them original to the project
• And many more useful utilities like cahing, compression, encryption, user administration, audits, CRUD operations, themes, sound & video support, captcha, multi-file upload and more

At this point, my only regrets have been not being able to finish the documentation and not being able to test it as much as I'd have liked in IE.

Finally I would like to thank you all the people that have supported the project like Google, ZeroTurnAround, JavaLobby, Joe Walker (of DWR fame), JAWR and all the developers that have contacted me with offering help, ideas, critics, opinions or just to say thank you!

div lightbox with jQuery

I know there are next to thousands of lightbox versions, including several built over jQuery. But you know, none of them seem to fit your needs ever. This time around I was looking for one that could enhance parts of the page and not specifically images. Thickbox can present inline content (divs or iFrames) but it's not as pretty as others and it has some nasty CSS side effects. In addition it wasn't correctly working in IE6 for some corner cases and the syntax was (somehow) weird.

After a little search I found this plug-in from Leandro Vieira. It resembled the original lightbox plugin but, unfortunately, it was designed to view just images (alone or as a gallery). After realizing I was not going to get what I was looking for without some effort I decided to stick with it and modify it to suit my needs which basically where:

• Visually attractive
• HTML, Flash, other jQuery plugins as content
• Working in FF, IE6+, Safari
• Working inside a frameset
• Simple to use (nothing beyond $("#id").lightbox())

Take into account that this is a hack as I wasn't expecting to release it in any form. A good solution would integrate with the original code and not just replace it! So I'm not going to explain the code in detail (or at all) but, for those interested, here are the modifications required:

settings = jQuery.extend({
   ...
   timeout: -1,
   hideOnClickOutside: false,
   alreadyOpened: false
}, settings);

function _initialize() {
   _start(this, jQueryMatchedObj)
   $(document).keydown(function(objEvent) {
      _keyboard_action(objEvent)
   })
   if (settings.timeout != -1)
      setTimeout("$('#lightbox-secNav-btnClose').click()", settings.timeout)
   return false
}

function _start(objClicked,jQueryMatchedObj) {
   if (!settings.alreadyOpened) {
      settings.alreadyOpened = true
      $('embed, object, select').css({ 'visibility' : 'hidden' });
      _set_interface();
      settings.placeHolder = objClicked
      _set_image_to_view();
      $("#lightbox-image object").css("visibility", "visible")
      $("#lightbox-image embed").css("visibility", "visible")
      $("#lightbox-image object embed").css("visibility", "visible")
   }
}

function _set_image_to_view() {
   $('#lightbox-image,
      #lightbox-nav,
      #lightbox-nav-btnPrev,
      #lightbox-nav-btnNext,
      #lightbox-container-image-data-box,
      #lightbox-image-details-currentNumber').hide();
   $(settings.placeHolder).appendTo($("#lightbox-image"))
   elem = $("#lightbox-image")
   _resize_container_image_box(elem.width(), elem.height())
}

The CSS had to be slightly modified as well. And finally (for the lazy ones) here's a sample. It's a WAR file, if you don't have a servlet container available just uncompress and change the paths. To access it in your localhost http://localhost:[8080]/demo/index.jsp (or flash.jsp, frames.jsp, carousel.jsp).

jQuery effects

One of the lastest tasks (in addition to some OSS work) I've been working on has been a framework to show asynchronous messages to a logged user. These messages usually are loaded in a placeholder that is then presented on the screen using some kind of effect (like fading or sliding). They range from very intrusive to mildly annoying (heck..I'm being payed!). Examples include the simplest pre-positioned banner, the modal lightbox, the interstitial or the inline popup among others.

As many know, I'm a big fan of the dojo toolkit and I promote it as much as I can. I have to admit that one of the things I like most is the widget library (named dijit). Unfortunately, this time around I didn't need one and dojo's effects (dojo.fx) are less than stellar. Add some troubles related to the number of files to deploy (I'm just talking about the dojo core) and I was quickly looking for an alternative.

The first one I inspected was jQuery as it's packaged in a single (tiny) file, has gathered a supportive community and it's always been tagged as really simple to use. By haphazard, the UI team ahd just released a new version so I started there. Let's start by saying that jQuery UI is not a fully featured component library but, good for me, it does pack a number of effects (ala scriptaculous). There's a demo page available that I recommend visiting. And can be extended with plugins easily (I used for example thickbox and liScroll). I didn't bothered to look beyond :-)

So, here's my stance on the library:

• It works. And that's a lot to say when testing with IE6, FF3RC & Safari. In fact, it works from the start and without ugly hacks (and, my God, I'm used to those!)
• I came thinking it was easy to use and I wasn't disappointed. As long as you are proficient with JS/CSS (functions, callbacks, selectors) it's very intuitive. For example, I found rather easier to make a container movable using jQuery's $("id").draggable() than dojo's new dojo.dnd.Moveable("id") (although both are actually quite straightforward)
• Chaining is a bless though it's used without measure in the framework! Please, be sure to understand fluent interfaces beforehand.
• The API is clear yet very powerful. The UI effects are awesome. The people in my project were amazed when I demoed the prototype. Nobody could believe a single line of code could generate that results.
• Of course, all this goodies are of no use if you need widgets though..The UI team has a daunting task there.

All in all, a completely different approach to JS than dojo where there's a function/package/module for (nearly) everything. jQuery is concise but with its simplicity it also brings efficiency and saves time and troubles. Even more so if the developer is not that well versed in the intricacies of javascript (and I reckon there are many).

In short, I expect to use it again soon, without doubts.