From 02f986fe72cd6619e7db08d3bf324982e37c7be0 Mon Sep 17 00:00:00 2001
From: Lisa P <mail@lislis.de>
Date: Wed, 21 Oct 2015 17:47:44 +0200
Subject: [PATCH] change fade animation and properly clean timeout

---
 app/components/broadcast-tower.coffee  | 12 ++++++++----
 app/controllers/top.coffee             |  2 --
 app/styles/app/layouts/broadcasts.sass | 10 +++++-----
 3 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/app/components/broadcast-tower.coffee b/app/components/broadcast-tower.coffee
index f817fc0f..247c5e15 100644
--- a/app/components/broadcast-tower.coffee
+++ b/app/components/broadcast-tower.coffee
@@ -5,6 +5,7 @@ BroadcastTowerComponent = Ember.Component.extend
   classNames: ['broadcast']
 
   isOpen: false
+  timeoutId: ''
 
   isEmpty: (->
     @get('status') == ''
@@ -16,9 +17,12 @@ BroadcastTowerComponent = Ember.Component.extend
       @sendAction('toggleBroadcasts')
 
       if @get('isOpen') == true
-        setTimeout => 
-          @toggleProperty('isOpen')
-          @sendAction('toggleBroadcasts')
-        , 10000
+        @set('timeoutId', setTimeout => 
+            @toggleProperty('isOpen')
+            @sendAction('toggleBroadcasts')
+          , 10000
+        )
+      else
+        clearTimeout(@get('timeoutId'))
 
 `export default BroadcastTowerComponent`
diff --git a/app/controllers/top.coffee b/app/controllers/top.coffee
index 05c3f474..b246fe8b 100644
--- a/app/controllers/top.coffee
+++ b/app/controllers/top.coffee
@@ -48,8 +48,6 @@ Controller = Ember.Controller.extend
         broadcasts.set('content', receivedBroadcasts)
         broadcasts.set('isLoading', false)
 
-        console.log broadcasts
-
       broadcasts
   ).property('broadcasts')
 
diff --git a/app/styles/app/layouts/broadcasts.sass b/app/styles/app/layouts/broadcasts.sass
index 55d9cb9d..a998febf 100644
--- a/app/styles/app/layouts/broadcasts.sass
+++ b/app/styles/app/layouts/broadcasts.sass
@@ -17,12 +17,12 @@
   margin: 0 auto .7em
   border-radius: 2px
   height: 0
-  transform-origin: top center
-  transform: translateY(50%) scale(.9)
+  transform-origin: center center
+  // transform: translateY(50%)
   opacity: 0
   z-index: -1
-  will-change: transform, opacity
-  transition: opacity 150ms ease, transform 50ms linear
+  will-change: opacity
+  transition: opacity 150ms ease
 
   &:after
     content: ""
@@ -55,7 +55,7 @@
     border: solid 2px $cream-dark
     opacity: 1
     height: auto
-    transform: translateY(0) scale(1)
+    // transform: translateY(0)
 
   .icon-close
     display: inline-block