MooTools 1.2 Beta 2 Released, Adds New Element Storage

Javascript Add comments

The MooTools team has been quietly hacking away at their next major release of the MooTools library. A couple of days ago, project leader Valerio announced Beta 2 of MooTools v1.2 for public consumption:

Its been almost 2 months since the first 1.2 beta. Bugs were fixed, features were improved, and here it comes: the second beta. The first big feature we've been working on for 1.2 is Documentation.

1.2 Documentation is in fact almost 5 times more detailed than it was in version 1. Every class option has now its description, every method has a complete list of arguments along with description, type, and now every functionality comes with a code example — sometimes more than one. If you want to see it for yourself, here is the temporary link for the 1.2 beta documentation.

Along with enhanced documentation, this release also introduces the new Element Accessors feature which makes working with elements more concise. Valerio offered a nice example which basically negates the need for chaining:

PLAIN TEXT
LANGUAGE:
    $(element).set({
    href: 'http://mad4milk.net',
    text: 'mad4milk website',
    morph: {duration: 200, transition: 'quad:out'},
    events: {
    click: function(){
    document.location.href = this.href;
    return false;
    }
    }
    });

Tom Occhino followed up with another blog posting about the new Element Storage class which is meant to provide a better method of storing data for DOM elements. The concept came about mainly due to issues with how IE handles the storage of additional attributes within Elements especially with respect to memory leaks.

Element.Storage is brand new in MooTools 1.2. It is basically an external Hash that stores all the custom properties and events for every element you interact with. Let's take another look at our previous example, this time using the new Element.Storage API:

LANGUAGE:
    var element = $('myElement');
    element.store('effectInstance', new Fx.Tween(element, 'color'));
    element.store('customProperty', 'someProperty');

     

    element.retrieve('effectInstance'); //the Fx.Tween instance
    element.retrieve('customProperty'); //'someProperty'

Note that events and actions are no longer attached directly to the Elements. Everything is stored in the external Hash, and managed by MooTools, so as a developer, you have nothing to worry about. Finally, an elegant and coherent API for attaching custom properties, functions, and objects to Elements.

Tom's blog posting goes into greater detail about the implementation and the applicable scenarios.

[via Ajaxian]

Leave a Reply

Entries RSS Comments RSS Login