MooTools: Class Methods and Inheritance

Posted by anup.narkhede on July 12, 2010

In my last project, I enjoyed scripting using mootools and started exploring it more deeply. One of my extensive use was to define UI elements’ functionality in classes and then create multiple instances for re-usability.

Mootools makes use of Javascript’s native prototype model for inheritance. To extend a base functionality into sub class, mootools provide ‘Extends’ method. However, if you have class methods in your base model, Extends is insufficient to get them into the sub classes. After some research, I managed to solve this by using Class Mutators and overriding the Mootools ‘Extends’ to take care of class methods inheritance.

First of all, we need to define a ClassMethods mutator. Mutators belong to a class, not to their instances and they are called only when we define a new Class.

Next, we need to redefine Mootools Extends mutator:

Check out the example below:

You can see the above code working here.
http://jsfiddle.net/rZvJE/11/