Was just looking over the features that MediaboxAdvanced has to offer and it’s quite compelling. It’s basically a Lightbox clone but will show you just about anything you can imagine.
Read the rest of this entry »
Archive for January, 2009
MediaboxAdvanced – the MooTools Lightbox for damn near everything
January 30th, 2009 by Aaron N.A MooTools Code Riddle For You
January 29th, 2009 by Aaron N.IMing w/ Valerio today and he shares this method with me, and I swear it’s a damned riddle. If I were in a maze with a minotaur and had to tell you what this code does or die, I might very well die. I did manage to figure it out, but it took me a few moments during which I think I might have had a dumb look on my face and even possibly might have drooled. There’s a reason why Valerio designs frameworks and I do not.
A gold star to the first person who can guess what this function is designed for (note, it’s using some new methods coming in MooTools 1.3, so you’ll have to guess what those do by their names):
Object.duck = function(object){
return extend(Object.map(Object, function(value, key){
return function(){
var o = value.apply(Object, [object].concat(Array.from(arguments)));
return (typeOf(o) == 'object') ? Object.duck(o) : o;
};
}), {unduck: Function.from(object)});
};
David Walsh’s ContextMenu Plugin
January 28th, 2009 by Aaron N.Over on David Walsh’s blog today he has a new plugin he’s releasing called ContextMenu:
ContextMenu is a highly customizable, compact context menu script written with CSS, XHTML, and the MooTools javascript framework. ContextMenu allows you to offer stylish, functional context menus on your website.
You just create a list group with your menu:
<ul id="contextmenu"> <li><a href="#edit" class="edit">Edit</a></li> <li class="separator"><a href="#cut" class="cut">Cut</a></li> <li><a href="#copy" class="copy">Copy</a></li> <li><a href="#paste" class="paste">Paste</a></li> <li><a href="#delete" class="delete">Delete</a></li> <li class="separator"><a href="#quit" class="quit">Quit</a></li> </ul>
and style it like any other css content. Then create your context menu:
window.addEvent('domready', function() {
//create a context menu
new ContextMenu({
targets: 'a', //menu only available on links
menu: 'contextmenu',
actions: {
copy: function(element,ref) { //copy action changes the element's color to green and disables the menu
element.setStyle('color','#090');
ref.disable();
}
},
offsets: { x:2, y:2 }
});
});
And voila!

The MooTools 1.3 Upgrade Path
January 23rd, 2009 by Aaron N.In the last week or so Valerio and others (myself included) have been working on the changes that are headed for MooTools 1.3. You can dig around in git-hub in various developer branches and see some of this stuff flying around, but frankly, it’s all in rough draft mode and is likely to change. Read the rest of this entry »
SubtleTemplates for MooTools
January 23rd, 2009 by Aaron N.Thomas Aylott has been busy on some nice functionality that helps you drive dynamic content through templates and keep them updated in the DOM whenever their relevant data changes. Check it out in the git-hub repo. Very slick: Read the rest of this entry »
Class.Binds for MooTools is Back
January 23rd, 2009 by Aaron N.A while ago Jan Kassens authored a mutator for MooTools classes that allowed you to auto-bind methods to the instance of the class. This let you do the following:
var MyClass = new Class({
Binds: ['say'],
initialize: function(element, message) {
this.el = $(element);
this.message = message;
},
monitor: function(){
this.el.addEvent('click', this.say); //say is already bound to 'this'
},
stopMonitoring: function(){
this.el.removeEvent('click', this.say); //again, say is already bound to 'this'
},
say: function(){
alert(this.message);
}
});
The benefit here is that the methods you enumerated in the Binds were automagically bound to the instance of the class. (Read a little more on Jan’s post as to the various reason’s you want to do this).
When MooTools 1.2 came out the inner-workings of Class prevented Jan’s work from working. I released a mix-in class because I was under the impression that you couldn’t get this type of mutator (which modifies the instance that a class creates rather than the class constructor itself) to work in 1.2. Well, I figured out how to do it (mostly after looking over the work that’s been done for a private member mutator) and now it’s back. Here’s the entire code:
Class.Mutators.Binds = function(self, binds) {
if (!self.Binds) return self;
delete self.Binds;
var oldInit = self.initialize;
self.initialize = function() {
Array.flatten(binds).each(function(binder) {
var original = this[binder];
this[binder] = function(){
return original.apply(this, arguments);
}.bind(this);
this[binder].parent = original.parent;
}, this);
return oldInit.apply(this,arguments);
};
return self;
};
And it works just as the first example above. This is available in my plugins library, of course.
What’s the Recipe for a “Healthy” Community?
January 21st, 2009 by Aaron N.In all the chatter in the last day about what’s up with MooTools, which is a topic that’s been on my mind for a while (i.e. how to explain that there’s actually a lot going on, if you ask me) I keep coming back to the same refrain that I have seen posted all over the place: that the MooTools ‘community’ leaves something to be desired.
What, exactly, is that? I’m curious. As someone who cares about evangelizing the software to which I contribute so much, I find myself considering what else we could or should be doing. Read the rest of this entry »
Private Variables Mutators for Class
January 21st, 2009 by Aaron N.A while back Nathan White posted a Class Mutator for private variables that let you do this sort of thing:
var Secret = new Class({
Privates : {
secret : 'hidden message',
myFunc : function(){ return this.getSecret(); }
},
getSecret : function(){
return secret;
},
get : function(){
return myFunc();
}
});
var msg = new Secret();
msg.get(); // returns "hidden message"
msg.Privates.secret; // returns undefined
Yesterday Sean McArthur posted a follow up that addresses some concerns he had. Here’s an example of it’s usage:
var Secret = new Class({
Implements: [Options, Events],
Privates: {
secret: 'shhhh'
},
open: null,
initialize: function(word) {
this.secret = word;
this.open = 'not a secret';
},
getSecret: function() {
return this.secret;
},
setSecret: function(newWord) {
this.secret = newWord;
this.notSecret = 'im a new prop in this';
},
getOpen: function() {
return this.open;
}
});
I haven’t really dug into either solution so I can’t say which one I prefer, but it’s nice work regardless.
What’s Up With MooTools
January 21st, 2009 by Aaron N.There’s a post over on Ryan Rampersand’s blog today entitled “State of the MooTools” wherein he responds to a comment left on an earlier post he made (MooTools is not dead) and ponders the state of the library:
I want to know what people think of the State of the Mootools. My feelings shift often. I wrote a new edition of the mooWalkthrough; I love moo that much. Other days, I wonder where it’s heading and where to find things. Where is everyone? While we don’t need a super leader, we do need someone to give us regular mootoolers some direction. More than what the core team has done so far.
What are your feelings on the direction of Mootools? The community, the library and the current feeling that Mootools gives off?
I’d like to talk about MooTools a bit and touch on it’s current state, but this requires a little bit of history, so bear with me. Read the rest of this entry »
For your consideration: $type methods
January 18th, 2009 by Aaron N.I don’t know why, but I find myself annoyed very slightly by having to type this often:
if ($type('foo') == 'string') ...
On a lark, I whipped this up:
$type.types = ['string', 'element', 'textnode', 'whitespace', 'arguments',
'array', 'object', 'string', 'number', 'date', 'boolean',
'function', 'regexp', 'class', 'collection', 'window',
'document'].map(function(type){
$type[type] = function(val) {
return $type(val) == type;
};
return type;
});
This provides the ability to do:
if ($type.string(('foo'))) ...
Which saves me a whopping 3 characters, but feels nicer for some reason. Technically, I should name that method .isString(‘foo’) but whatever.
I don’t think I can bring myself to publish or use this one. I like it, but it just doesn’t seem to be worth it.