Toolbar Button enable/disable support for grayed buttons

[Choleriker]

I have had the problem that i dont wanted to make several button icons/css style for disabled toolbar buttons, so i have extended the toolbar-button class that simply sets opacity, so different icons not needed. To enable using of opacity simply set 'disabledOpacity' while adding the button to the toolbar.



YAHOO.ext.ToolbarButton.prototype.enable = function() {
this.disabled = false;
if(this.el){
this.el.removeClass('ytb-button-disabled');
if(this.disabledOpacity)
this.el.setOpacity(1);
}
};
YAHOO.ext.ToolbarButton.prototype.disable = function() {
this.disabled = true;
if(this.el){
this.el.addClass('ytb-button-disabled');
if(this.disabledOpacity)
this.el.setOpacity(this.disabledOpacity);
}
};


UPDATE: make the opacity configurable.

[jack.slocum]

You could actually do that in the css without modifying the code.


(add to ytb-button-disabled class)

-moz-opacity: 0.3;
opacity:.3;
filter: alpha(opacity=30);

[Choleriker]

Ahh ok, CSS is anything i will never get :) does it works in all browsers?

[jack.slocum]

Yep. That's the same thing setOpacity does under the hood.