From 24034546d5fc1f4619b2278fae5169f9fbef43b8 Mon Sep 17 00:00:00 2001 From: Marlow Payne Date: Mon, 20 Apr 2015 12:36:01 -0700 Subject: [PATCH 1/6] Disabling Bellows should also prevent open Bellows' items from closing --- dist/bellows.js | 2 +- dist/bellows.min.js | 2 +- src/js/bellows.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/dist/bellows.js b/dist/bellows.js index d266e57..e6f4a3d 100644 --- a/dist/bellows.js +++ b/dist/bellows.js @@ -176,7 +176,7 @@ close: function($item) { $item = this._item($item); - if (!$item.hasClass(cssClasses.OPENED)) { + if (!$item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { return; } diff --git a/dist/bellows.min.js b/dist/bellows.min.js index 7790d7c..f8c40ed 100644 --- a/dist/bellows.min.js +++ b/dist/bellows.min.js @@ -1,2 +1,2 @@ /*! bellows 5.1.1 (https://github.com/mobify/bellows.git) */ -(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.1",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!e.hasClass(n.OPENED)&&!e.hasClass(n.DISABLED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),e.hasClass(n.OPENED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file +(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.1",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!e.hasClass(n.OPENED)&&!e.hasClass(n.DISABLED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),e.hasClass(n.OPENED)&&!e.hasClass(n.DISABLED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file diff --git a/src/js/bellows.js b/src/js/bellows.js index e234c23..77dd3c4 100644 --- a/src/js/bellows.js +++ b/src/js/bellows.js @@ -176,7 +176,7 @@ close: function($item) { $item = this._item($item); - if (!$item.hasClass(cssClasses.OPENED)) { + if (!$item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { return; } From 7ac98db1d503bffe6eb02479194f1d740f21c9fb Mon Sep 17 00:00:00 2001 From: Marlow Payne Date: Mon, 20 Apr 2015 12:40:06 -0700 Subject: [PATCH 2/6] Add a test for trying to close disabled open items --- tests/fixtures/open-disabled-item.html | 4 ++++ tests/unit/plugin.js | 27 ++++++++++++++++++++++---- 2 files changed, 27 insertions(+), 4 deletions(-) create mode 100644 tests/fixtures/open-disabled-item.html diff --git a/tests/fixtures/open-disabled-item.html b/tests/fixtures/open-disabled-item.html new file mode 100644 index 0000000..de0aa67 --- /dev/null +++ b/tests/fixtures/open-disabled-item.html @@ -0,0 +1,4 @@ +
+
Header
+
Content
+
diff --git a/tests/unit/plugin.js b/tests/unit/plugin.js index 98dcf4d..ac832ba 100644 --- a/tests/unit/plugin.js +++ b/tests/unit/plugin.js @@ -3,8 +3,9 @@ define([ 'text!fixtures/bellows.html', 'text!fixtures/items.html', 'text!fixtures/item.html', - 'text!fixtures/disableditem.html' -], function(testSandbox, fixture, items, item, disabledItem) { + 'text!fixtures/disableditem.html', + 'text!fixtures/open-disabled-item.html' +], function(testSandbox, fixture, items, item, disabledItem, openDisabledItem) { var Bellows; var $element; var $; @@ -180,7 +181,7 @@ define([ }, closed: function(e, ui) { closeCount++; - + if (closeCount === 2) { expect($element.find('.bellows__item:not(.bellows--is-open)')).to.have.length(2); done(); @@ -268,6 +269,24 @@ define([ done(); }); }); + + it('does not close item when header clicked', function(done) { + $element.bellows(); + + var $openDisabledItem = $(openDisabledItem); + + $element.bellows('add', $openDisabledItem); + + $openDisabledItem + .find('.bellows__header') + .trigger('click'); + + setTimeout(function() { + expect($openDisabledItem.hasClass('bellows--is-disabled')).to.be.true; + expect($openDisabledItem.hasClass('bellows--is-open')).to.be.true; + done(); + }); + }); }); }); -}); \ No newline at end of file +}); From c201449aec03b16f0781ee6ae68a44d38202baf3 Mon Sep 17 00:00:00 2001 From: Marlow Payne Date: Tue, 21 Apr 2015 10:57:51 -0700 Subject: [PATCH 3/6] Added helper methods for determining an item's open and disabled states --- dist/bellows.js | 16 ++++++++++++++-- dist/bellows.min.js | 2 +- src/js/bellows.js | 16 ++++++++++++++-- 3 files changed, 29 insertions(+), 5 deletions(-) diff --git a/dist/bellows.js b/dist/bellows.js index e6f4a3d..ec175a1 100644 --- a/dist/bellows.js +++ b/dist/bellows.js @@ -129,6 +129,18 @@ .attr('aria-hidden', true); }, + /* + Helper methods for determining Bellows item's status + */ + _isOpen: function($item) { + $item = this._item($item); + return $item.hasClass(cssClasses.OPENED); + }, + _isDisabled: function($item) { + $item = this._item($item); + return $item.hasClass(cssClasses.DISABLED); + }, + toggle: function($item) { $item = this._item($item); @@ -138,7 +150,7 @@ open: function($item) { $item = this._item($item); - if ($item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { + if (this._isOpen($item) || this._isDisabled($item)) { return; } @@ -176,7 +188,7 @@ close: function($item) { $item = this._item($item); - if (!$item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { + if (!this._isOpen($item) || this._isDisabled($item)) { return; } diff --git a/dist/bellows.min.js b/dist/bellows.min.js index f8c40ed..381d06c 100644 --- a/dist/bellows.min.js +++ b/dist/bellows.min.js @@ -1,2 +1,2 @@ /*! bellows 5.1.1 (https://github.com/mobify/bellows.git) */ -(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.1",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!e.hasClass(n.OPENED)&&!e.hasClass(n.DISABLED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),e.hasClass(n.OPENED)&&!e.hasClass(n.DISABLED)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file +(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.1",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},_isOpen:function(e){return e=this._item(e),e.hasClass(n.OPENED)},_isDisabled:function(e){return e=this._item(e),e.hasClass(n.DISABLED)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file diff --git a/src/js/bellows.js b/src/js/bellows.js index 77dd3c4..5429a5e 100644 --- a/src/js/bellows.js +++ b/src/js/bellows.js @@ -129,6 +129,18 @@ .attr('aria-hidden', true); }, + /* + Helper methods for determining Bellows item's status + */ + _isOpen: function($item) { + $item = this._item($item); + return $item.hasClass(cssClasses.OPENED); + }, + _isDisabled: function($item) { + $item = this._item($item); + return $item.hasClass(cssClasses.DISABLED); + }, + toggle: function($item) { $item = this._item($item); @@ -138,7 +150,7 @@ open: function($item) { $item = this._item($item); - if ($item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { + if (this._isOpen($item) || this._isDisabled($item)) { return; } @@ -176,7 +188,7 @@ close: function($item) { $item = this._item($item); - if (!$item.hasClass(cssClasses.OPENED) || $item.hasClass(cssClasses.DISABLED)) { + if (!this._isOpen($item) || this._isDisabled($item)) { return; } From cff793d9f4e4e33aeffd40500d7cbaad8392528c Mon Sep 17 00:00:00 2001 From: Steve Calvert Date: Tue, 21 Apr 2015 11:42:15 -0700 Subject: [PATCH 4/6] Removed the setTimeout in the test. We don't need this because we're never animating when this call fires. Also removed the redundant _item function calls in the _isOpen and _isDisabled functions --- dist/bellows.js | 34 +++++++++++++++------------------- dist/bellows.min.js | 2 +- src/js/bellows.js | 34 +++++++++++++++------------------- tests/unit/plugin.js | 18 ++++++------------ 4 files changed, 37 insertions(+), 51 deletions(-) diff --git a/dist/bellows.js b/dist/bellows.js index ec175a1..3f2fbef 100644 --- a/dist/bellows.js +++ b/dist/bellows.js @@ -67,9 +67,9 @@ /** * Ghetto Event Delegation™ - Zepto doesn't support descendant selectors in event delegation, - so we compare against the closest bellows to ensure we are invoking - the event from a direct child, not a bellows child from a nested bellows. + Zepto doesn't support descendant selectors in event delegation, + so we compare against the closest bellows to ensure we are invoking + the event from a direct child, not a bellows child from a nested bellows. */ this.$bellows .on(events.CLICK, function(e) { @@ -118,6 +118,14 @@ return item; }, + _isOpen: function($item) { + return $item.hasClass(cssClasses.OPENED); + }, + + _isDisabled: function($item) { + return $item.hasClass(cssClasses.DISABLED); + }, + _wrapContent: function($items) { $items .find(selectors.ITEM_CONTENT) @@ -129,18 +137,6 @@ .attr('aria-hidden', true); }, - /* - Helper methods for determining Bellows item's status - */ - _isOpen: function($item) { - $item = this._item($item); - return $item.hasClass(cssClasses.OPENED); - }, - _isDisabled: function($item) { - $item = this._item($item); - return $item.hasClass(cssClasses.DISABLED); - }, - toggle: function($item) { $item = this._item($item); @@ -161,7 +157,7 @@ this.closeAll(); } - this._trigger('open', { item: $item }); + this._trigger('open', {item: $item}); Velocity .animate($contentWrapper, 'slideDown', { @@ -180,7 +176,7 @@ plugin._setHeight(); - plugin._trigger('opened', { item: $item }); + plugin._trigger('opened', {item: $item}); } }); }, @@ -195,7 +191,7 @@ var plugin = this; var $contentWrapper = $item.find(selectors.ITEM_CONTENT_WRAPPER); - this._trigger('close', { item: $item }); + this._trigger('close', {item: $item}); Velocity .animate($contentWrapper, 'slideUp', { @@ -215,7 +211,7 @@ plugin._setHeight(); - plugin._trigger('closed', { item: $item }); + plugin._trigger('closed', {item: $item}); } }); }, diff --git a/dist/bellows.min.js b/dist/bellows.min.js index 381d06c..bc767a8 100644 --- a/dist/bellows.min.js +++ b/dist/bellows.min.js @@ -1,2 +1,2 @@ /*! bellows 5.1.1 (https://github.com/mobify/bellows.git) */ -(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.1",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},_isOpen:function(e){return e=this._item(e),e.hasClass(n.OPENED)},_isDisabled:function(e){return e=this._item(e),e.hasClass(n.DISABLED)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file +!function(a){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],a);else{var b=window.Zepto||window.jQuery;a(b,b.Velocity,window.Plugin)}}(function(a,b,c){function d(a,b){d.__super__.call(this,a,b,d.DEFAULTS)}var e={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},f={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},g={CLICK:"click.bellows"};return d.VERSION="5.1.1",d.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:a.noop,opened:a.noop,close:a.noop,closed:a.noop},c.create("bellows",d,{_init:function(b){this.$bellows=a(b),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(g.CLICK)},_bindEvents:function(){var b=this;this.$bellows.on(g.CLICK,function(c){var d=a(c.target),f=d.closest(".bellows");d.is("a")||d.parents("a").length||f[0]===b.$bellows[0]&&(d.hasClass(e.HEADER)||d.closest(".bellows__header").length)&&(c.preventDefault(),b.toggle(d.closest(".bellows__item")))})},_getHeight:function(a){return parseFloat(b.CSS.getPropertyValue(a[0],"height"))},_setHeight:function(a){this.$bellows.css("height",a||"")},_item:function(a){return"number"==typeof a&&(a=this.$bellows.find("."+e.ITEM).eq(a)),a},_isOpen:function(a){return a.hasClass(e.OPENED)},_isDisabled:function(a){return a.hasClass(e.DISABLED)},_wrapContent:function(a){a.find(f.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(f.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(a){a=this._item(a),this[a.hasClass(e.OPENED)?"close":"open"](a)},open:function(a){if(a=this._item(a),!this._isOpen(a)&&!this._isDisabled(a)){var c=this,d=a.find(f.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:a}),b.animate(d,"slideDown",{begin:function(){c._setHeight(c._getHeight(c.$bellows)+c._getHeight(d)),a.addClass(e.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(e.OPENING).addClass(e.OPENED).find(f.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),c._setHeight(),c._trigger("opened",{item:a})}})}},close:function(a){if(a=this._item(a),this._isOpen(a)&&!this._isDisabled(a)){var c=this,d=a.find(f.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:a}),b.animate(d,"slideUp",{begin:function(){c._setHeight(c._getHeight(c.$bellows)),a.removeClass(e.OPENED).addClass(e.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(e.CLOSING).find(f.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),c._setHeight(),c._trigger("closed",{item:a})}})}},toggleAll:function(){var b=this;this.$bellows.find("."+e.ITEM).each(function(){b.toggle(a(this))})},openAll:function(){var b=this;this.$bellows.find("."+e.ITEM+":not(."+e.OPENED+")").each(function(){b.open(a(this))})},closeAll:function(){var b=this;this.$bellows.find("."+e.OPENED).each(function(){b.close(a(this))})},add:function(b,c){var d=a("
");a(b).appendTo(d),c&&this.$bellows.empty(),this._wrapContent(d),this.$bellows.append(d.children())}}),a("[data-bellows]").bellows(),a}); \ No newline at end of file diff --git a/src/js/bellows.js b/src/js/bellows.js index 5429a5e..ba2bc91 100644 --- a/src/js/bellows.js +++ b/src/js/bellows.js @@ -67,9 +67,9 @@ /** * Ghetto Event Delegation™ - Zepto doesn't support descendant selectors in event delegation, - so we compare against the closest bellows to ensure we are invoking - the event from a direct child, not a bellows child from a nested bellows. + Zepto doesn't support descendant selectors in event delegation, + so we compare against the closest bellows to ensure we are invoking + the event from a direct child, not a bellows child from a nested bellows. */ this.$bellows .on(events.CLICK, function(e) { @@ -118,6 +118,14 @@ return item; }, + _isOpen: function($item) { + return $item.hasClass(cssClasses.OPENED); + }, + + _isDisabled: function($item) { + return $item.hasClass(cssClasses.DISABLED); + }, + _wrapContent: function($items) { $items .find(selectors.ITEM_CONTENT) @@ -129,18 +137,6 @@ .attr('aria-hidden', true); }, - /* - Helper methods for determining Bellows item's status - */ - _isOpen: function($item) { - $item = this._item($item); - return $item.hasClass(cssClasses.OPENED); - }, - _isDisabled: function($item) { - $item = this._item($item); - return $item.hasClass(cssClasses.DISABLED); - }, - toggle: function($item) { $item = this._item($item); @@ -161,7 +157,7 @@ this.closeAll(); } - this._trigger('open', { item: $item }); + this._trigger('open', {item: $item}); Velocity .animate($contentWrapper, 'slideDown', { @@ -180,7 +176,7 @@ plugin._setHeight(); - plugin._trigger('opened', { item: $item }); + plugin._trigger('opened', {item: $item}); } }); }, @@ -195,7 +191,7 @@ var plugin = this; var $contentWrapper = $item.find(selectors.ITEM_CONTENT_WRAPPER); - this._trigger('close', { item: $item }); + this._trigger('close', {item: $item}); Velocity .animate($contentWrapper, 'slideUp', { @@ -215,7 +211,7 @@ plugin._setHeight(); - plugin._trigger('closed', { item: $item }); + plugin._trigger('closed', {item: $item}); } }); }, diff --git a/tests/unit/plugin.js b/tests/unit/plugin.js index ac832ba..c59557c 100644 --- a/tests/unit/plugin.js +++ b/tests/unit/plugin.js @@ -252,7 +252,7 @@ define([ }); describe('disabling a bellows item', function() { - it('does not open item when header clicked', function(done) { + it('does not open item when header clicked', function() { $element.bellows(); var $disabledItem = $(disabledItem); @@ -263,14 +263,11 @@ define([ .find('.bellows__header') .trigger('click'); - setTimeout(function() { - expect($disabledItem.hasClass('bellows--is-disabled')).to.be.true; - expect($disabledItem.hasClass('bellows--is-open')).to.be.false; - done(); - }); + expect($disabledItem.hasClass('bellows--is-disabled')).to.be.true; + expect($disabledItem.hasClass('bellows--is-open')).to.be.false; }); - it('does not close item when header clicked', function(done) { + it('does not close item when header clicked', function() { $element.bellows(); var $openDisabledItem = $(openDisabledItem); @@ -281,11 +278,8 @@ define([ .find('.bellows__header') .trigger('click'); - setTimeout(function() { - expect($openDisabledItem.hasClass('bellows--is-disabled')).to.be.true; - expect($openDisabledItem.hasClass('bellows--is-open')).to.be.true; - done(); - }); + expect($openDisabledItem.hasClass('bellows--is-disabled')).to.be.true; + expect($openDisabledItem.hasClass('bellows--is-open')).to.be.true; }); }); }); From bd821562c8183ad2eb6e18e4c022d200c5cd5234 Mon Sep 17 00:00:00 2001 From: Marlow Payne Date: Tue, 21 Apr 2015 12:59:07 -0700 Subject: [PATCH 5/6] Bump version number --- bower.json | 2 +- dist/bellows.js | 2 +- dist/bellows.min.js | 4 ++-- package.json | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/bower.json b/bower.json index 238dc32..1168b28 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "bellows", - "version": "5.1.1", + "version": "5.1.2", "homepage": "https://github.com/mobify/bellows", "authors": [ "Mobify " diff --git a/dist/bellows.js b/dist/bellows.js index 3f2fbef..3dedf15 100644 --- a/dist/bellows.js +++ b/dist/bellows.js @@ -33,7 +33,7 @@ Bellows.__super__.call(this, element, options, Bellows.DEFAULTS); } - Bellows.VERSION = '5.1.1'; + Bellows.VERSION = '5.1.2'; Bellows.DEFAULTS = { singleItemOpen: false, diff --git a/dist/bellows.min.js b/dist/bellows.min.js index bc767a8..c2fcbde 100644 --- a/dist/bellows.min.js +++ b/dist/bellows.min.js @@ -1,2 +1,2 @@ -/*! bellows 5.1.1 (https://github.com/mobify/bellows.git) */ -!function(a){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],a);else{var b=window.Zepto||window.jQuery;a(b,b.Velocity,window.Plugin)}}(function(a,b,c){function d(a,b){d.__super__.call(this,a,b,d.DEFAULTS)}var e={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},f={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},g={CLICK:"click.bellows"};return d.VERSION="5.1.1",d.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:a.noop,opened:a.noop,close:a.noop,closed:a.noop},c.create("bellows",d,{_init:function(b){this.$bellows=a(b),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(g.CLICK)},_bindEvents:function(){var b=this;this.$bellows.on(g.CLICK,function(c){var d=a(c.target),f=d.closest(".bellows");d.is("a")||d.parents("a").length||f[0]===b.$bellows[0]&&(d.hasClass(e.HEADER)||d.closest(".bellows__header").length)&&(c.preventDefault(),b.toggle(d.closest(".bellows__item")))})},_getHeight:function(a){return parseFloat(b.CSS.getPropertyValue(a[0],"height"))},_setHeight:function(a){this.$bellows.css("height",a||"")},_item:function(a){return"number"==typeof a&&(a=this.$bellows.find("."+e.ITEM).eq(a)),a},_isOpen:function(a){return a.hasClass(e.OPENED)},_isDisabled:function(a){return a.hasClass(e.DISABLED)},_wrapContent:function(a){a.find(f.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(f.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(a){a=this._item(a),this[a.hasClass(e.OPENED)?"close":"open"](a)},open:function(a){if(a=this._item(a),!this._isOpen(a)&&!this._isDisabled(a)){var c=this,d=a.find(f.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:a}),b.animate(d,"slideDown",{begin:function(){c._setHeight(c._getHeight(c.$bellows)+c._getHeight(d)),a.addClass(e.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(e.OPENING).addClass(e.OPENED).find(f.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),c._setHeight(),c._trigger("opened",{item:a})}})}},close:function(a){if(a=this._item(a),this._isOpen(a)&&!this._isDisabled(a)){var c=this,d=a.find(f.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:a}),b.animate(d,"slideUp",{begin:function(){c._setHeight(c._getHeight(c.$bellows)),a.removeClass(e.OPENED).addClass(e.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(e.CLOSING).find(f.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),c._setHeight(),c._trigger("closed",{item:a})}})}},toggleAll:function(){var b=this;this.$bellows.find("."+e.ITEM).each(function(){b.toggle(a(this))})},openAll:function(){var b=this;this.$bellows.find("."+e.ITEM+":not(."+e.OPENED+")").each(function(){b.open(a(this))})},closeAll:function(){var b=this;this.$bellows.find("."+e.OPENED).each(function(){b.close(a(this))})},add:function(b,c){var d=a("
");a(b).appendTo(d),c&&this.$bellows.empty(),this._wrapContent(d),this.$bellows.append(d.children())}}),a("[data-bellows]").bellows(),a}); \ No newline at end of file +/*! bellows 5.1.2 (https://github.com/mobify/bellows.git) */ +(function(e){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],e);else{var t=window.Zepto||window.jQuery;e(t,t.Velocity,window.Plugin)}})(function(e,t,i){function s(e,t){s.__super__.call(this,e,t,s.DEFAULTS)}var n={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},o={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},l={CLICK:"click.bellows"};return s.VERSION="5.1.2",s.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:e.noop,opened:e.noop,close:e.noop,closed:e.noop},i.create("bellows",s,{_init:function(t){this.$bellows=e(t),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(l.CLICK)},_bindEvents:function(){var t=this;this.$bellows.on(l.CLICK,function(i){var s=e(i.target),o=s.closest(".bellows");s.is("a")||s.parents("a").length||o[0]===t.$bellows[0]&&(s.hasClass(n.HEADER)||s.closest(".bellows__header").length)&&(i.preventDefault(),t.toggle(s.closest(".bellows__item")))})},_getHeight:function(e){return parseFloat(t.CSS.getPropertyValue(e[0],"height"))},_setHeight:function(e){this.$bellows.css("height",e||"")},_item:function(e){return"number"==typeof e&&(e=this.$bellows.find("."+n.ITEM).eq(e)),e},_isOpen:function(e){return e.hasClass(n.OPENED)},_isDisabled:function(e){return e.hasClass(n.DISABLED)},_wrapContent:function(e){e.find(o.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(e){e=this._item(e),this[e.hasClass(n.OPENED)?"close":"open"](e)},open:function(e){if(e=this._item(e),!this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:e}),t.animate(s,"slideDown",{begin:function(){i._setHeight(i._getHeight(i.$bellows)+i._getHeight(s)),e.addClass(n.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.OPENING).addClass(n.OPENED).find(o.ITEM_CONTENT_WRAPPER).removeAttr("aria-hidden"),i._setHeight(),i._trigger("opened",{item:e})}})}},close:function(e){if(e=this._item(e),this._isOpen(e)&&!this._isDisabled(e)){var i=this,s=e.find(o.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:e}),t.animate(s,"slideUp",{begin:function(){i._setHeight(i._getHeight(i.$bellows)),e.removeClass(n.OPENED).addClass(n.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){e.removeClass(n.CLOSING).find(o.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),i._setHeight(),i._trigger("closed",{item:e})}})}},toggleAll:function(){var t=this;this.$bellows.find("."+n.ITEM).each(function(){t.toggle(e(this))})},openAll:function(){var t=this;this.$bellows.find("."+n.ITEM+":not(."+n.OPENED+")").each(function(){t.open(e(this))})},closeAll:function(){var t=this;this.$bellows.find("."+n.OPENED).each(function(){t.close(e(this))})},add:function(t,i){var s=e("
");e(t).appendTo(s),i&&this.$bellows.empty(),this._wrapContent(s),this.$bellows.append(s.children())}}),e("[data-bellows]").bellows(),e}); \ No newline at end of file diff --git a/package.json b/package.json index c9a1a51..caf944b 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "type" : "git", "url" : "https://github.com/mobify/bellows.git" }, - "version": "5.1.1", + "version": "5.1.2", "description": "A mobile first accordion UI plugin", "devDependencies": { "grunt": "~0.4.x", From 39ebbde77cfa7fa0638d5a0867d78d2f7f318921 Mon Sep 17 00:00:00 2001 From: Marlow Payne Date: Tue, 21 Apr 2015 13:00:10 -0700 Subject: [PATCH 6/6] Updating changelog --- CHANGELOG | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG b/CHANGELOG index 6714ce2..8247a56 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -1,9 +1,11 @@ +5.1.2 + - Ensuring disabled items don't close on close 5.0.1 - Reworked test infrastructure to use more robust setup and teardown using iframes 5.0.0 - Upgrading to latest version of plugin factory - Adding `destroy` method - - Removing `event` option in favour of internalizing a namespaced event + - Removing `event` option in favour of internalizing a namespaced event 4.1.2 - Moved gremlins.js dependency to devDependencies 4.1.1