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

Playlists code refactor

Browse source
This commit is contained in:
Gabriel Augendre 2016-04-22 17:52:59 +02:00
parent e7ec62815f
commit 337c7cecae
2 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/index.html
View file

@ -20,7 +20,7 @@
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script type="text/babel" src="./script.js"></script> <script type="text/babel" src="script.jsx"></script>
</body> </body>
</html> </html>

16
public/script.js → public/script.jsx
View file

@ -60,25 +60,29 @@ var PlaylistBox = React.createClass({
currentId: null currentId: null
}; };
}, },
clickOnItem: function (id, uid) { clickOnItem: function (id, uid, event) {
event.preventDefault();
this.setState({currentId: id}); this.setState({currentId: id});
this.props.handleClick(id, uid); this.props.handleClick(id, uid);
}, },
render: function () { render: function () {
var ListGroup = ReactBootstrap.ListGroup; var ListGroup = ReactBootstrap.ListGroup,
ListGroupItem = ReactBootstrap.ListGroupItem;
var currentId = this.state.currentId; var currentId = this.state.currentId;
var playlists = <p>No playlist found.</p>; var playlists = <p>No playlist found.</p>;
if (this.props.playlists) { if (this.props.playlists) {
playlists = this.props.playlists.map(function (pl) { playlists = this.props.playlists.map(function (pl) {
var id = pl.id; var id = pl.id;
var classes = "list-group-item" + (currentId == id ? " active" : ""); var classes = currentId == id ? "active" : "";
return ( 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); }, this);
} }
return ( return (
<ListGroup className="playListBox"> <ListGroup>
{playlists} {playlists}
</ListGroup> </ListGroup>
); );
@ -150,7 +154,7 @@ var DuplicateFinderBox = React.createClass({
} }
return ( return (
<Row className="duplicateFinderBox"> <Row>
<Col md={3} sm={4}> <Col md={3} sm={4}>
<h2>Playlists</h2> <h2>Playlists</h2>
{playlistBox} {playlistBox}