Roo.SplitButton = function(renderTo, config){
Roo.SplitButton.superclass.constructor.call(this, renderTo, config);
this.addEvents({"arrowclick":true});
};
Roo.extend(Roo.SplitButton, Roo.Button, {
render : function(renderTo){
var tpl = new Roo.Template(
'<table cellspacing="0" class="x-btn-menu-wrap x-btn"><tr><td>',
'<table cellspacing="0" class="x-btn-wrap x-btn-menu-text-wrap"><tbody>',
'<tr><td class="x-btn-left"><i> </i></td><td class="x-btn-center"><button class="x-btn-text" type="{1}">{0}</button></td></tr>',
"</tbody></table></td><td>",
'<table cellspacing="0" class="x-btn-wrap x-btn-menu-arrow-wrap"><tbody>',
'<tr><td class="x-btn-center"><button class="x-btn-menu-arrow-el" type="button"> </button></td><td class="x-btn-right"><i> </i></td></tr>',
"</tbody></table></td></tr></table>"
);
var btn = tpl.append(renderTo, [this.text, this.type], true);
var btnEl = btn.child("button");
if(this.cls){
btn.addClass(this.cls);
}
if(this.icon){
btnEl.setStyle('background-image', 'url(' +this.icon +')');
}
if(this.iconCls){
btnEl.addClass(this.iconCls);
if(!this.cls){
btn.addClass(this.text ? 'x-btn-text-icon' : 'x-btn-icon');
}
}
this.el = btn;
if(this.handleMouseEvents){
btn.on("mouseover", this.onMouseOver, this);
btn.on("mouseout", this.onMouseOut, this);
btn.on("mousedown", this.onMouseDown, this);
btn.on("mouseup", this.onMouseUp, this);
}
btn.on(this.clickEvent, this.onClick, this);
if(this.tooltip){
if(typeof this.tooltip == 'object'){
Roo.QuickTips.tips(Roo.apply({
target: btnEl.id
}, this.tooltip));
} else {
btnEl.dom[this.tooltipType] = this.tooltip;
}
}
if(this.arrowTooltip){
btn.child("button:nth(2)").dom[this.tooltipType] = this.arrowTooltip;
}
if(this.hidden){
this.hide();
}
if(this.disabled){
this.disable();
}
if(this.pressed){
this.el.addClass("x-btn-pressed");
}
if(Roo.isIE && !Roo.isIE7){
this.autoWidth.defer(1, this);
}else{
this.autoWidth();
}
if(this.menu){
this.menu.on("show", this.onMenuShow, this);
this.menu.on("hide", this.onMenuHide, this);
}
this.fireEvent('render', this);
},
autoWidth : function(){
if(this.el){
var tbl = this.el.child("table:first");
var tbl2 = this.el.child("table:last");
this.el.setWidth("auto");
tbl.setWidth("auto");
if(Roo.isIE7 && Roo.isStrict){
var ib = this.el.child('button:first');
if(ib && ib.getWidth() > 20){
ib.clip();
ib.setWidth(Roo.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));
}
}
if(this.minWidth){
if(this.hidden){
this.el.beginMeasure();
}
if((tbl.getWidth()+tbl2.getWidth()) < this.minWidth){
tbl.setWidth(this.minWidth-tbl2.getWidth());
}
if(this.hidden){
this.el.endMeasure();
}
}
this.el.setWidth(tbl.getWidth()+tbl2.getWidth());
}
},
setHandler : function(handler, scope){
this.handler = handler;
this.scope = scope;
},
setArrowHandler : function(handler, scope){
this.arrowHandler = handler;
this.scope = scope;
},
focus : function(){
if(this.el){
this.el.child("button:first").focus();
}
},
onClick : function(e){
e.preventDefault();
if(!this.disabled){
if(e.getTarget(".x-btn-menu-arrow-wrap")){
if(this.menu && !this.menu.isVisible()){
this.menu.show(this.el, this.menuAlign);
}
this.fireEvent("arrowclick", this, e);
if(this.arrowHandler){
this.arrowHandler.call(this.scope || this, this, e);
}
}else{
this.fireEvent("click", this, e);
if(this.handler){
this.handler.call(this.scope || this, this, e);
}
}
}
},
onMouseDown : function(e){
if(!this.disabled){
Roo.fly(e.getTarget("table")).addClass("x-btn-click");
}
},
onMouseUp : function(e){
Roo.fly(e.getTarget("table")).removeClass("x-btn-click");
}
});
Roo.MenuButton = Roo.SplitButton;