Ever needed to clone an element and take your element storage with it? I have and it’s not easy. There’s Element.cloneEvents(), which takes the storage.events callbacks but any other storage you may have used remains unavailable behind the closure that MooTools uses for the storage object.

This bit of code tracks of any data you store (via the lstore method only) in the element’s native storage and then provides a new Element prototype Element.cloneStorage(srcElement).

(function() {
    var eliminateOrig = Element.prototype.eliminate;
    var localStorage = {};
    
    var get = function(uid){
        return (localStorage[uid] || (localStorage[uid] = [])); // converted to an array to store keys stored
    };

    Element.implement({
        lstore: function(property, value) {
            // use this instead of Element.store
            var storage = get(this.uid);
            // store the key so we can clone it after
            if (!storage[property])
                storage.push(property);
            return this.store.apply(this, arguments);
        },
        eliminate: function(property) {
            var storage = get(this.uid);
            storage.erase(property);
            return eliminateOrig.apply(this, arguments);
        },
        cloneStorage: function(from) {
            // new prototype to clone
            var other = get(from.uid);
            other.each(function(el) {
                this.lstore(el, from.retrieve(el));
            }, this);
            return this;
        }
    });
})();

Here is an example usage test:

document.id("bar").lstore("hello", "there");
document.id("foo").lstore("foo", "bar");
document.id("foo").cloneStorage(document.id("bar"));

// if clone works this should now say 'there':
console.log(document.id("foo").retrieve("hello"));

document.id("foo").store("ugly", "face");
console.log(document.id("foo").retrieve("ugly"));

// testing eliminate.
document.id("bar").lstore("eliminateTest", new Image());
document.id("bar").eliminate("eliminateTest");
document.id("foo").cloneStorage(document.id("bar"));
//should now be null
console.log(document.id("foo").retrieve("eliminateTest"));

To view this on jsfiddle: http://jsfiddle.net/dimitar/225HJ/

And the gist: https://gist.github.com/833584

Thanks to Tim Weink (Timmeh aka FunFactor) for the inspiration and also for pointing out that copying ALL storage is not a good idea due to class instances being stuffed there for things like Fx.Tween / Morph / Request etc, hence making me refactor it to only clone the storage that was passed through the lstore method.