v1.6.10 move onClose method to fire as animation begins (#98)

CHANGELOG.md

@@ -1,3 +1,7 @@
+### 1.6.10
+**2018-02-15**
+* Run sidebar onClose method at the beginning of the animation to avoid delays
+
 ### 1.6.9
 **2017-10-30**
 * Added black button to core colors.

README.md

@@ -1,3 +1,5 @@
+# THIS IS SLOWLY BEING DEPRECATED IN FAVOR OF QUARTZ-REACT + ADVENTURINE
+
 # Quartz
 ![quartz](https://github.com/vhx/quartz/blob/master/app/public/quartz.screenshot.jpg)
 

VERSION

@@ -1 +1 @@
-1.6.9
+1.6.10

dist/component-checkbox.css

@@ -136,24 +136,24 @@
     border: 1px solid #9aaab4; }
 
 .form .checkbox.small {
-  min-height: 13.33333px; }
+  min-height: 13.3333333333px; }
   .form .checkbox.small label {
-    min-height: 13.33333px;
-    line-height: 13.33333px; }
+    min-height: 13.3333333333px;
+    line-height: 13.3333333333px; }
     .form .checkbox.small label .checkbox--icon {
-      width: 13.33333px;
-      height: 13.33333px; }
+      width: 13.3333333333px;
+      height: 13.3333333333px; }
       .form .checkbox.small label .checkbox--icon .checkbox-animate {
-        width: 10.33333px;
-        height: 10.33333px;
+        width: 10.3333333333px;
+        height: 10.3333333333px;
         top: 1px;
         right: 1px; }
     .form .checkbox.small label .checkbox--label {
-      width: calc(100% - 18.33333px);
-      left: 18.33333px; }
+      width: calc(100% - 18.3333333333px);
+      left: 18.3333333333px; }
     .form .checkbox.small label .checkbox--label,
     .form .checkbox.small label .checkbox--contain {
-      min-height: 13.33333px; }
+      min-height: 13.3333333333px; }
 
 .form .checkbox.medium {
   min-height: 20px; }

dist/component-sidebar.js

@@ -63,16 +63,18 @@ vhxm.components.shared.sidebar.controller = function (opts) {
 
   self.animatorOut = function (elem, isInit) {
     $(elem).velocity('stop', true);
+    vhxm.components.shared.sidebar.state.skipTransition(false);
     $(elem).velocity({
       right: '-470'
     }, {
       duration: 500,
       easing: [0.19, 1, 0.22, 1],
-      complete: function complete() {
+      being: function being() {
         vhxm.components.shared.sidebar.state.onClose();
+      },
+      complete: function complete() {
         $(document).off('keyup', self.esc);
         $(document).off('click', self.documentClickHandler);
-        vhxm.components.shared.sidebar.state.skipTransition(false);
       }
     });
   };
@@ -83,6 +85,7 @@ vhxm.components.shared.sidebar.controller = function (opts) {
     }
   };
 };
+
 vhxm.components.shared.sidebar.toggle = function (state, route) {
   state = state === 'open' ? true : false;
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vhx/quartz",
-  "version": "1.6.9",
+  "version": "1.6.10",
   "description": "VHX Style Guide and JS Components.",
   "homepage": "https://github.com/vhx/quartz",
   "author": "VHX",

quartz-js/components/sidebar/sidebar.controller.js

@@ -63,16 +63,18 @@ vhxm.components.shared.sidebar.controller = function(opts) {
 
   self.animatorOut = function(elem, isInit) {
     $(elem).velocity('stop', true);
+    vhxm.components.shared.sidebar.state.skipTransition(false);
     $(elem).velocity({
       right: '-470'
     }, {
       duration: 500,
       easing: [0.19, 1, 0.22, 1],
-      complete: function() {
+      being: function() {
         vhxm.components.shared.sidebar.state.onClose();
+      },
+      complete: function() {
         $(document).off('keyup', self.esc);
         $(document).off('click', self.documentClickHandler);
-        vhxm.components.shared.sidebar.state.skipTransition(false);
       }
     });
   };
@@ -82,4 +84,4 @@ vhxm.components.shared.sidebar.controller = function(opts) {
       vhxm.components.shared.sidebar.toggle('close');
     }
   };
-};
+};