Tabs: Split out event handler, showtab, hidetab, resetStyle to their own methods

This commit is contained in:
David Petersen 2011-03-26 12:04:14 -04:00
parent 6fc98deef0
commit 03ef2fb452

95
ui/jquery.ui.tabs.js vendored
View File

@ -258,61 +258,72 @@ $.widget( "ui.tabs", {
this._hoverable( this.lis );
// set up animations
var hideFx, showFx;
if ( o.fx ) {
if ( $.isArray( o.fx ) ) {
hideFx = o.fx[ 0 ];
showFx = o.fx[ 1 ];
this.hideFx = o.fx[ 0 ];
this.showFx = o.fx[ 1 ];
} else {
hideFx = showFx = o.fx;
this.hideFx = this.showFx = o.fx;
}
}
// attach tab event handler, unbind to avoid duplicates from former tabifying...
this.anchors.bind( o.event + ".tabs", $.proxy( this, "_eventHandler" ));
// disable click in any case
this.anchors.bind( "click.tabs", function( event ){
event.preventDefault();
});
},
// Reset certain styles left over from animation
// and prevent IE's ClearType bug...
function resetStyle( $el, fx ) {
_resetStyle: function ( $el, fx ) {
$el.css( "display", "" );
if ( !$.support.opacity && fx.opacity ) {
$el[ 0 ].style.removeAttribute( "filter" );
}
}
},
_showTab: function( clicked, show, event ) {
var self = this;
// Show a tab...
var showTab = showFx
? function( clicked, $show, event ) {
$( clicked ).closest( "li" ).addClass( "ui-tabs-selected ui-state-active" );
$show.hide().removeClass( "ui-tabs-hide" ) // avoid flicker that way
if ( this.showFx ) {
show.hide().removeClass( "ui-tabs-hide" ) // avoid flicker that way
.animate( showFx, showFx.duration || "normal", function() {
resetStyle( $show, showFx );
self._trigger( "show", event, self._ui( clicked, $show[ 0 ] ) );
self._resetStyle( show, showFx );
self._trigger( "show", event, self._ui( clicked, show[ 0 ] ) );
});
} else {
show.removeClass( "ui-tabs-hide" );
self._trigger( "show", event, self._ui( clicked, show[ 0 ] ) );
}
: function( clicked, $show, event ) {
$( clicked ).closest( "li" ).addClass( "ui-tabs-selected ui-state-active" );
$show.removeClass( "ui-tabs-hide" );
self._trigger( "show", event, self._ui( clicked, $show[ 0 ] ) );
};
},
// Hide a tab, $show is optional...
var hideTab = hideFx
? function( clicked, $hide ) {
_hideTab: function( clicked, $hide ) {
var self = this;
if ( this.hideFx ) {
$hide.animate( hideFx, hideFx.duration || "normal", function() {
self.lis.removeClass( "ui-tabs-selected ui-state-active" );
$hide.addClass( "ui-tabs-hide" );
resetStyle( $hide, hideFx );
self._resetStyle( $hide, hideFx );
self.element.dequeue( "tabs" );
});
}
: function( clicked, $hide, $show ) {
} else {
self.lis.removeClass( "ui-tabs-selected ui-state-active" );
$hide.addClass( "ui-tabs-hide" );
self.element.dequeue( "tabs" );
};
}
},
// attach tab event handler, unbind to avoid duplicates from former tabifying...
this.anchors.bind( o.event + ".tabs", function( event ) {
_eventHandler: function( event ) {
event.preventDefault();
var el = this,
var self = this,
o = this.options,
el = event.currentTarget,
$li = $(el).closest( "li" ),
$hide = self.panels.filter( ":not(.ui-tabs-hide)" ),
$show = self.element.find( self._sanitizeSelector( el.hash ) );
@ -325,12 +336,12 @@ $.widget( "ui.tabs", {
$li.hasClass( "ui-state-disabled" ) ||
$li.hasClass( "ui-state-processing" ) ||
self.panels.filter( ":animated" ).length ||
self._trigger( "select", event, self._ui( this, $show[ 0 ] ) ) === false ) {
this.blur();
self._trigger( "select", event, self._ui( el, $show[ 0 ] ) ) === false ) {
el.blur();
return;
}
o.selected = self.anchors.index( this );
o.selected = self.anchors.index( el );
self.abort();
@ -344,10 +355,10 @@ $.widget( "ui.tabs", {
}
self.element.queue( "tabs", function() {
hideTab( el, $hide );
self._hideTab( el, $hide );
}).dequeue( "tabs" );
this.blur();
el.blur();
return;
} else if ( !$hide.length ) {
if ( o.cookie ) {
@ -355,13 +366,13 @@ $.widget( "ui.tabs", {
}
self.element.queue( "tabs", function() {
showTab( el, $show, event );
self._showTab( el, $show, event );
});
// TODO make passing in node possible, see also http://dev.jqueryui.com/ticket/3171
self.load( self.anchors.index( this ) );
self.load( self.anchors.index( el ) );
this.blur();
el.blur();
return;
}
}
@ -374,14 +385,14 @@ $.widget( "ui.tabs", {
if ( $show.length ) {
if ( $hide.length ) {
self.element.queue( "tabs", function() {
hideTab( el, $hide );
self._hideTab( el, $hide );
});
}
self.element.queue( "tabs", function() {
showTab( el, $show, event );
self._showTab( el, $show, event );
});
self.load( self.anchors.index( this ) );
self.load( self.anchors.index( el ) );
} else {
throw "jQuery UI Tabs: Mismatching fragment identifier.";
}
@ -391,14 +402,8 @@ $.widget( "ui.tabs", {
// in modern browsers; blur() removes focus from address bar in Firefox
// which can become a usability
if ( $.browser.msie ) {
this.blur();
el.blur();
}
});
// disable click in any case
this.anchors.bind( "click.tabs", function( event ){
event.preventDefault();
});
},
_getIndex: function( index ) {