Question

I’m thinking of the following functionality:

$('.aclass').MyPluginInit()
$('.aclass').SomeMethodOfMine()

but how do we get from the first to the second line? In the ideal world, I’d be able to trap the exception generated in line 2 (when I attempt to invoke a method that doesn’t exist), loop through the set of objects that $('.aclass') represents and for each, look at a property (say, $this) that contains said method and was placed there by the call to .MyPluginInit(). I would then invoke the method.

the problem is I can’t trap the exception and find my way back to the object on which it was raised. the handler for window.onerror will tell me the url and line number that produced the exception but I can’t tie that to an object.

any thoughts on how else I could accomplish my raising of the dead (or never-born in this case)?

• ekkis

p.s. I did read Autovivification and Javascript, but what I’m asking is a bit different.

Answer 1

this is what I came up with: put the following function in some library you include before including plugins that use it:

function PluginMaker() {
    var plugin = url2fn($('script:last').attr('src'));
    $.fn[plugin] = function (opts) {
        opts = $.extend(true, {}, $[plugin], opts);
        for (fn in opts.fx) this[fn] = fxmk(fn);    // auto-vivification of methods
        this.each(function () { if (!this['$' + plugin]) this['$' + plugin] = opts; });
        opts.init(opts);  // plugin initialisation
        this.init(opts);  // per-object initialisation
        return this;
    };
    function fxmk(nm) {
        return function () {
            var args = arguments;
            this.each(function () {
                this['$' + plugin].fx[nm].apply(this, args);
            });
            return this;
        };
    }
    return plugin;
}

then define your plugins like this:

// -- myplugin.js ---------------------------------------------------------------

(function ($) {
    $[PluginMaker()] = {
        // whatever state data you want to keep for your plugin
        fx: {
            MyMethod1: function () { /* within these methods */ },
            MyMethod2: function (msg) { /* this refers to the HTML element */ },
            // whatever other methods you want to define
            init: function (opts) {
                // used for per-element initialisation
            }
        },
        init: function(opts) {
            // used for plugin initialisation (one time)
        }
    };
});    

then, having included the plugin you can do:

$('.class').MyPlugin({ /* whatever options */ });
$('.class').MyMethod1();

or even:

$('#someId').MyMethod2();