From e46c7b1ac72e69bdaf9f67fe468625b18bee51ec Mon Sep 17 00:00:00 2001
From: Felix Niklas <mail@felixniklas.de>
Date: Fri, 29 Aug 2014 15:01:38 +0200
Subject: [PATCH] snappier recipient animation

---
 .../javascripts/app/controllers/ticket_zoom.js.coffee       | 6 ++++--
 app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco   | 2 +-
 app/assets/stylesheets/zzz.css.erb                          | 2 +-
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee b/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee
index fc13eca2c..5686e02db 100644
--- a/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee
+++ b/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee
@@ -463,16 +463,18 @@ class Edit extends App.Controller
     arrow = list.find('.list-arrow')
 
     if toggle.hasClass('state--open')
+      toggle.removeClass('state--open')
       list.velocity
         properties:
           scale: [ 0, 1 ]
           opacity: [ 0, 1 ]
         options:
           speed: 300
-          easing: [ 0.34, 1.61, 0.7, 1 ]
-          complete: -> toggle.removeClass('state--open')
+          easing: [ 500, 20 ]
+          complete: -> list.addClass('hide')
     else
       toggle.addClass('state--open')
+      list.removeClass('hide')
 
       toggleDimensions = toggle.get(0).getBoundingClientRect()
       availableHeight = toggle.scrollParent().outerHeight()
diff --git a/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco b/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco
index e9486649e..151f0ec57 100644
--- a/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco
+++ b/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco
@@ -28,7 +28,7 @@
         <div class="recipient-picker clickable horizontal centered">
           <div class="recipients icon"></div>
           <div class="recipient-count">3</div>
-          <div class="recipient-list">
+          <div class="recipient-list hide">
             <div class="list-arrow"></div>
             <div class="list-head horizontal">
               <%- @T('Recipients') %>
diff --git a/app/assets/stylesheets/zzz.css.erb b/app/assets/stylesheets/zzz.css.erb
index c2f8f25ed..97ad0a566 100644
--- a/app/assets/stylesheets/zzz.css.erb
+++ b/app/assets/stylesheets/zzz.css.erb
@@ -2743,6 +2743,7 @@ footer {
     height: 38px;
     position: relative;
     z-index: 3;
+    transition: 300ms;
   }
 
   .ticket-edit .recipient-picker.state--open {
@@ -2764,7 +2765,6 @@ footer {
       background: hsl(234,10%,19%);
       left: 48px;
       color: white;
-      display: none;
     }
 
       .recipient-picker.state--open .recipient-list {