Ext 组件继承

/**
* This class is used for all image background buttons.
*
* @class My.button.ImageButton
* @extends Ext.Button
*/

Ext.namespace(’My.button’);

My.button.ImageButton = function(cfg) {
    My.button.ImageButton.superclass.constructor.call(this, cfg);
};

Ext.extend(My.button.ImageButton, Ext.Button, {
    imageClass: ’image-btn’,
    tpl: new Ext.Template(’<div><a href="" class="{imageClass}"><span>{imgText:htmlEncode}</span></a></div>’),

    onRender: function(ct, position) {
        this.disabledImgPath = this.disabledImgPath || this.imgPath;
      
        var btn, targs = {
            imgText: this.text || "",
            imageClass: this.imageClass
        };

        btn = this.tpl.append(ct, targs, true);
        btn.on("click", this.onClick, this);
        this.el = btn;
      
        if (this.hidden) {
            this.hide();
        }
    },
  
    disable: function(newImgPath) {
        var replaceImgPath = newImgPath || this.disabledImgPath;
        if (replaceImgPath)
            this.el.dom.firstChild.src = replaceImgPath;
        this.disabled = true;
    },
  
    enable: function(newImgPath) {
        var replaceImgPath = newImgPath || this.imgPath;
        if (replaceImgPath)
            this.el.dom.firstChild.src = replaceImgPath;
        this.disabled = false;
    },
  
    reload: function(newImageClass) {
        this.imageClass = newImageClass;
      
        var targs = {
            imgText: this.text || "",
            imageClass: this.imageClass
        };
      
        this.tpl.overwrite(this.el, targs);
    }
});

Ext.reg(’imagebutton’, My.button.ImageButton);