cms/app-client/app/components/player-component.js
changeset 210 08ad36c693b1
parent 209 35cb7200bb0a
child 211 7451203a1321
--- a/cms/app-client/app/components/player-component.js	Mon Jun 27 11:35:10 2016 +0200
+++ b/cms/app-client/app/components/player-component.js	Tue Jun 28 22:11:38 2016 +0200
@@ -8,10 +8,13 @@
     currentTime: "00:00",
     duration: "00:00",
 
+    item: Ember.computed('player.item', function() {
+        return this.get('player').get('item');
+    }),
+
     documentLoaded: Ember.observer('player.item', function() {
         var mediaList = this.get('player').get('item').get('mediaList');
         if ((typeof(mediaList) !== 'undefined') && (mediaList.length > 0)) {
-
             if (this.audio.src){
                 this.pause();
                 this.updateProgress(0);
@@ -30,107 +33,12 @@
     },
 
     didInsertElement: function() {
-        var _this = this;
-
-        this.audio = new Audio();
-
-        this.button = {
-            play: this.$('#action_play'),
-            progress: this.$('.progress')
-        };
-
-        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);
-        });
-
-        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);
-        });
-
-        // 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');
-        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)'
-        });
-    },
-
-    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;
-    },
-
-    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();
-            }
-        },
+        play: function() {
 
-        prevNextDocument(change){
-            this.sendAction("action", change);
         }
 
     }