UI Tabs: renamed confusing "unselect" option to "deselectable"

This commit is contained in:
Klaus Hartl 2008-10-08 10:09:55 +00:00
parent ea3b0cdfb2
commit 0e9117623e
2 changed files with 48 additions and 52 deletions

View File

@ -37,7 +37,7 @@ module('tabs');
test("defaults", function() { test("defaults", function() {
var expected = { var expected = {
unselect: false, deselectable: false,
event: 'click', event: 'click',
disabled: [], disabled: [],
cookie: null, cookie: null,
@ -50,7 +50,7 @@ module('tabs');
panelTemplate: '<div></div>', panelTemplate: '<div></div>',
navClass: 'ui-tabs-nav', navClass: 'ui-tabs-nav',
selectedClass: 'ui-tabs-selected', selectedClass: 'ui-tabs-selected',
unselectClass: 'ui-tabs-unselect', deselectableClass: 'ui-tabs-deselectable',
disabledClass: 'ui-tabs-disabled', disabledClass: 'ui-tabs-disabled',
panelClass: 'ui-tabs-panel', panelClass: 'ui-tabs-panel',
hideClass: 'ui-tabs-hide', hideClass: 'ui-tabs-hide',
@ -116,7 +116,7 @@ module('tabs: Options');
el.tabs({ selected: null }); el.tabs({ selected: null });
equals( el.data('selected.tabs'), null, 'option set' ); equals( el.data('selected.tabs'), null, 'option set' );
equals( $('li.ui-tabs-selected', el).length, 0, 'all tabs should be unselected' ); equals( $('li.ui-tabs-selected', el).length, 0, 'all tabs should be deselected' );
equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' ); equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' );
// TODO select == null with cookie // TODO select == null with cookie
@ -124,22 +124,22 @@ module('tabs: Options');
}); });
test('unselect: true', function() { test('deselectable: true', function() {
expect(7); expect(7);
var el = $('#tabs1 > ul'); var el = $('#tabs1 > ul');
el.tabs({ unselect: true }); el.tabs({ deselectable: true });
equals( el.data('unselect.tabs'), true, 'option set' ); equals( el.data('deselectable.tabs'), true, 'option set' );
equals( $('li.ui-tabs-unselect', el).length, 1, 'class "ui-tabs-unselect" attached once'); equals( $('li.ui-tabs-deselectable', el).length, 1, 'class "ui-tabs-deselectable" attached once');
equals( $('li', el).index( $('li.ui-tabs-unselect', el) ), 0, 'class "ui-tabs-unselect" attached to first tab'); equals( $('li', el).index( $('li.ui-tabs-deselectable', el) ), 0, 'class "ui-tabs-deselectable" attached to first tab');
el.tabs('select', 1); el.tabs('select', 1);
equals( $('li.ui-tabs-unselect', el).length, 1, 'class "ui-tabs-unselect" attached once'); equals( $('li.ui-tabs-deselectable', el).length, 1, 'class "ui-tabs-deselectable" attached once');
equals( $('li', el).index( $('li.ui-tabs-unselect', el) ), 1, 'class "ui-tabs-unselect" attached to second tab'); equals( $('li', el).index( $('li.ui-tabs-deselectable', el) ), 1, 'class "ui-tabs-deselectable" attached to second tab');
el.tabs('select', 1); el.tabs('select', 1);
equals( $('li.ui-tabs-unselect', el).length, 0, 'class "ui-tabs-unselect" not attached'); equals( $('li.ui-tabs-deselectable', el).length, 0, 'class "ui-tabs-deselectable" not attached');
defer(function() { defer(function() {
equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' ); equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' );
}); });

View File

@ -134,7 +134,7 @@ $.widget("ui.tabs", {
if (o.selected !== null) { if (o.selected !== null) {
this.$panels.eq(o.selected).show().removeClass(o.hideClass); // use show and remove class to show in any case no matter how it has been hidden before this.$panels.eq(o.selected).show().removeClass(o.hideClass); // use show and remove class to show in any case no matter how it has been hidden before
var classes = [o.selectedClass]; var classes = [o.selectedClass];
if (o.unselect) classes.push(o.unselectClass); if (o.deselectable) classes.push(o.deselectableClass);
this.$lis.eq(o.selected).addClass(classes.join(' ')); this.$lis.eq(o.selected).addClass(classes.join(' '));
// seems to be expected behavior that the show callback is fired // seems to be expected behavior that the show callback is fired
@ -217,7 +217,7 @@ $.widget("ui.tabs", {
$.ajaxHistory.update(clicked.hash); $.ajaxHistory.update(clicked.hash);
}*/ }*/
var classes = [o.selectedClass]; var classes = [o.selectedClass];
if (o.unselect) classes.push(o.unselectClass); if (o.deselectable) classes.push(o.deselectableClass);
$li.addClass(classes.join(' ')).siblings().removeClass(classes.join(' ')); $li.addClass(classes.join(' ')).siblings().removeClass(classes.join(' '));
hideTab(clicked, $hide, $show); hideTab(clicked, $hide, $show);
} }
@ -230,11 +230,11 @@ $.widget("ui.tabs", {
$hide = self.$panels.filter(':visible'), $hide = self.$panels.filter(':visible'),
$show = $(self._sanitizeSelector(this.hash)); $show = $(self._sanitizeSelector(this.hash));
// If tab is already selected and not unselectable or tab disabled or // If tab is already selected and not deselectable or tab disabled or
// or is already loading or click callback returns false stop here. // or is already loading or click callback returns false stop here.
// Check if click handler returns false last so that it is not executed // Check if click handler returns false last so that it is not executed
// for a disabled or loading tab! // for a disabled or loading tab!
if (($li.hasClass(o.selectedClass) && !o.unselect) if (($li.hasClass(o.selectedClass) && !o.deselectable)
|| $li.hasClass(o.disabledClass) || $li.hasClass(o.disabledClass)
|| $(this).hasClass(o.loadingClass) || $(this).hasClass(o.loadingClass)
|| self._trigger('select', null, self.ui(this, $show[0])) === false || self._trigger('select', null, self.ui(this, $show[0])) === false
@ -246,10 +246,10 @@ $.widget("ui.tabs", {
o.selected = self.$tabs.index(this); o.selected = self.$tabs.index(this);
// if tab may be closed // if tab may be closed
if (o.unselect) { if (o.deselectable) {
if ($li.hasClass(o.selectedClass)) { if ($li.hasClass(o.selectedClass)) {
self.options.selected = null; self.options.selected = null;
$li.removeClass([o.selectedClass, o.unselectClass].join(' ')); $li.removeClass([o.selectedClass, o.deselectableClass].join(' '));
self.$panels.stop(); self.$panels.stop();
hideTab(this, $hide); hideTab(this, $hide);
this.blur(); this.blur();
@ -258,7 +258,7 @@ $.widget("ui.tabs", {
self.$panels.stop(); self.$panels.stop();
var a = this; var a = this;
self.load(self.$tabs.index(this), function() { self.load(self.$tabs.index(this), function() {
$li.addClass([o.selectedClass, o.unselectClass].join(' ')); $li.addClass([o.selectedClass, o.deselectableClass].join(' '));
showTab(a, $show); showTab(a, $show);
}); });
this.blur(); this.blur();
@ -504,7 +504,7 @@ $.widget("ui.tabs", {
if ($.data(this, 'destroy.tabs')) if ($.data(this, 'destroy.tabs'))
$(this).remove(); $(this).remove();
else else
$(this).removeClass([o.selectedClass, o.unselectClass, $(this).removeClass([o.selectedClass, o.deselectableClass,
o.disabledClass, o.panelClass, o.hideClass].join(' ')); o.disabledClass, o.panelClass, o.hideClass].join(' '));
}); });
if (o.cookie) if (o.cookie)
@ -512,39 +512,35 @@ $.widget("ui.tabs", {
} }
}); });
$.ui.tabs.version = "@VERSION"; $.extend($.ui.tabs, {
$.ui.tabs.defaults = { version: '@VERSION',
// basic setup getter: 'length',
unselect: false, defaults: {
event: 'click', // basic setup
disabled: [], deselectable: false,
cookie: null, // e.g. { expires: 7, path: '/', domain: 'jquery.com', secure: true } event: 'click',
// TODO history: false, disabled: [],
cookie: null, // e.g. { expires: 7, path: '/', domain: 'jquery.com', secure: true }
// Ajax // Ajax
spinner: 'Loading&#8230;', spinner: 'Loading&#8230;',
cache: false, cache: false,
idPrefix: 'ui-tabs-', idPrefix: 'ui-tabs-',
ajaxOptions: null, ajaxOptions: null,
// animations
// animations fx: null, // e.g. { height: 'toggle', opacity: 'toggle', duration: 200 }
fx: null, // e.g. { height: 'toggle', opacity: 'toggle', duration: 200 } // templates
tabTemplate: '<li><a href="#{href}"><span>#{label}</span></a></li>',
// templates panelTemplate: '<div></div>',
tabTemplate: '<li><a href="#{href}"><span>#{label}</span></a></li>', // CSS class names
panelTemplate: '<div></div>', navClass: 'ui-tabs-nav',
selectedClass: 'ui-tabs-selected',
// CSS classes deselectableClass: 'ui-tabs-deselectable',
navClass: 'ui-tabs-nav', disabledClass: 'ui-tabs-disabled',
selectedClass: 'ui-tabs-selected', panelClass: 'ui-tabs-panel',
unselectClass: 'ui-tabs-unselect', hideClass: 'ui-tabs-hide',
disabledClass: 'ui-tabs-disabled', loadingClass: 'ui-tabs-loading'
panelClass: 'ui-tabs-panel', }
hideClass: 'ui-tabs-hide', });
loadingClass: 'ui-tabs-loading'
};
$.ui.tabs.getter = "length";
/* /*
* Tabs Extensions * Tabs Extensions