Extract Duplicate component and move Bootstrap to require.
This commit is contained in:
parent
84a2048165
commit
98e686731e
4 changed files with 26 additions and 19 deletions
|
@ -5,6 +5,7 @@
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"main": "app.js",
|
"main": "app.js",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"bootstrap": "^3.3.6",
|
||||||
"browserify": "^6.2.0",
|
"browserify": "^6.2.0",
|
||||||
"cookie-parser": "1.3.2",
|
"cookie-parser": "1.3.2",
|
||||||
"dotenv": "^2.0.0",
|
"dotenv": "^2.0.0",
|
||||||
|
@ -24,6 +25,7 @@
|
||||||
"watchify": "^2.1.1"
|
"watchify": "^2.1.1"
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
"start": "watchify -o public/bundle.min.js -v -d public/script.jsx",
|
||||||
"postinstall": "browserify public/script.jsx | uglifyjs -cm > public/bundle.min.js"
|
"postinstall": "browserify public/script.jsx | uglifyjs -cm > public/bundle.min.js"
|
||||||
},
|
},
|
||||||
"browserify": {
|
"browserify": {
|
||||||
|
|
21
public/components/Duplicate.js
Normal file
21
public/components/Duplicate.js
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
'use strict';
|
||||||
|
var React = require('react');
|
||||||
|
var ReactBootstrap = require('react-bootstrap');
|
||||||
|
|
||||||
|
var Duplicate = React.createClass({
|
||||||
|
render: function () {
|
||||||
|
var ListGroupItem = ReactBootstrap.ListGroupItem;
|
||||||
|
var authors = "";
|
||||||
|
this.props.track.artists.forEach(function (item, index) {
|
||||||
|
if (index != 0) {
|
||||||
|
authors += ', ';
|
||||||
|
}
|
||||||
|
authors += item.name;
|
||||||
|
});
|
||||||
|
return (
|
||||||
|
<ListGroupItem>{this.props.track.name} - {authors}</ListGroupItem>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
module.exports = Duplicate;
|
|
@ -12,9 +12,6 @@
|
||||||
|
|
||||||
<div id="content"></div>
|
<div id="content"></div>
|
||||||
|
|
||||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
|
|
||||||
crossorigin="anonymous"></script>
|
|
||||||
<script type="text/javascript" src="bundle.min.js"></script>
|
<script type="text/javascript" src="bundle.min.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,9 +1,10 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
var $ = window.$ = window.jQuery = require('jquery');
|
||||||
|
require('bootstrap');
|
||||||
var React = require('react');
|
var React = require('react');
|
||||||
var ReactDOM = require('react-dom');
|
var ReactDOM = require('react-dom');
|
||||||
var ReactBootstrap = require('react-bootstrap');
|
var ReactBootstrap = require('react-bootstrap');
|
||||||
var $ = require('jquery');
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Obtains parameters from the hash of the URL
|
* Obtains parameters from the hash of the URL
|
||||||
|
@ -19,21 +20,7 @@ function getHashParams() {
|
||||||
return hashParams;
|
return hashParams;
|
||||||
}
|
}
|
||||||
|
|
||||||
var Duplicate = React.createClass({
|
var Duplicate = require('./components/Duplicate');
|
||||||
render: function () {
|
|
||||||
var ListGroupItem = ReactBootstrap.ListGroupItem;
|
|
||||||
var authors = "";
|
|
||||||
this.props.track.artists.forEach(function (item, index) {
|
|
||||||
if (index != 0) {
|
|
||||||
authors += ', ';
|
|
||||||
}
|
|
||||||
authors += item.name;
|
|
||||||
});
|
|
||||||
return (
|
|
||||||
<ListGroupItem>{this.props.track.name} - {authors}</ListGroupItem>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
var DuplicatesBox = React.createClass({
|
var DuplicatesBox = React.createClass({
|
||||||
render: function () {
|
render: function () {
|
||||||
|
|
Loading…
Reference in a new issue