--- a/cms/app-client/app/components/player-component.js Sat Jul 16 17:23:47 2016 +0200
+++ b/cms/app-client/app/components/player-component.js Sun Jul 17 14:41:03 2016 +0200
@@ -46,7 +46,7 @@
if(this.get('player').get('item') !== id) {
this.get('popcorn').on('loadeddata', Ember.run.bind(this, this.get('play')));
} else {
- this.toggle();
+ this.send('toggle');
}
}));
},
@@ -75,15 +75,15 @@
this.get('popcorn').pause();
},
- toggle: function() {
- if(this.get('player').get('playing')) {
- this.pause();
- } else {
- this.play();
- }
- },
+ actions: {
- actions: {
+ toggle: function() {
+ if(this.get('player').get('playing')) {
+ this.pause();
+ } else {
+ this.play();
+ }
+ },
backward: function() {
var index = this.get('player').get('items').indexOf(this.get('player').get('item'));
@@ -95,6 +95,10 @@
var index = this.get('player').get('items').indexOf(this.get('player').get('item'));
var item = this.get('player').get('items')[index + 1];
this.get('player').set('item', item);
+ },
+
+ setTime: function(event) {
+ this.get('popcorn').currentTime(event.layerX * this.get('popcorn').duration() / Ember.$(event.target).width());
}
}
--- a/cms/app-client/app/styles/components/player-component.scss Sat Jul 16 17:23:47 2016 +0200
+++ b/cms/app-client/app/styles/components/player-component.scss Sun Jul 17 14:41:03 2016 +0200
@@ -95,6 +95,7 @@
position: relative;
display: block;
top: 50%;
+ cursor: pointer;
}
.player-component #audio .progress .bar .value {
--- a/cms/app-client/app/templates/components/player-component.hbs Sat Jul 16 17:23:47 2016 +0200
+++ b/cms/app-client/app/templates/components/player-component.hbs Sun Jul 17 14:41:03 2016 +0200
@@ -2,15 +2,15 @@
<div class="controls">
<i title="Backward" class="fa fa-backward{{if isFirst ' disabled'}}" {{action 'backward'}}>Backward</i>
{{#if player.playing}}
- <i title="Pause" class="fa fa-pause" {{action toggle}}>Pause</i>
+ <i title="Pause" class="fa fa-pause" {{action 'toggle'}}>Pause</i>
{{else}}
- <i title="Play" class="fa fa-play" {{action toggle}}>Play</i>
+ <i title="Play" class="fa fa-play" {{action 'toggle'}}>Play</i>
{{/if}}
<i title="Forward" class="fa fa-forward{{if isLast ' disabled'}}" {{action 'forward'}}>Forward</i>
</div>
<div class="progress">
<span class="head">{{to-minutes head}}</span>
- <span class="bar"><span class="value"></span></span>
+ <span class="bar" onclick={{action 'setTime'}}><span class="value"></span></span>
<span class="remaining">- {{to-minutes remaining}}</span>
</div>
<div class="meta">