Fix linting, and errors

.eslintrc

@@ -109,7 +109,6 @@
     "quote-props": ["warn", "consistent-as-needed"],
     "quotes": ["error", "single", "avoid-escape"],
     "radix": "error",
-    "react/jsx-wrap-multilines": "error",
     "react/no-string-refs": "error",
     "react/jsx-boolean-value": "error",
     "react/jsx-closing-bracket-location": ["error", "line-aligned"],
@@ -117,7 +116,6 @@
     "react/jsx-equals-spacing": "error",
     "react/jsx-first-prop-new-line": ["error", "multiline"],
     "react/jsx-indent": ["error", 2],
-    "react/jsx-no-bind": "error",
     "react/jsx-uses-react": "error",
     "react/jsx-uses-vars": "error",
     "react/prefer-stateless-function": "error",

js/components/Character.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 module.exports = (props) => {
-  const char = '' + props.children;
+  const char = `${props.children}`;
   const className = `character character-${char.toLowerCase().charCodeAt(0)}`;
   return <div {...props} className={className}>{props.children}</div>;
 };

js/components/CharacterString.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import Character from './Character.jsx';
 
 module.exports = (props) => {
-  const text = '' + props.children;
+  const text = `${props.children}`;
   const chars = text.split('');
   return <div {...props}>
     {chars.map((character, index) => {

js/components/EqGraph.jsx

@@ -19,10 +19,10 @@ class EqGraph extends React.Component {
   }
 
   componentDidMount() {
-    this.canvasCtx = this.refs.canvas.getContext('2d');
+    this.canvasCtx = this.canvas.getContext('2d');
     this.canvasCtx.imageSmoothingEnabled = false;
-    this.width = this.refs.canvas.width * 1; // Cast to int
-    this.height = this.refs.canvas.height * 1; // Cast to int
+    this.width = this.canvas.width * 1; // Cast to int
+    this.height = this.canvas.height * 1; // Cast to int
   }
 
   componentDidUpdate() {
@@ -113,7 +113,7 @@ class EqGraph extends React.Component {
   render() {
     return <canvas
       id='eqGraph'
-      ref='canvas'
+      ref={(node) => this.canvas = node}
       width='152'
       height='32'
     />;

js/components/MainWindow.jsx

@@ -9,7 +9,7 @@ import Balance from './Balance.jsx';
 import Close from './Close.jsx';
 import ClutterBar from './ClutterBar.jsx';
 import ContextMenu from './ContextMenu.jsx';
-import DragTarget from './DragTarget.jsx';
+//import DragTarget from './DragTarget.jsx';
 import Eject from './Eject.jsx';
 import EqToggleButton from './EqToggleButton.jsx';
 import Kbps from './Kbps.jsx';
@@ -34,7 +34,7 @@ export class MainWindow extends React.Component {
     this.handleDrop = this.handleDrop.bind(this);
   }
 
-  handleClick(e) {
+  handleClick() {
     this.props.dispatch({type: 'SET_FOCUSED_WINDOW', window: WINDOWS.MAIN});
   }
 

js/components/Visualizer.jsx

@@ -22,10 +22,10 @@ class Visualizer extends React.Component {
   }
 
   componentDidMount() {
-    this.canvasCtx = this.refs.canvas.getContext('2d');
+    this.canvasCtx = this.canvas.getContext('2d');
     this.canvasCtx.imageSmoothingEnabled = false;
-    this.width = this.refs.canvas.width * 1; // Cast to int
-    this.height = this.refs.canvas.height * 1; // Cast to int
+    this.width = this.canvas.width * 1; // Cast to int
+    this.height = this.canvas.height * 1; // Cast to int
 
     // Off-screen canvas for pre-rendering the background
     this.bgCanvas = document.createElement('canvas');
@@ -189,7 +189,7 @@ class Visualizer extends React.Component {
     // TODO: Don't rerender DOM on style updates
     return <canvas
       id='visualizer'
-      ref='canvas'
+      ref={(node) => this.canvas = node}
       width='152'
       height='32'
       onClick={this.handleClick}

package.json

@@ -4,7 +4,7 @@
   "description": "Winamp 2 implemented in HTML5 and JavaScript",
   "main": "index.html",
   "scripts": {
-    "lint": "eslint js/*.js js/*.jsx .",
+    "lint": "eslint --ext js,jsx .",
     "build": "webpack --config=webpack.production.config.js",
     "serve": "webpack-dev-server",
     "weight": "npm run build && gzip-size built/winamp.js | pretty-bytes",