# HG changeset patch # User Chloe Laisne # Date 1467020110 -7200 # Node ID 35cb7200bb0a4f55844c9ab5bec7c1e858aa26e8 # Parent 59b63cdda9e800a045c7e924eb2a214330f65b1c Separate playlist and player component with player service as bridge diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/components/player-component.js --- a/cms/app-client/app/components/player-component.js Fri Jun 24 17:07:24 2016 +0200 +++ b/cms/app-client/app/components/player-component.js Mon Jun 27 11:35:10 2016 +0200 @@ -2,12 +2,16 @@ export default Ember.Component.extend({ classNames: ['player-component'], + + player: Ember.inject.service(), + currentTime: "00:00", duration: "00:00", - documentLoaded: Ember.observer('document.mediaArray', function() { - var mediaList = this.get('document').get("mediaList"); + 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); @@ -16,9 +20,15 @@ this.audio.src = mp3.url; this.audio.load(); this.set("currentTime", "00:00"); + //console.log(mp3.url); } }), + init: function() { + this._super(...arguments); + this.get('player'); + }, + didInsertElement: function() { var _this = this; diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/components/playlist-component.js --- a/cms/app-client/app/components/playlist-component.js Fri Jun 24 17:07:24 2016 +0200 +++ b/cms/app-client/app/components/playlist-component.js Mon Jun 27 11:35:10 2016 +0200 @@ -2,11 +2,12 @@ export default Ember.Component.extend({ - classNames: ['playlist-component'], + classNames: ['playlist-component'], - filter: Ember.inject.service(), + filter: Ember.inject.service(), + player: Ember.inject.service(), - documents: Ember.computed('model', 'filter.location', 'filter.language', 'filter.discourse', 'filter.date', 'filter.theme', function() { + documents: Ember.computed('model', 'filter.location', 'filter.language', 'filter.discourse', 'filter.date', 'filter.theme', function() { var self = this; var documents = this.get('model'); if (this.get('filter.date').length > 0) { @@ -33,9 +34,17 @@ return documents; }), - didRender: function() { - this._super(...arguments); - this.$().find('ul').height(Ember.$('.corpus-app-wrapper').outerHeight() - (Ember.$('.filter-component').outerHeight() + this.$().find('h2').outerHeight())); - } + didRender: function() { + this._super(...arguments); + this.$().find('ul').height(Ember.$('.corpus-app-wrapper').outerHeight() - (Ember.$('.filter-component').outerHeight() + this.$().find('h2').outerHeight())); + }, + + actions: { + + setItem: function(id) { + this.get('player').set('itemId', id); + } + + } }); diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/controllers/application.js --- a/cms/app-client/app/controllers/application.js Fri Jun 24 17:07:24 2016 +0200 +++ b/cms/app-client/app/controllers/application.js Mon Jun 27 11:35:10 2016 +0200 @@ -85,22 +85,27 @@ return true; }, + player: Ember.inject.service(), + detail: null, - currentId: null, - currentItem: Ember.computed('currentId', function() { - Ember.$(".result-item").toggleClass("playing", false); - if (this.get('currentId') === null){ - return null; - } - Ember.$("div[id='" + this.get('currentId') + "']").toggleClass("playing", true); - return this.store.findRecord('document', this.get('currentId')); - }), modalItem: Ember.computed('detail', function() { return this.store.findRecord('document', this.get('detail')); }), + itemIdObserver: Ember.observer('player.itemId', function() { + var self = this; + this.store.findRecord('document', this.get('player').get('itemId'), { reload: true }).then(function(it){ + self.get('player').set('item', it); + }); + }), + + init: function() { + this._super(...arguments); + this.get('player'); + }, + actions: { changeDocument: function(docDirection){ diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/models/document.js --- a/cms/app-client/app/models/document.js Fri Jun 24 17:07:24 2016 +0200 +++ b/cms/app-client/app/models/document.js Mon Jun 27 11:35:10 2016 +0200 @@ -3,34 +3,30 @@ import _ from 'lodash/lodash'; var CPDocument = DS.Model.extend({ - // id: DS.attr('string'), - uri: DS.attr('string'), - title: DS.attr('string'), - language: DS.attr('string'), - publishers: DS.attr({defaultValue: []}), - contributors: DS.attr({defaultValue: []}), - mediaArray: DS.attr({defaultValue: []}), - mediaList: Ember.computed('mediaArray', function() { - var res = []; - var mp3 = null; - _.forEach(this.get('mediaArray'), function(m) { - if(m.format === 'audio/mpeg') { - mp3 = m; - } else if (m.format.startsWith('audio/')) { - res.push(m); - } - }); - if(mp3) { - res.unshift(mp3); - } - return res; - }) -}); + + uri: DS.attr('string'), + title: DS.attr('string'), + language: DS.attr('string'), + publishers: DS.attr({ defaultValue: function() { return []; } }), + contributors: DS.attr({ defaultValue: function() { return []; } }), + mediaArray: DS.attr({ defaultValue: function() { return []; } }), -CPDocument.reopenClass({ - FIXTURES: [ + mediaList: Ember.computed('mediaArray', function() { + var res = []; + var mp3 = null; + _.forEach(this.get('mediaArray'), function(m) { + if(m.format === 'audio/mpeg') { + mp3 = m; + } else if(m.format.startsWith('audio/')) { + res.push(m); + } + }); + if(mp3) { + res.unshift(mp3); + } + return res; + }) - ] }); export default CPDocument; diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/services/player.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/cms/app-client/app/services/player.js Mon Jun 27 11:35:10 2016 +0200 @@ -0,0 +1,10 @@ +import Ember from 'ember'; + +export default Ember.Service.extend({ + + items: [], + + itemId: null, + item: null + +}); diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/app/templates/components/playlist-component.hbs --- a/cms/app-client/app/templates/components/playlist-component.hbs Fri Jun 24 17:07:24 2016 +0200 +++ b/cms/app-client/app/templates/components/playlist-component.hbs Mon Jun 27 11:35:10 2016 +0200 @@ -3,7 +3,7 @@ {{#each documents as |document| }}
  • - + Notice
    {{ document.title }} diff -r 59b63cdda9e8 -r 35cb7200bb0a cms/app-client/tests/unit/services/player-test.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/cms/app-client/tests/unit/services/player-test.js Mon Jun 27 11:35:10 2016 +0200 @@ -0,0 +1,12 @@ +import { moduleFor, test } from 'ember-qunit'; + +moduleFor('service:player', 'Unit | Service | player', { + // Specify the other units that are required for this test. + // needs: ['service:foo'] +}); + +// Replace this with your real tests. +test('it exists', function(assert) { + let service = this.subject(); + assert.ok(service); +});