diff --git a/CHANGELOG b/CHANGELOG index 54c43ba..19e2710 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -1,3 +1,6 @@ +6.0.1 + - Fix [#62](https://github.com/mobify/bellows/issues/62): Use published Plugin dependency + - Fix [#63](https://github.com/mobify/bellows/issues/63): Short circuit open if other items are opening 6.0.0 - Publish to NPM - Remove Zepto support in favor of jQuery diff --git a/README.md b/README.md index 4900d9b..2b6e10a 100644 --- a/README.md +++ b/README.md @@ -16,6 +16,7 @@ You can find a simple demo on [the Documentation page](http://mobify.github.io/b * [jQuery](http://jquery.com/) * [Velocity.js](http://julian.com/research/velocity/) +* [Mobify's Plugin Factory](https://www.npmjs.com/package/mobify-plugin/) ### Zepto Support @@ -39,7 +40,7 @@ To use with require.js, after installing through NPM you merely have to referenc { 'paths': { '$': 'node_modules/bellows-ui/node_modules/jquery/dist/jquery.min', - 'plugin': 'node_modules/bellows-ui/node_modules/plugin/dist/plugin.min', + 'plugin': 'node_modules/bellows-ui/node_modules/mobify-plugin/dist/plugin.min', 'velocity': 'node_modules/bellows-ui/node_modules/velocity-animate/velocity' 'bellows': 'node_modules/bellows-ui/dist/bellows.min', } @@ -103,7 +104,7 @@ At a bare minimum, your markup structure should follow the above structure. You - + diff --git a/dist/bellows.js b/dist/bellows.js index 6e0035d..88c7a26 100644 --- a/dist/bellows.js +++ b/dist/bellows.js @@ -137,6 +137,13 @@ .attr('aria-hidden', true); }, + /* + Checks if other bellows items are currently opening + */ + _othersAreOpening: function() { + return this.$bellows.find('.' + cssClasses.OPENING).length > 0; + }, + toggle: function($item) { $item = this._item($item); @@ -155,6 +162,11 @@ if (this.options.singleItemOpen) { this.closeAll(); + + // Fix #63 + if (this._othersAreOpening()) { + return; + } } this._trigger('open', {item: $item}); diff --git a/dist/bellows.min.js b/dist/bellows.min.js index 72523c4..a1d52fb 100644 --- a/dist/bellows.min.js +++ b/dist/bellows.min.js @@ -1,2 +1,2 @@ /*! bellows-ui 6.0.0 (git+https://github.com/mobify/bellows.git) */ -!function(a){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],a);else{var b=window.jQuery;a(b,b.Velocity,window.Plugin)}}(function(a,b,c){var d={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},e={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},f={CLICK:"click.bellows"},g=function(a,b){g.__super__.call(this,a,b,g.DEFAULTS)};return g.VERSION="6.0.0",g.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:a.noop,opened:a.noop,close:a.noop,closed:a.noop},c.create("bellows",g,{_init:function(b){this.$bellows=a(b),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(f.CLICK)},_bindEvents:function(){var b=this;this.$bellows.on(f.CLICK,function(c){var e=a(c.target),f=e.closest(".bellows");e.is("a")||e.parents("a").length||f[0]===b.$bellows[0]&&(e.hasClass(d.HEADER)||e.closest(".bellows__header").length)&&(c.preventDefault(),b.toggle(e.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("."+d.ITEM).eq(a)),a},_isOpen:function(a){return a.hasClass(d.OPENED)},_isDisabled:function(a){return a.hasClass(d.DISABLED)},_wrapContent:function(a){a.find(e.ITEM_CONTENT).wrap('
').parents(".bellows__item:not(.bellows--is-open)").find(e.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},toggle:function(a){a=this._item(a),this[a.hasClass(d.OPENED)?"close":"open"](a)},open:function(a){if(a=this._item(a),!this._isOpen(a)&&!this._isDisabled(a)){var c=this,f=a.find(e.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&this.closeAll(),this._trigger("open",{item:a}),b.animate(f,"slideDown",{begin:function(){c._setHeight(c._getHeight(c.$bellows)+c._getHeight(f)),a.addClass(d.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(d.OPENING).addClass(d.OPENED).find(e.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,f=a.find(e.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:a}),b.animate(f,"slideUp",{begin:function(){c._setHeight(c._getHeight(c.$bellows)),a.removeClass(d.OPENED).addClass(d.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(d.CLOSING).find(e.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),c._setHeight(),c._trigger("closed",{item:a})}})}},toggleAll:function(){var b=this;this.$bellows.find("."+d.ITEM).each(function(){b.toggle(a(this))})},openAll:function(){var b=this;this.$bellows.find("."+d.ITEM+":not(."+d.OPENED+")").each(function(){b.open(a(this))})},closeAll:function(){var b=this;this.$bellows.find("."+d.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 +!function(a){if("function"==typeof define&&define.amd)define(["$","velocity","plugin"],a);else{var b=window.jQuery;a(b,b.Velocity,window.Plugin)}}(function(a,b,c){var d={ITEM:"bellows__item",HEADER:"bellows__header",OPENED:"bellows--is-open",OPENING:"bellows--is-opening",CLOSING:"bellows--is-closing",DISABLED:"bellows--is-disabled"},e={ITEM_HEADER:"> .bellows__item > .bellows__header",ITEM_CONTENT_WRAPPER:"> .bellows__content-wrapper",ITEM_CONTENT:"> .bellows__item > .bellows__content"},f={CLICK:"click.bellows"},g=function(a,b){g.__super__.call(this,a,b,g.DEFAULTS)};return g.VERSION="6.0.0",g.DEFAULTS={singleItemOpen:!1,duration:200,easing:"swing",open:a.noop,opened:a.noop,close:a.noop,closed:a.noop},c.create("bellows",g,{_init:function(b){this.$bellows=a(b),this._wrapContent(this.$bellows),this._bindEvents()},destroy:function(){this.$bellows.removeData(this.name).off(f.CLICK)},_bindEvents:function(){var b=this;this.$bellows.on(f.CLICK,function(c){var e=a(c.target),f=e.closest(".bellows");e.is("a")||e.parents("a").length||f[0]===b.$bellows[0]&&(e.hasClass(d.HEADER)||e.closest(".bellows__header").length)&&(c.preventDefault(),b.toggle(e.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("."+d.ITEM).eq(a)),a},_isOpen:function(a){return a.hasClass(d.OPENED)},_isDisabled:function(a){return a.hasClass(d.DISABLED)},_wrapContent:function(a){a.find(e.ITEM_CONTENT).wrap('').parents(".bellows__item:not(.bellows--is-open)").find(e.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0)},_othersAreOpening:function(){return this.$bellows.find("."+d.OPENING).length>0},toggle:function(a){a=this._item(a),this[a.hasClass(d.OPENED)?"close":"open"](a)},open:function(a){if(a=this._item(a),!this._isOpen(a)&&!this._isDisabled(a)){var c=this,f=a.find(e.ITEM_CONTENT_WRAPPER);this.options.singleItemOpen&&(this.closeAll(),this._othersAreOpening())||(this._trigger("open",{item:a}),b.animate(f,"slideDown",{begin:function(){c._setHeight(c._getHeight(c.$bellows)+c._getHeight(f)),a.addClass(d.OPENING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(d.OPENING).addClass(d.OPENED).find(e.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,f=a.find(e.ITEM_CONTENT_WRAPPER);this._trigger("close",{item:a}),b.animate(f,"slideUp",{begin:function(){c._setHeight(c._getHeight(c.$bellows)),a.removeClass(d.OPENED).addClass(d.CLOSING)},duration:this.options.duration,easing:this.options.easing,complete:function(){a.removeClass(d.CLOSING).find(e.ITEM_CONTENT_WRAPPER).attr("aria-hidden",!0),c._setHeight(),c._trigger("closed",{item:a})}})}},toggleAll:function(){var b=this;this.$bellows.find("."+d.ITEM).each(function(){b.toggle(a(this))})},openAll:function(){var b=this;this.$bellows.find("."+d.ITEM+":not(."+d.OPENED+")").each(function(){b.open(a(this))})},closeAll:function(){var b=this;this.$bellows.find("."+d.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/examples/assets/js/config.js b/examples/assets/js/config.js index fddf4d9..0215098 100644 --- a/examples/assets/js/config.js +++ b/examples/assets/js/config.js @@ -5,7 +5,7 @@ require.config({ 'text': 'node_modules/text/text', '$': 'node_modules/jquery/dist/jquery', 'velocity': 'node_modules/velocity-animate/velocity', - 'plugin': 'node_modules/plugin/dist/plugin.min', + 'plugin': 'node_modules/mobify-plugin/dist/plugin.min', 'bellows': 'dist/bellows', 'setup-bellows': 'examples/assets/js/setup-bellows' }, diff --git a/examples/norequire.html b/examples/norequire.html index c4a3b42..2cd973d 100644 --- a/examples/norequire.html +++ b/examples/norequire.html @@ -56,7 +56,7 @@Lorem honeyed locusts sit amet, none so wise, sed do eiusmod never resting ut labore et dolore magna aliqua. Manhood death before disgrace warrior, feed it to the goats spare me your false courtesy commodo consequat. Mace aute irure dolor in reprehenderit poison is a woman's weapon lord of light tower dwarf. The last of the dragons royal, godswood garron sister betrothed officia deserunt mollit anim id est snow.
- + diff --git a/package.json b/package.json index 05df84f..9c2cf1c 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "type": "git", "url": "git+https://github.com/mobify/bellows.git" }, - "version": "6.0.0", + "version": "6.0.1", "description": "A mobile-first JavaScript-driven accordion UI plugin", "devDependencies": { "chai": "1.9.2", @@ -26,7 +26,6 @@ "mobify-code-style": "^2.4.2", "mocha": "1.14.0", "node-sass-import-once": "1.2.0", - "plugin": "git+https://github.com/mobify/plugin.git#3.1.0", "requirejs": "2.2.0", "requirejs-glob": "git+https://github.com/mobify/requirejs-glob.git", "text": "requirejs/text" @@ -55,6 +54,7 @@ "author": "Mobify", "dependencies": { "jquery": "2.2.2", - "velocity-animate": "1.2.3" + "velocity-animate": "1.2.3", + "mobify-plugin": "4.0.0" } } diff --git a/src/js/bellows.js b/src/js/bellows.js index d781f0c..86ec358 100644 --- a/src/js/bellows.js +++ b/src/js/bellows.js @@ -137,6 +137,13 @@ .attr('aria-hidden', true); }, + /* + Checks if other bellows items are currently opening + */ + _othersAreOpening: function() { + return this.$bellows.find('.' + cssClasses.OPENING).length > 0; + }, + toggle: function($item) { $item = this._item($item); @@ -155,6 +162,11 @@ if (this.options.singleItemOpen) { this.closeAll(); + + // Fix #63 + if (this._othersAreOpening()) { + return; + } } this._trigger('open', {item: $item}); diff --git a/tests/runner/sandbox-config.js b/tests/runner/sandbox-config.js index 3b63551..63746e9 100644 --- a/tests/runner/sandbox-config.js +++ b/tests/runner/sandbox-config.js @@ -7,7 +7,7 @@ require.config({ 'velocity': 'node_modules/velocity-animate/velocity', 'chai': 'node_modules/chai/chai', 'mocha': 'node_modules/mocha/mocha', - 'plugin': 'node_modules/plugin/dist/plugin', + 'plugin': 'node_modules/mobify-plugin/dist/plugin', 'bellows': 'dist/bellows' }, 'shim': { diff --git a/tests/unit/plugin.js b/tests/unit/plugin.js index d4be056..7fa0d36 100644 --- a/tests/unit/plugin.js +++ b/tests/unit/plugin.js @@ -282,5 +282,20 @@ define([ expect($openDisabledItem.hasClass('bellows--is-open')).to.be.true; }); }); + + describe('a Bellows instance with singleItemOpen set', function() { + it('only allows a single item open when opening another item', function() { + $element.bellows({ + singleItemOpen: true, + opened: function() { + $element.bellows('open', 1); + $element.find('.bellows__item.bellows--is-open').to.have.length(1); + done(); + } + }); + + $element.bellows('open', 0); + }); + }); }); });