Merge pull request #66 from mobify/release-6.0.1

Release 6.0.1

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

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
 <!-- Include dependencies -->
 <script src="jqueryin.js"></script>
 <script src="node_modules/velocity-animate/velocity.min.js"></script>
-<script src="node_modules/plugin/dist/plugin.min.js"></script>
+<script src="node_modules/mobify-plugin/dist/plugin.min.js"></script>
 
 <!-- Include bellows.js -->
 <script src="bellows.min.js"></script>

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});

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'
     },

examples/norequire.html

@@ -56,7 +56,7 @@ <h3>Header</h3>
         <p>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.</p>
 
         <script src="../node_modules/jquery/dist/jquery.js" ></script>
-        <script src="../node_modules/plugin/dist/plugin.js" ></script>
+        <script src="../node_modules/mobify-plugin/dist/plugin.js" ></script>
         <script src="../node_modules/velocity-animate/velocity.js"></script>
         <script src="../src/js/bellows.js" ></script>
         <script src="assets/js/setup-bellows.js"></script>

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"
   }
 }

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});

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': {

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);
+            });
+        });
     });
 });