# HG changeset patch
# User Chloe Laisne <chloe.laisne@gmail.com>
# Date 1476714074 -19800
# Node ID 4b66390442fdce12b77611110c4a3ab876cc4d29
# Parent  70451a4dc9ae8385ee014c1b4e48135b2bb1cbc6
Cancel auto scroll on manual scroll

diff -r 70451a4dc9ae -r 4b66390442fd cms/app-client/app/components/player-component.js
--- a/cms/app-client/app/components/player-component.js	Mon Oct 17 14:50:30 2016 +0530
+++ b/cms/app-client/app/components/player-component.js	Mon Oct 17 19:51:14 2016 +0530
@@ -19,11 +19,6 @@
         return this.get('player').get('model');
     }),
 
-    didRender: function() {
-        this.textAutoscroll(Ember.$('#' + this.elementId).find('.title'));
-        this.textAutoscroll(Ember.$('#' + this.elementId).find('.author'));
-    },
-
     modelLoaded: Ember.observer('player.model', function() {
         var items = this.get('player').get('items');
         var index = items.indexOf(this.get('player').get('item'));
@@ -67,6 +62,11 @@
                 this.send('toggle');
             }
         }));
+
+        setTimeout(Ember.run.bind(this, function() {
+            this.textAutoscroll(Ember.$('#' + this.elementId).find('.title'));
+            this.textAutoscroll(Ember.$('#' + this.elementId).find('.author'));
+        }), 500);
     },
 
     textAutoscroll: function(jElement) {
diff -r 70451a4dc9ae -r 4b66390442fd cms/app-client/app/components/transcript-component.js
--- a/cms/app-client/app/components/transcript-component.js	Mon Oct 17 14:50:30 2016 +0530
+++ b/cms/app-client/app/components/transcript-component.js	Mon Oct 17 19:51:14 2016 +0530
@@ -6,20 +6,37 @@
 
     player: Ember.inject.service(),
 
+    autoscrollElement : '.corpus-app-container',
+    previousElement: 0,
     autoscroll: true,
-    autoscrollElement : '.corpus-app-container',
     timeout: null,
 
     itemObserver: Ember.observer('player.item', function () {
         this.set('autoscroll', true);
     }),
 
+    didInsertElement: function() {
+        Ember.$('#' + this.elementId).parent().on('scroll', Ember.run.bind(this, this.onScroll));
+    },
+
+    onScroll: function() {
+        this.set('autoscroll', false);
+        Ember.$('#' + this.elementId).parent().off('scroll');
+    },
+
     didUpdate: function() {
+        var self = this;
         var target = Ember.$('.sentence.active');
-        if(this.get('autoscroll') && target.length) {
+        if(this.get('autoscroll') && target.length && target.attr('data-ember-action') !== this.get('previousElement')) {
+            Ember.$('#' + self.elementId).parent().off('scroll');
             Ember.$(this.get('autoscrollElement')).animate({
                 scrollTop: target.offset().top + Ember.$(this.get('autoscrollElement')).scrollTop() - Ember.$(this.get('autoscrollElement')).offset().top - 154
-            }, 150);
+            }, 150, 'swing', function() {
+                setTimeout(function() {
+                    Ember.$('#' + self.elementId).parent().on('scroll', Ember.run.bind(self, self.onScroll));
+                }, 100);
+            });
+            this.set('previousElement', target.attr('data-ember-action'))
         }
     },