Added close animation override.

examples/chronos.css

@@ -6,6 +6,7 @@
   -moz-border-radius: 10px;
   border-radius: 10px;
   overflow: hidden;
+  display: none;
   /**
    * HEADER
    */

spec/animator-spec.coffee

@@ -90,7 +90,7 @@ describe "Animator", ->
       it "calls animate with the correct arguments", ->
         spyOn(a, '_animate')
         a.close()
-        expect(a._animate).toHaveBeenCalledWith(animation, 'closed')
+        expect(a._animate).toHaveBeenCalledWith(animation, 'closed', true)
 
     describe "without custom animations", ->
       beforeEach ->
@@ -100,7 +100,7 @@ describe "Animator", ->
         spyOn(a, '_animate')
         spyOn(a, '_animateClose')
         a.close()
-        expect(a._animate).toHaveBeenCalledWith(a._animateClose, 'closed')
+        expect(a._animate).toHaveBeenCalledWith(a._animateClose, 'closed', true)
 
   describe "#open", ->
     describe "when given custom animations", ->
@@ -133,13 +133,20 @@ describe "Animator", ->
       beforeEach ->
         a.pickerManager = jasmine.createSpy("pickerManager mock")
 
-      describe "when already animating", ->
+      describe "when already animating and no override", ->
         beforeEach ->
           a.animating = true
           it "does not call the animation", ->
             a._animate(animation, eventname)
             expect(animation).not.toHaveBeenCalled()
 
+      describe "when already animating with override", ->
+        beforeEach ->
+          a.animating = true
+          it "does call the animation", ->
+            a._animate(animation, eventname, true)
+            expect(animation).toHaveBeenCalled()
+
       describe "when not already animating", ->
         beforeEach ->
           a.animating = false

src/animator.coffee

@@ -29,7 +29,7 @@ class chronos.Animator
   # Animate closing the date picker
   close: ->
     animation = @animations.close || @_animateClose
-    @_animate(animation, 'closed')
+    @_animate(animation, 'closed', true)
 
   # Animate opening the date picker
   open: ->
@@ -49,7 +49,8 @@ class chronos.Animator
   ###
 
   # common animation pattern
-  _animate: (animation, eventName) ->
+  _animate: (animation, eventName, override) ->
+    @animating = false if override
     unless @animating
       @animating = true
       @currentEventName = eventName
@@ -146,10 +147,10 @@ class chronos.Animator
 
   # default animation to close picker
   _animateOpen: (pickerManager) ->
-    @$picker.animate {
-      opacity: 100
-    }, 300, =>
+    @$picker.fadeIn('fast', =>
       @animationFinished()
+    )
+
 
 
 

src/scss/chronos.scss

@@ -28,6 +28,7 @@ $colorOtherMonth: #E1DBFF;
   color: $colorText;
   @include border-radius($border_radius);
   overflow: hidden; // needed to body_prev and body_next
+  display: none; // show with open animation
 
   .body {
     width: 3*$calendar_width;

src/scss/partials/_css3.scss

@@ -28,6 +28,12 @@
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=$startColor, endColorstr=$endColor, GradientType=0); // IE9 and down
 }
 
+// Opacity
+@mixin opacity($opacity: 100) {
+  opacity: $opacity / 100;
+   filter: "alpha(opacity=#{$opacity})";
+}
+
 //// Transitions
 //@mixin transition($transition) {
 //  -webkit-transition: $transition;
@@ -37,11 +43,7 @@
 //          transition: $transition;
 //}
 
-//// Opacity
-//@mixin opacity($opacity: 100) {
-//  opacity: $opacity / 100;
-//   filter: "alpha(opacity=#{$opacity})";
-//}
+
 
 //// Background sizing
 //@mixin background-size($size) {