The best solution for our coding needs is to adopt a JS framework as backbone for our scripts. One of the very first framework I’ve worked with is Mootools, since it’s very developer friendly and fulfils lots of JavaScript’s “holes”.

In the next few days i’m going to receive a copy of:  MooTools 1.2 Beginner’s Guide, which I’m going to review for the sake of some of my followers and friends which are in need of a good starting point to learn how to improve their interfaces.

If you are interested you can check the details of the guide at the publisher website.

Stay tuned!

Changes in this new version are:

1. Updated MooTools Core to 1.2.2 1.2.3 and MooTools More to 1.2.2.2 1.2.3.1
   
2. Added .getValue() to the compatibility file
3. Added .getSelected() to the compatibility file to fix some issues under IE
4. Added Json support to the compatibility file
5. Added window.onDomReady shortcut for DOM ready event
6. Changed MY_Behavior::mootoolsFix(); to handle new MooTools files 
7. Changed MY_Behavior::mootoolsFix(); to correctly render old tooltips format title::text for items with hasTip class (anyway, remember that classes to style the tooltip have changed!)
8. Added a validate.js replacement to fix an issue with changed namespaces. ( this replacement is no more needed)
   

The source code is released in the form of patch: unzip it and upload files in your Joomla root, eventually overwriting files. MooTools library is uncompressed to allow for a quicker debug. Anyway you may minify it with your tool of choice.

Here is the code: Mootools 1.11 to 1.2.2 (71.68 kB)

Update (again): Sometimes i can’t get if MooTools team is too vital or library milestones are not well defined… anyway here is an update to use latest MooTools 1.2.3. No major changes have been made to the fix library, anyway keep reporting compatibility issues. Here is the zipped  file: Mootools 1.11 to 1.2.3 for Joomla 1.5 (72.06 kB)

Update (09/20/09): New version available. Corrected some bugs in the compatibility file and added a loop check to replace MooTools 1.11 when called from a component as custom script. Now the validation core script doesn’t need to be replaced. Get source here (carries the original validate.js as in Joomla 1.5.14:  MooTools 1.11 to 1.2.x (72.88 kB)

Despite all these advanced features Joomla 1.5 is still stuck at JS framework Mootools 1.11. The latest version of this framework, 1.2.x, introduced many new features and a complete re-engineered code. Due to these changes, Joomla developers plan to upgrade Mootools in the 1.6 release, to be able to spread code changes to all plugins, modules and components. Until that release we’ll be stuck at outdated, unsupported and often undocumented code.

This is an attempt to add Mootools 1.2 support to current Joomla 1.5.9 release. Let’s start:

Update: A new version of files presented in this post is available here!

Requirements:

1. Nearly full compatibility with Mootools 1.11 to avoid errors
2. Upgrade of Mootools plugins where possibile
3. None or minimal Joomla core hacks
4. Implementation of Mootools in legacy (1.0.x) components

1. Smooth Mootools upgrade.

First of all let’s download the latest version of Mootools Core and Mootools More (right now 1.2.1):Mootools 1.2.1 Full (28.51 kB)

Unzip the archive and place the two files in media/system/js/

Then download this compatibility file, which will make old 1.11 scripts work rather smoothly with the new framework, and place it in the same folder as above (update 05/22/09 added getValue, Json and window.onDomReady compatibility, thanx Toopixel):

2. Plugins Upgrade.

One of the more usefull plugin shipped with Mootools is Squeezebox, used for the modal windows, here is the 1.2 Compatible version, ready to be placed in the above mentioned folder media/system/js/:

3-4. Let’s try some PHP

Since i want to touch Joomla Core files as less as possible, im going to use some little tricks to be able to use Mootools 1.2 just in the Frontend and on-demand from the template’s main index.php file.

Joomla is based on several PHP libraries placed in the libraries/ folder; one of them is the Joomla API, but we can find ezSQL (a database lib), PHPMailer (a mailing system) and phpgacl (an access list system). To take advantage of Joomla’s built-in libraries loading system and, at the same time, prevent overwrites by future releases, i created a folder called my_libs in libraries/ containing a class file: my_behavior class for Joomla 1.5.9 (1.13 kB)

Basically the class provides a static function which recalls the head part of Joomla document object, looks for Mootools and replaces it with the 1.2 version we uploaded before.

If Mootools is not found, then it’s simply loaded, extending it’s presence in the head of legacy 1.0.x components.

You can call this newly added class in your Joomla theme index.php by placing these lines of code before the head template tag:

<?php
JLoader::import( 'my_libs.behavior' );
MY_Behavior::mootoolsFix();
?>
<jdoc:include type="head" />

If you need to switch back to v1.11 you can pass false as first argument to the function like this:

MY_Behavior::mootoolsFix(false);

Note this!

This is just a test, it should work on a basic Joomla installation, anyway feel free to report errors and issues to improve the code.

Untill now, I’ve experienced that Virtuemart uses it’s own logic to load libraries, so it’s excluded by default.

Optionally you can exclude specific components by passing an array with their option value as second argument:

MY_Behavior::mootoolsFix(true,array("com_sobi2","com_comprofiler"));

In SOBI2 an error will be issued on search form unless you set the registry option use_own_mootools to 0.