gaugendre/DAVIDS
1
0
Fork 0
Code Issues Pull requests Releases Activity

Prevent users from querying playlists while fetching data

Browse source
This commit is contained in:
Gabriel Augendre 2016-04-25 21:05:21 +02:00
parent 5deb596169
commit ab74cc77c3
No known key found for this signature in database
GPG key ID: D2B6A5B41FC438B1
3 changed files with 21 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/public/components/duplicate-finder-box.js
View file

@ -13,7 +13,8 @@ var DuplicateFinderBox = React.createClass({
currentUId: null,
dups: null,
dupsLoading: false,
clicked: false
clicked: false,
title: null
};
},
componentWillReceiveProps: function () {
@ -21,12 +22,13 @@ var DuplicateFinderBox = React.createClass({
clicked: false
});
},
handlePlaylistClick: function (id, uid) {
handlePlaylistClick: function (id, uid, title) {
this.setState({
currentId: id,
currentUId: uid,
dupsLoading: true,
clicked: true
clicked: true,
title: title
});
var self = this;
@ -59,7 +61,7 @@ var DuplicateFinderBox = React.createClass({
}
duplicates = (
<Col md={9} sm={8}>
<h2>Duplicates</h2>
<h2>Duplicates in {this.state.title}</h2>
{duplicates}
</Col>
)
@ -67,7 +69,7 @@ var DuplicateFinderBox = React.createClass({
var playlistBox = <p>Loading...</p>;
if (!this.props.playlistsLoading) {
playlistBox = <PlaylistBox handleClick={this.handlePlaylistClick} playlists={this.props.playlists}/>;
playlistBox = <PlaylistBox handleClick={this.handlePlaylistClick} dupsLoading={this.state.dupsLoading} playlists={this.props.playlists}/>;
}
return (

16
src/public/components/playlist-box.js
View file

@ -10,8 +10,10 @@ var PlaylistBox = React.createClass({
},
clickOnItem: function (id, uid, event) {
event.preventDefault();
this.setState({currentId: id});
this.props.handleClick(id, uid);
if (!this.props.dupsLoading) {
this.setState({currentId: id});
this.props.handleClick(id, uid);
}
},
render: function () {
var ListGroup = ReactBootstrap.ListGroup,
@ -22,8 +24,16 @@ var PlaylistBox = React.createClass({
if (this.props.playlists) {
playlists = this.props.playlists.map(function (pl) {
var id = pl.id;
var active = currentId == id;
var classes = this.props.dupsLoading ? "disabled" : "";
return (
<ListGroupItem href="#" onClick={this.clickOnItem.bind(this, id, pl.owner.id)} active={currentId == id} key={id}>{pl.name}</ListGroupItem>
<ListGroupItem href="#"
onClick={this.clickOnItem.bind(this, id, pl.owner.id)}
className={classes}
active={active}
key={id}>
{pl.name}
</ListGroupItem>
);
}, this);
}

2
src/public/index.html
View file

@ -2,7 +2,7 @@
<html>
<head>
<title>DAVIDS &bull; DuplicAtes VIewer and Detector for Spotify</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css">
<link rel="stylesheet" href="style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
</head>