diff -r 226ae8f2e8e9 -r db5711fbbb6c cms/app-client/app/components/player-component.js
--- a/cms/app-client/app/components/player-component.js	Tue Jun 14 18:28:34 2016 +0200
+++ b/cms/app-client/app/components/player-component.js	Wed Jun 15 09:50:56 2016 +0200
@@ -1,122 +1,128 @@
 import Ember from 'ember';
 
 export default Ember.Component.extend({
-  classNames: ['player-component'],
-  currentTime: "00:00",
-  duration: "00:00",
-  documentLoaded: Ember.observer('document.mediaArray', function() {
-    var mediaList = this.get('document').get("mediaList");
-    if ((typeof(mediaList) !== 'undefined') && (mediaList.length > 0)){
-      if (this.audio.src){
-        this.pause();
-        this.updateProgress(0);
-      }
-      var mp3 = mediaList.findBy('format', 'audio/mpeg');
-      this.audio.src = mp3.url;
-      this.audio.load();
-      this.set("currentTime", "00:00");
-    }
+    classNames: ['player-component'],
+    currentTime: "00:00",
+    duration: "00:00",
 
-  }),
-
-  didInsertElement: function(){
-    var _this = this;
+    documentLoaded: Ember.observer('document.mediaArray', function() {
+        var mediaList = this.get('document').get("mediaList");
+        if ((typeof(mediaList) !== 'undefined') && (mediaList.length > 0)) {
+            if (this.audio.src){
+                this.pause();
+                this.updateProgress(0);
+            }
+            var mp3 = mediaList.findBy('format', 'audio/mpeg');
+            this.audio.src = mp3.url;
+            this.audio.load();
+            this.set("currentTime", "00:00");
+        }
+    }),
 
-    this.audio = new Audio();
+    didInsertElement: function() {
+        var _this = this;
+
+        this.audio = new Audio();
 
-    this.button = {
-      play: this.$('#action_play'),
-      progress: this.$('.progress')
-    };
+        this.button = {
+            play: this.$('#action_play'),
+            progress: this.$('.progress')
+        };
 
-		this.$(document).on('touchmove', function(e){
-			e.preventDefault();
-		});
+        this.$(document).on('touchmove', function(e){
+            e.preventDefault();
+        });
 
-		// seeker
-		this.button.progress.on('mousedown', function(e){
-			var r = _this.rotation(e.pageX, e.pageY);
-			_this.updateProgress(r);
-			_this.changeTime(r/360*100);
-		});
+        // seeker
+        this.button.progress.on('mousedown', function(e){
+            var r = _this.rotation(e.pageX, e.pageY);
+            _this.updateProgress(r);
+            _this.changeTime(r/360*100);
+        });
 
-    this.audio.addEventListener('loadedmetadata',function (){
-      var minutes = Math.floor( _this.audio.duration / 60);
-      var seconds =  Math.floor(_this.audio.duration) % 60;
-      _this.set('duration', ('0' + minutes).slice(-2)+':'+('0' + seconds).slice(-2));
-    });
+        this.audio.addEventListener('loadedmetadata',function (){
+            var minutes = Math.floor( _this.audio.duration / 60);
+            var seconds =  Math.floor(_this.audio.duration) % 60;
+            _this.set('duration', ('0' + minutes).slice(-2)+':'+('0' + seconds).slice(-2));
+        });
 
-		// update bar onchange
-		this.audio.addEventListener('timeupdate',function (){
-			var curtime = _this.audio.currentTime,
-				percent = (curtime/_this.audio.duration)*100,
-				deg = 360/100*percent,
-        minutes = Math.floor( curtime / 60),
-        seconds =  Math.floor(curtime) % 60;
-      _this.set('currentTime', ('0' + minutes).slice(-2)+':'+('0' + seconds).slice(-2));
-			_this.updateProgress(deg);
-		});
+        // update bar onchange
+        this.audio.addEventListener('timeupdate',function (){
+            var curtime = _this.audio.currentTime,
+            percent = (curtime/_this.audio.duration)*100,
+            deg = 360/100*percent,
+            minutes = Math.floor( curtime / 60),
+            seconds =  Math.floor(curtime) % 60;
+            _this.set('currentTime', ('0' + minutes).slice(-2)+':'+('0' + seconds).slice(-2));
+            _this.updateProgress(deg);
+        });
 
-		// when the audio has finished playing
-		this.audio.addEventListener('ended', function(){
-      _this.pause();
-      _this.changeTime(0);
-      _this.updateProgress(0);
-		});
-  },
-  // change seeked time
-  changeTime: function(percent){
-    var t = (this.audio.duration*percent)/100;
-    this.audio.currentTime = t;
-  },
-  updateProgress: function(deg){
-    var $slice = this.$('.slice');
+        // when the audio has finished playing
+        this.audio.addEventListener('ended', function(){
+            _this.pause();
+            _this.changeTime(0);
+            _this.updateProgress(0);
+        });
+    },
+
+    // change seeked time
+    changeTime: function(percent){
+        var t = (this.audio.duration*percent)/100;
+        this.audio.currentTime = t;
+    },
 
-    if (deg > 180 && !$slice.is('.gt50')) {
-      $slice.addClass('gt50');
-      $slice.append('<div class="pie fill"></div>');
-    } else if (deg < 180 && $slice.is('.gt50')) {
-      $slice.removeClass('gt50');
-      $slice.find('.fill').remove();
-    }
+    updateProgress: function(deg){
+        var $slice = this.$('.slice');
+        if (deg > 180 && !$slice.is('.gt50')) {
+            $slice.addClass('gt50');
+            $slice.append('<div class="pie fill"></div>');
+        } else if (deg < 180 && $slice.is('.gt50')) {
+            $slice.removeClass('gt50');
+            $slice.find('.fill').remove();
+        }
+        $slice.find('.pie').css({
+            '-moz-transform':'rotate('+deg+'deg)',
+            '-webkit-transform':'rotate('+deg+'deg)',
+            '-o-transform':'rotate('+deg+'deg)',
+            'transform':'rotate('+deg+'deg)'
+        });
+    },
 
-    $slice.find('.pie').css({
-      '-moz-transform':'rotate('+deg+'deg)',
-      '-webkit-transform':'rotate('+deg+'deg)',
-      '-o-transform':'rotate('+deg+'deg)',
-      'transform':'rotate('+deg+'deg)'
-    });
-  },
-  rotation: function(x,y){
-    var offset = this.button.progress.offset();
-    var button_centerX = (offset.left) + (this.button.progress.width()/2);
-    var button_centerY = (offset.top) + (this.button.progress.height()/2);
+    rotation: function(x,y){
+        var offset = this.button.progress.offset();
+        var button_centerX = (offset.left) + (this.button.progress.width()/2);
+        var button_centerY = (offset.top) + (this.button.progress.height()/2);
+        var radians = Math.atan2(x - button_centerX, y - button_centerY);
+        var degree = Math.round( (radians * (180 / Math.PI) * -1) + 180 );
+        return degree;
+        //return (degree <= max ? degree : max);
+    },
+
+    play: function(){
+        this.audio.play();
+        this.button.play.addClass('playing');
+        this.button.play.text('Pause');
+    },
 
-    var radians = Math.atan2(x - button_centerX, y - button_centerY);
-    var degree = Math.round( (radians * (180 / Math.PI) * -1) + 180 );
-    return degree;
-    //return (degree <= max ? degree : max);
-  },
-  play: function(){
-    this.audio.play();
-    this.button.play.addClass('playing');
-    this.button.play.text('Pause');
-  },
-  pause: function(){
-    this.audio.pause();
-    this.button.play.removeClass('playing');
-    this.button.play.text('Play');
-  },
-  actions: {
-    tooglePlay: function(){
-      if (this.button.play.is('.playing')) {
-        this.pause();
-      } else {
-        this.play();
-      }
+    pause: function(){
+        this.audio.pause();
+        this.button.play.removeClass('playing');
+        this.button.play.text('Play');
     },
-    prevNextDocument(change){
-      this.sendAction("action", change);
+
+    actions: {
+
+        tooglePlay: function(){
+            if (this.button.play.is('.playing')) {
+                this.pause();
+            } else {
+                this.play();
+            }
+        },
+
+        prevNextDocument(change){
+            this.sendAction("action", change);
+        }
+
     }
-  }
 });