|
|
@@ -23,6 +23,7 @@ export default class Player extends Component {
|
|
|
albumList: {key:'', albums: [], error: false, hasMore: false},
|
|
|
filters: {},
|
|
|
filter: '',
|
|
|
+ latest: false,
|
|
|
sound: {url: '', playStatus: Sound.status.STOPPED},
|
|
|
tracks: null,
|
|
|
activeTrack: -1,
|
|
|
@@ -32,11 +33,11 @@ export default class Player extends Component {
|
|
|
this.filterTimeout = null;
|
|
|
}
|
|
|
genAlbumListKey() {
|
|
|
- const {filter, filters} = this.state
|
|
|
- return `${filter}-${this.selects.map(({type}) => filters[type] ? filters[type].item : '').join('-')}`
|
|
|
+ const {filter, filters, latest} = this.state
|
|
|
+ return `${filter}-${this.selects.map(({type}) => filters[type] ? filters[type].item : '').join('-')}-${latest ? 'l' : '.'}`
|
|
|
}
|
|
|
loadAlbums = (page) => {
|
|
|
- const {filter, filters} = this.state
|
|
|
+ const {filter, filters, latest} = this.state
|
|
|
const limit = 15;
|
|
|
const offset = page * limit;
|
|
|
const params = {filter, offset, limit:(limit+1)};
|
|
|
@@ -46,6 +47,8 @@ export default class Player extends Component {
|
|
|
params[type] = filters[type].item;
|
|
|
}
|
|
|
}
|
|
|
+ if (latest) params['latest'] = 1;
|
|
|
+
|
|
|
return fetch(`/api/cat/album?${getQueryString(params)}`, fetchOpts)
|
|
|
.then(res => (res.ok ? res.json() : Promise.reject({message:res.statusText})))
|
|
|
.then(data => {
|
|
|
@@ -65,8 +68,8 @@ export default class Player extends Component {
|
|
|
this.loadAlbums(0)
|
|
|
}
|
|
|
componentDidUpdate(prevProps, prevState) {
|
|
|
- const {filters} = this.state;
|
|
|
- if (filters !== prevState.filters) {
|
|
|
+ const {filters, latest} = this.state;
|
|
|
+ if (filters !== prevState.filters || latest !== prevState.latest) {
|
|
|
this.loadAlbums(0);
|
|
|
}
|
|
|
if (this.state.activeAlbum !== prevState.activeAlbum) {
|
|
|
@@ -112,6 +115,9 @@ export default class Player extends Component {
|
|
|
}, 500);
|
|
|
this.setState({filter})
|
|
|
}
|
|
|
+ handleLatestChange = (e) => {
|
|
|
+ this.setState({latest: e.target.checked});
|
|
|
+ }
|
|
|
handleControlPrev = () => {
|
|
|
if (!Array.isArray(this.state.tracks)) {
|
|
|
return;
|
|
|
@@ -248,6 +254,13 @@ export default class Player extends Component {
|
|
|
placeholder="Search albums"
|
|
|
onChange={this.handleFilterChange} />
|
|
|
</div>
|
|
|
+ <div className="section">
|
|
|
+ <h3>Latest</h3>
|
|
|
+ <input className="Latest"
|
|
|
+ type="checkbox"
|
|
|
+ checked={this.state.latest}
|
|
|
+ onChange={this.handleLatestChange} />
|
|
|
+ </div>
|
|
|
</div><br style={{clear:'both'}} />
|
|
|
<Controls
|
|
|
visible={true}
|
|
|
@@ -261,7 +274,7 @@ export default class Player extends Component {
|
|
|
activeTrack={this.state.activeTrack}
|
|
|
onActivateTrack={this.handleActivateTrack} />
|
|
|
<AlbumList
|
|
|
- title="Albums"
|
|
|
+ title={this.state.latest ? "Latest albums" : "Albums"}
|
|
|
{...this.state.albumList}
|
|
|
loadMore={this.loadAlbums}
|
|
|
onPlayAlbum={this.handlePlayAlbum} />
|
