On Mar 25, 12:02 am, Glen <a...@usa.com> wrote:
> I would like to use Prototype's class inheritance to derive a class
> from Element as below:

> The current structure of Element and Class does not support such.

> I was wondering if anyone had anything more elegant.

I have the same issue - I want to create my own classes that "inherit"
from standard DOM elements, so I can do something like:
var Button = Class.create(Element, {
  initialize: function($super, content) {
    $super('button');
    this.update(content);
  }
});
document.body.appendChild(new Button("submit"));

But as you noted, Element in prototype is not a prototype Class that
can be extended using Class.create. I decided not to muck about with
that and instead write something else. So I create
Class.createElement() that works like as you would expect, with the
very serious caveat that you can't override most native methods (not
sure why - I can override some, but not others).

The implementation looks like this (and is mostly copied from
Class.create):

Class.createElement = function(tagname, impl) {
        var IS_DONTENUM_BUGGY = (function() {
                for ( var p in { toString : 1 }) {
                        // check actual property name, so that it works with 
augmented
                        // Object.prototype
                        if (p === 'toString')
                                return false;
                }
                return true;
        })();

        return function() {
                var elm = new Element(tagname);
                properties = Object.keys(impl);

                // IE6 doesn't enumerate `toString` and `valueOf` (among other 
built-
in
                // `Object.prototype`) properties,
                // Force copy if they're not Object.prototype ones.
                // Do not copy other Object.prototype.* for performance reasons
                if (IS_DONTENUM_BUGGY) {
                        if (impl.toString != Object.prototype.toString)
                                properties.push("toString");
                        if (impl.valueOf != Object.prototype.valueOf)
                                properties.push("valueOf");
                }

                for ( var i = 0, length = properties.length; i < length; i++) {
                        var property = properties[i], value = impl[property];
                        if (Object.isFunction(value) && 
value.argumentNames()[0] ==
"$super") {
                                var method = value;
                                value = (function(m) {
                                        return function() {
                                                return elm[m].apply(this, 
arguments);
                                        };
                                })(property).wrap(method);

                                value.valueOf = method.valueOf.bind(method);
                                value.toString = method.toString.bind(method);
                        }
                        impl[property] = value;
                }
                Object.extend(elm,impl);
                elm.initialize.apply(elm,arguments);
                return elm;
        };
};

-- 
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.

Reply via email to