Player forward and backward
authorChloe Laisne <chloe.laisne@gmail.com>
Sat, 16 Jul 2016 17:23:47 +0200
changeset 240 aa101458cd4e
parent 239 1c8883feeab0
child 241 da3c6ba8a80b
Player forward and backward
cms/app-client/app/components/filtering-component.js
cms/app-client/app/components/player-component.js
cms/app-client/app/components/playlist-component.js
cms/app-client/app/routes/tabs/thematiques.js
cms/app-client/app/styles/components/filtering-component.scss
cms/app-client/app/templates/components/filtering-component.hbs
cms/app-client/app/templates/components/sorting-component.hbs
cms/app-client/app/templates/tabs/thematiques.hbs
cms/app-client/mirage/serializers/theme.js
--- a/cms/app-client/app/components/filtering-component.js	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/components/filtering-component.js	Sat Jul 16 17:23:47 2016 +0200
@@ -10,7 +10,7 @@
 
     input: '',
     filteredThemes: Ember.computed.filter('themes', function(item) {
-        return this.get('input') && (item.get('label') || '').match(new RegExp('^' + this.get('input')));
+        return this.get('input') && item.get('label').match(new RegExp('^' + this.get('input')));
     }).property('input'),
 
     init: function() {
--- a/cms/app-client/app/components/player-component.js	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/components/player-component.js	Sat Jul 16 17:23:47 2016 +0200
@@ -21,6 +21,9 @@
         var index = items.indexOf(this.get('player').get('item'));
         this.set('isFirst', index === 0);
         this.set('isLast', index === items.length - 1);
+        if(this.get('player').get('playing')) {
+            this.play();
+        }
     }),
 
     itemLoaded: Ember.observer('player.model.mediaList', function() {
@@ -84,12 +87,14 @@
 
         backward: function() {
             var index = this.get('player').get('items').indexOf(this.get('player').get('item'));
-            console.log('backward', index);
+            var item = this.get('player').get('items')[index - 1];
+            this.get('player').set('item', item);
         },
 
         forward: function() {
             var index = this.get('player').get('items').indexOf(this.get('player').get('item'));
-            console.log('forward', index);
+            var item = this.get('player').get('items')[index + 1];
+            this.get('player').set('item', item);
         }
 
     }
--- a/cms/app-client/app/components/playlist-component.js	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/components/playlist-component.js	Sat Jul 16 17:23:47 2016 +0200
@@ -38,7 +38,7 @@
         this.get('player').set('items', this.get('documents').map(function(document) {
             return document.get('id');
         }));
-        if(this.get('player').get('items').length) {
+        if(this.get('player').get('items').length && this.get('player').get('playing') === false) {
             this.get('player').set('item', this.get('player').get('items')[0]);    
         }
     }).on('init'),
--- a/cms/app-client/app/routes/tabs/thematiques.js	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/routes/tabs/thematiques.js	Sat Jul 16 17:23:47 2016 +0200
@@ -8,6 +8,10 @@
 
     themes: [],
 
+    all: Ember.computed(function() {
+        return this.store.findAll('theme');
+    }),
+
     model: Ember.observer('index', function() {
         var self = this;
         var promise = this.store.query('theme', {
@@ -26,6 +30,7 @@
 
     setupController: function(controller, model) {
         this._super(...arguments);
+        controller.set('all', this.get('all'));
         // Add ArrayProxy to template context.
         controller.set('themes', this.get('themes'));
     },
--- a/cms/app-client/app/styles/components/filtering-component.scss	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/styles/components/filtering-component.scss	Sat Jul 16 17:23:47 2016 +0200
@@ -39,7 +39,8 @@
 
 .filtering-component input::-moz-placeholder {
     line-height: 32px;
-    color: $light-white;
+    color: $dark-blue;
+    opacity: 1;
 }
 
 .filtering-component input:focus {
@@ -79,7 +80,7 @@
 }
 
 .filtering-component ul li:hover {
-    background-color: rgba(190,207,212,.5);
+    background-color: $light-blue;
 }
 
 
--- a/cms/app-client/app/templates/components/filtering-component.hbs	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/templates/components/filtering-component.hbs	Sat Jul 16 17:23:47 2016 +0200
@@ -1,7 +1,4 @@
-{{yield}}
-
 {{ input value=input type='text' placeholder='Rechercher une thématique' focus-in='focusIn'}}
-
 {{#if filteredThemes.length}}
 <ul class="filters{{if isDropdownOpen ' open'}}">
     {{#each filteredThemes as |theme|}}
--- a/cms/app-client/app/templates/components/sorting-component.hbs	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/templates/components/sorting-component.hbs	Sat Jul 16 17:23:47 2016 +0200
@@ -1,5 +1,3 @@
-{{yield}}
-
 <div class="options">
     Trier par :
     <ul>
--- a/cms/app-client/app/templates/tabs/thematiques.hbs	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/app/templates/tabs/thematiques.hbs	Sat Jul 16 17:23:47 2016 +0200
@@ -1,4 +1,4 @@
 <div id="tabs-thematiques">
-    {{ filtering-component themes=model }}
+    {{ filtering-component themes=all }}
     {{ sorting-component themes=model load='setIndexQueryparams' sort='setSortQueryparams' }}
 </div>
\ No newline at end of file
--- a/cms/app-client/mirage/serializers/theme.js	Wed Jul 13 09:21:09 2016 +0200
+++ b/cms/app-client/mirage/serializers/theme.js	Sat Jul 16 17:23:47 2016 +0200
@@ -22,10 +22,15 @@
                 return b.count - a.count;
             });
         }
-        var begin = parseInt(request.queryParams.index * request.queryParams.limit);
-        var end = parseInt(begin + (request.queryParams.limit - 1));
-        var slice = response.models.slice(begin, end);
-        return _(slice).map((theme) => { return [theme.id, {count: theme.count, label: theme.label}];}).object().value();
+        var array = [];
+        if(typeof request.queryParams.index !== 'undefined' && typeof request.queryParams.limit !== 'undefined') {
+            var begin = parseInt(request.queryParams.index * request.queryParams.limit) || 0;
+            var end = parseInt(begin + (request.queryParams.limit - 1));
+            array = response.models.slice(begin, end);
+        } else {
+            array = response.models;
+        }
+        return _(array).map((theme) => { return [theme.id, {count: theme.count, label: theme.label}];}).object().value();
     }
 
 });