From: Raymond Perez Date: Mon, 18 Apr 2016 11:20:34 +0000 (-0600) Subject: Keep collapsed tab focused to allow for opening and closing with keyboard. X-Git-Tag: v6.3-rc1~72^2 X-Git-Url: http://git.ipfire.org/gitweb/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F8516%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Keep collapsed tab focused to allow for opening and closing with keyboard. Reorganize handling of events. --- diff --git a/js/foundation.tabs.js b/js/foundation.tabs.js index a0ab79ef9..e9c64f940 100644 --- a/js/foundation.tabs.js +++ b/js/foundation.tabs.js @@ -111,12 +111,6 @@ class Tabs { .on('click.zf.tabs', `.${this.options.linkClass}`, function(e){ e.preventDefault(); e.stopPropagation(); - if ($(this).hasClass('is-active')) { - if(_this.options.activeCollapse) { - _this._handleCollapse($(this)); - } - return; - } _this._handleTabChange($(this)); }); } @@ -178,6 +172,23 @@ class Tabs { * @function */ _handleTabChange($target) { + + /** + * Check for active class on target. Collapse if exists. + */ + if ($target.hasClass('is-active')) { + if(this.options.activeCollapse) { + this._collapseTab($target); + + /** + * Fires when the zplugin has successfully collapsed tabs. + * @event Tabs#collapse + */ + this.$element.trigger('collapse.zf.tabs', [$target]); + } + return; + } + var $oldTab = this.$element. find(`.${this.options.linkClass}.is-active`); @@ -195,22 +206,6 @@ class Tabs { this.$element.trigger('change.zf.tabs', [$target]); } - /** - * Collapses `$targetContent` defined by `$target`. - * @param {jQuery} $target - Tab to collapse. - * @fires Tabs#collapse - * @function - */ - _handleCollapse($target) { - this._collapseTab($target); - - /** - * Fires when the plugin has successfully collapsed tab. - * @event Tabs#collapse - */ - this.$element.trigger('collapse.zf.tabs', [$target]); - } - /** * Opens the tab `$targetContent` defined by `$target`. * @param {jQuery} $target - Tab to Open. @@ -239,8 +234,7 @@ class Tabs { var $target_anchor = $target .removeClass('is-active') .find('[role="tab"]') - .attr({ 'aria-selected': 'false' }) - .blur(); + .attr({ 'aria-selected': 'false' }); $(`#${$target_anchor.attr('aria-controls')}`) .removeClass('is-active')