Playlists code refactor
This commit is contained in:
parent
e7ec62815f
commit
337c7cecae
2 changed files with 11 additions and 7 deletions
|
@ -20,7 +20,7 @@
|
|||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
|
||||
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/babel" src="./script.js"></script>
|
||||
<script type="text/babel" src="script.jsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
|
@ -60,25 +60,29 @@ var PlaylistBox = React.createClass({
|
|||
currentId: null
|
||||
};
|
||||
},
|
||||
clickOnItem: function (id, uid) {
|
||||
clickOnItem: function (id, uid, event) {
|
||||
event.preventDefault();
|
||||
this.setState({currentId: id});
|
||||
this.props.handleClick(id, uid);
|
||||
},
|
||||
render: function () {
|
||||
var ListGroup = ReactBootstrap.ListGroup;
|
||||
var ListGroup = ReactBootstrap.ListGroup,
|
||||
ListGroupItem = ReactBootstrap.ListGroupItem;
|
||||
var currentId = this.state.currentId;
|
||||
|
||||
var playlists = <p>No playlist found.</p>;
|
||||
if (this.props.playlists) {
|
||||
playlists = this.props.playlists.map(function (pl) {
|
||||
var id = pl.id;
|
||||
var classes = "list-group-item" + (currentId == id ? " active" : "");
|
||||
var classes = currentId == id ? "active" : "";
|
||||
return (
|
||||
<a onClick={this.clickOnItem.bind(this, id, pl.owner.id)} className={classes} key={id}>{pl.name}</a>
|
||||
<ListGroupItem href="#" onClick={this.clickOnItem.bind(this, id, pl.owner.id)} className={classes} key={id}>{pl.name}</ListGroupItem>
|
||||
);
|
||||
}, this);
|
||||
}
|
||||
|
||||
return (
|
||||
<ListGroup className="playListBox">
|
||||
<ListGroup>
|
||||
{playlists}
|
||||
</ListGroup>
|
||||
);
|
||||
|
@ -150,7 +154,7 @@ var DuplicateFinderBox = React.createClass({
|
|||
}
|
||||
|
||||
return (
|
||||
<Row className="duplicateFinderBox">
|
||||
<Row>
|
||||
<Col md={3} sm={4}>
|
||||
<h2>Playlists</h2>
|
||||
{playlistBox}
|
Loading…
Reference in a new issue