jQuery and MonoRail

January 30th, 2008

The coolest thing about jQuery is that they have focused on providing a tiny and yet completely extensible core, and the most coolest additions come from the community.

You can find from simple plugins like tab support or a date picker to very elaborated stuff like flot and the chart plugin.

During the last MR refactored I’ve changed and broken the dependency MR used to have on prototype lib. It still the default one, for compatibility purposes, but it’s easy to add others. Now, what that affects?

And how to do it? On your global:

public void MonoRail_Configure(IMonoRailConfiguration config)
{
	config.JSGeneratorConfiguration.AddLibrary("jquery-1.2.1", typeof(JQueryGenerator))
		.AddExtension(typeof(CommonJSExtension))
		.AddExtension(typeof(InterfaceLibEffects))
		.BrowserValidatorIs(typeof(VinterValidatorProvider))
		.SetAsDefault();
}

This is a snippet from donjon source base, so don’t expect to find JQueryGenerator, InterfaceLibEffects or VinterValidatorProvider anywhere. This is just to show you how to do it.

I digress. That line of code is telling MonoRail that JQueryGenerator is the main JS generator from now on. It also should include CommonJSExtension and InterfaceLibEffects as extensions (more about that in a few). Then it sets the browser validator that is going to be used by FormHelper.

We could have also included extensions for element level generators. Something like:

public void MonoRail_Configure(IMonoRailConfiguration config)
{
	config.JSGeneratorConfiguration.AddLibrary("jquery-1.2.1", typeof(JQueryGenerator))
		.AddExtension(typeof(CommonJSExtension))
		.AddExtension(typeof(InterfaceLibEffects))
		.ElementGenerator
			.AddExtension(typeof(SomeElementLevelExtension))
			.Done
		.BrowserValidatorIs(typeof(VinterValidatorProvider))
		.SetAsDefault();
}

A js generator is an implementation of IJSGenerator (AbstractJSGenerator is there for your convenience). It exposes operations that are translated to javascript. Check the prototype generator and CommonJSExtension to know how they look like.

As our two major view engines mimics a dynamic language, we are able to compose (mixin style) a generator with its extensions. So, with NVelocity you can get:

$page.ReplaceHtml('mydivid', 'something') // ReplaceHtml is on the main generator 
$page.Call('updatecharts') // Call is on the commonjsextension

Element level extensions are available when you use the element syntax. In NVelocity it’s el(), and in brail it’s a property access:

page.MyDivId.ReplaceHtml("something") 

This gives you the freedom to create extensions that encapsulate some elaborated js snippet that might depend on some specific js addition. Perfect fit for jQuery and its plugins…

4 Responses to “jQuery and MonoRail”

Chris Carter Says:

http://scripteka.com/ is a good site of prototype contributions. I like how ya broke that dependency though.

I still like the concept that mootools uses for this: http://mootools.net/download/trunk it’s their download site and the resulting download is comprised only of what’s needed for whatever you picked.

I’ve always wanted something built into a framework that while parsing a page would be able to detect exactly the javascript needed to be rendered to the client in order for a page to work; kind of a bare minimum approach, and of course it’s cached per page. Hmmm…now that i’m thinkin about it i just got a good idea.

Peter Mounce Says:

****ing great! Thank you! One thing though; are you aware that jQuery interface has been superceded/alternative’d in favour of the jQuery UI set of extensions? http://ui.jquery.com and http://jquery.com/blog/2007/09/17/jquery-ui-interactions-and-widgets/ for details. Release #2 should be with us soon now that one of the main contributors has been hired to work on it full-time.

Kamil Says:

I think it still is one hardcoded depedency :(
Method AjaxHelper.LinkToRemote() use RemoteFunction() and this function generate prototype-ajax function. How can i change it? I have to make own helper?

hammett Says:

yeah, unfortunately those are prototype specific…

Leave a Reply