1 import Ember from 'ember'; |
1 import Ember from 'ember'; |
2 import _ from 'lodash/lodash'; |
2 import _ from 'lodash/lodash'; |
3 |
3 |
4 export default Ember.Route.extend({ |
4 export default Ember.Route.extend({ |
5 |
5 |
6 player: Ember.inject.service(), |
6 player: Ember.inject.service(), |
7 filter: Ember.inject.service(), |
7 filter: Ember.inject.service(), |
8 |
8 |
9 index: 0, |
9 index: 0, |
10 limit: 40, |
10 limit: 40, |
11 sort: 'alphabetical', |
11 sort: 'alphabetical', |
|
12 isFetching: false, |
12 |
13 |
13 themes: [], |
14 themes: null, |
|
15 total: 0, |
14 |
16 |
15 model: Ember.observer('index', function() { |
17 model() { |
16 var self = this; |
18 var filterQueryParams = _.clone(this.get('filter').get('queryParamsValues')); |
17 var filterQueryParams = _.clone(this.get('filter').get('queryParamsValues')); |
19 var promise = this.get('store').query('theme', _.merge(filterQueryParams, { |
18 var promise = this.store.query('theme', _.merge(filterQueryParams, { |
20 'limit': this.get('limit'), |
19 'limit': this.get('limit'), |
21 'index': this.get('index'), |
20 'index': this.get('index'), |
22 'sort': this.get('sort') |
21 'sort': this.get('sort') |
23 })); |
22 })); |
24 promise.then(response => { |
23 promise.then(function(value) { |
25 console.log("MODEL", response, response.get('content'), response.get('meta').total); |
24 if (self.get('themes').length) { |
26 this.set('themes', response.get('content')); |
25 value = self.get('themes').pushObjects(value.get('content')); |
27 this.set('total', response.get('meta').total); |
26 } |
28 }); |
27 self.set('themes', value); |
29 return promise; |
28 }); |
30 }, |
29 return promise; |
|
30 }), |
|
31 |
31 |
32 setupController: function(controller) { |
32 activate: function () { |
33 this._super(...arguments); |
33 this.get('player').set('window', false); |
34 controller.set('themes', this.get('themes')); |
34 }, |
|
35 |
|
36 actions: { |
|
37 |
|
38 loadMore: function() { |
|
39 if(this.get('isFetching') || (this.get('themes').length === this.get('total'))) { |
|
40 return; |
|
41 } |
|
42 this.set('isFetching', true); |
|
43 this.set('index', this.get('index') + 1); |
|
44 var filterQueryParams = _.clone(this.get('filter').get('queryParamsValues')); |
|
45 this.get('store').query('theme', _.merge(filterQueryParams, { |
|
46 'limit': this.get('limit'), |
|
47 'index': this.get('index'), |
|
48 'sort': this.get('sort') |
|
49 })).then(response => { // success |
|
50 this.get('themes').pushObjects(response.get('content')); |
|
51 this.set('isFetching', false); |
|
52 }, () => { // fail |
|
53 this.set('isFetching', false); |
|
54 }); |
35 }, |
55 }, |
36 |
56 |
37 deactivate: function () { |
57 resetIndexQueryParams: function () { |
38 this.set('themes', []); |
58 this.set('index', 0); |
|
59 this.refresh(); |
39 }, |
60 }, |
40 |
61 |
41 activate: function() { |
62 setSortQueryparams: function (sort) { |
42 this.get('player').set('window', false); |
63 this.set('sort', sort); |
43 }, |
64 this.set('index', 0); |
44 |
65 this.refresh(); |
45 actions: { |
|
46 |
|
47 setIndexQueryparams: function() { |
|
48 this.set('index', this.get('index') + 1); |
|
49 }, |
|
50 |
|
51 setSortQueryparams: function(sort) { |
|
52 this.set('sort', sort); |
|
53 this.get('themes').get('content').clear(); |
|
54 if(this.get('index') === 0) { |
|
55 // Force property reset to trigger request |
|
56 this.propertyWillChange('index'); |
|
57 this.set('index', 0); |
|
58 this.propertyDidChange('index'); |
|
59 } else { |
|
60 this.set('index', 0); |
|
61 } |
|
62 } |
|
63 |
|
64 } |
66 } |
65 |
67 |
|
68 } |
|
69 |
66 }); |
70 }); |