fix a ton of eslint errors

.eslintrc

@@ -12,6 +12,34 @@
     "classes": true
   },
   "rules": {
-  	
+  	"react/no-multi-comp": 0,
+    "import/default": 0,
+    "import/no-duplicates": 0,
+    "import/named": 0,
+    "import/namespace": 0,
+    "import/no-unresolved": 0,
+    "import/no-named-as-default": 2,
+    "comma-dangle": 0,  // not sure why airbnb turned this on. gross!
+    "indent": [2, 2, {"SwitchCase": 1}],
+    "no-console": 0,
+    "no-alert": 0,
+    "no-underscore-dangle": 0,
+    "max-len": [1, 120, 4],
+  },
+  "plugins": [
+    "react", "import"
+  ], 
+  "settings": {
+    "import/parser": "babel-eslint",
+    "import/resolve": {
+      "moduleDirectory": ["node_modules"]
+    }
+  },
+  "globals": {
+    "__DEVELOPMENT__": true,
+    "__CLIENT__": true,
+    "__SERVER__": true,
+    "__DISABLE_SSR__": true,
+    "__DEVTOOLS__": true
   }
 }

client/components/Nav.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import { Link } from 'react-router';
+
+class Nav extends React.Component {
+  render() {
+    return (
+      <nav className="nav">
+        <ul className="nav__items-left">
+          <li className="nav__item">
+            <p
+              className="nav__new"
+              onClick={this.props.createProject}
+            >
+              New
+            </p>
+          </li>
+          <li className="nav__item">
+            <p
+              className="nav__save"
+              onClick={this.props.saveProject}
+            >
+              Save
+            </p>
+          </li>
+        </ul>
+        <ul className="nav__items-right">
+          <li className="nav__item">
+            {this.props.user.authenticated && <p>Hello, {this.props.user.username}!</p>}
+            {!this.props.user.authenticated && <p><Link to='/login'>Login</Link> or <Link to='/signup'>Sign Up</Link></p>}
+          </li>
+        </ul>
+      </nav>
+    );
+  }
+}
+
+export default Nav;

client/components/Nav.jsx

@@ -1,33 +0,0 @@
-import React from 'react'
-import { Link } from 'react-router'
-
-class Nav extends React.Component {
-	render() {
-		return (
-			<nav className="nav">
-				<ul className="nav__items-left">
-					<li className="nav__item">
-						<p className="nav__new"
-							 onClick={this.props.createProject}>
-							New
-						</p>
-					</li>
-					<li className="nav__item">
-						<p className="nav__save"
-								onClick={this.props.saveProject}>
-								Save
-						</p>
-					</li>
-				</ul>
-				<ul className="nav__items-right">
-					<li className="nav__item">
-						{this.props.user.authenticated && <p>Hello, {this.props.user.username}!</p>}
-						{!this.props.user.authenticated && <p><Link to={`/login`}>Login</Link> or <Link to={`/signup`}>Sign Up</Link></p>}
-					</li>
-				</ul>
-			</nav>
-		);
-	}
-}
-
-export default Nav;

client/constants.js

@@ -22,5 +22,5 @@ export const NEW_PROJECT = 'NEW_PROJECT';
 
 export const SET_PROJECT = 'SET_PROJECT';
 
-//eventually, handle errors more specifically and better
+// eventually, handle errors more specifically and better
 export const ERROR = 'ERROR';

client/modules/App/App.js

@@ -5,19 +5,18 @@ import DevTools from './components/DevTools';
 class App extends React.Component {
   constructor(props, context) {
     super(props, context);
-    this.state = {isMounted: false};
+    this.state = { isMounted: false };
   }
 
   componentDidMount() {
-    this.setState({isMounted: true});
+    this.setState({ isMounted: true });
   }
 
   render() {
-    debugger;
     return (
       <div className="app">
         {this.state.isMounted && !window.devToolsExtension && process.env.NODE_ENV === 'development' && <DevTools />}
-        { this.props.children }
+        {this.props.children}
       </div>
     );
   }

client/modules/IDE/actions/files.js

@@ -3,7 +3,7 @@ import * as ActionTypes from '../../../constants';
 export function updateFile(name, content) {
   return {
     type: ActionTypes.CHANGE_SELECTED_FILE,
-		name: name,
+    name,
-		content: content
+    content
-	}
+  };
 }

client/modules/IDE/actions/ide.js

@@ -3,17 +3,17 @@ import * as ActionTypes from '../../../constants';
 export function toggleSketch() {
   return {
     type: ActionTypes.TOGGLE_SKETCH
-	}
+  };
 }
 
 export function startSketch() {
   return {
     type: ActionTypes.START_SKETCH
-	}
+  };
 }
 
 export function stopSketch() {
   return {
     type: ActionTypes.STOP_SKETCH
-	}
+  };
 }

client/modules/IDE/actions/preferences.js

@@ -3,23 +3,23 @@ import * as ActionTypes from '../../../constants';
 export function openPreferences() {
   return {
     type: ActionTypes.OPEN_PREFERENCES
-	}
+  };
 }
 
 export function closePreferences() {
   return {
     type: ActionTypes.CLOSE_PREFERENCES
-	}
+  };
 }
 
 export function increaseFont() {
   return {
     type: ActionTypes.INCREASE_FONTSIZE
-	}
+  };
 }
 
 export function decreaseFont() {
   return {
     type: ActionTypes.DECREASE_FONTSIZE
-	}
+  };
 }

client/modules/IDE/actions/project.js

@@ -1,54 +1,54 @@
 import * as ActionTypes from '../../../constants';
-import { browserHistory } from 'react-router'
+import { browserHistory } from 'react-router';
-import axios from 'axios'
+import axios from 'axios';
 
 const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
 
 export function getProject(id) {
-	return function(dispatch) {
+  return (dispatch) => {
-		axios.get(`${ROOT_URL}/projects/${id}`, {withCredentials: true})
+    axios.get(`${ROOT_URL}/projects/${id}`, { withCredentials: true })
       .then(response => {
         browserHistory.push(`/projects/${id}`);
         dispatch({
           type: ActionTypes.SET_PROJECT_NAME,
           project: response.data
-				})
+        });
       })
       .catch(response => dispatch({
-				type: ActionTypes.ERROR
+        type: ActionTypes.ERROR,
+        error: response.data
       }));
-	}
+  };
 }
 
 export function setProjectName(event) {
-	var name = event.target.textContent;
+  const name = event.target.textContent;
   return {
     type: ActionTypes.SET_PROJECT_NAME,
-		name: name
+    name
-	}
+  };
 }
 
 export function saveProject() {
-	return function(dispatch, getState) {
+  return (dispatch, getState) => {
-		var state = getState();
+    const state = getState();
-		var formParams = Object.assign({}, state.project);
+    const formParams = Object.assign({}, state.project);
     formParams.file = state.file;
-		debugger;
     if (state.id) {
-			axios.put(`${ROOT_URL}/projects/${state.id}`, formParams, {withCredentials: true})
+      axios.put(`${ROOT_URL}/projects/${state.id}`, formParams, { withCredentials: true })
-				.then(response => {
+        .then(() => {
           dispatch({
             type: ActionTypes.PROJECT_SAVE_SUCCESS
           })
-					.catch(response => dispatch({
+          .catch((response) => dispatch({
-						type: ActionTypes.PROJECT_SAVE_FAIL
+            type: ActionTypes.PROJECT_SAVE_FAIL,
+            error: response.data
           }));
-				})
+        });
-		}
+    } else {
-		else {
+      axios.post(`${ROOT_URL}/projects`, formParams, { withCredentials: true })
-			axios.post(`${ROOT_URL}/projects`, formParams, {withCredentials: true})
         .then(response => {
-					browserHistory.push('/projects/' + response.data.id);
+          browserHistory.push(`/projects/${response.data.id}`);
           dispatch({
             type: ActionTypes.NEW_PROJECT,
             name: response.data.name,
@@ -60,18 +60,19 @@ export function saveProject() {
           });
         })
         .catch(response => dispatch({
-					type: ActionTypes.PROJECT_SAVE_FAIL
+          type: ActionTypes.PROJECT_SAVE_FAIL,
+          error: response.data
         }));
     }
-	}
+  };
 }
 
 
 export function createProject() {
-	return function(dispatch) {
+  return (dispatch) => {
-		axios.post(`${ROOT_URL}/projects`, {}, {withCredentials: true})
+    axios.post(`${ROOT_URL}/projects`, {}, { withCredentials: true })
       .then(response => {
-				browserHistory.push('/projects/' + response.data.id);
+        browserHistory.push(`/projects/${response.data.id}`);
         dispatch({
           type: ActionTypes.NEW_PROJECT,
           name: response.data.name,
@@ -83,7 +84,8 @@ export function createProject() {
         });
       })
       .catch(response => dispatch({
-				type: ActionTypes.PROJECT_SAVE_FAIL
+        type: ActionTypes.PROJECT_SAVE_FAIL,
+        error: response.data
       }));
-	}
+  };
 }

client/modules/IDE/components/Editor.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import CodeMirror from 'codemirror';
+import 'codemirror/mode/javascript/javascript';
+import 'codemirror/addon/selection/active-line';
+
+class Editor extends React.Component {
+
+  componentDidMount() {
+    this._cm = CodeMirror(this.refs.container, { // eslint-disable-line
+      theme: 'p5-widget',
+      value: this.props.content,
+      lineNumbers: true,
+      styleActiveLine: true,
+      mode: 'javascript'
+    });
+    this._cm.on('change', () => { // eslint-disable-line
+      this.props.updateFile('sketch.js', this._cm.getValue());
+    });
+    this._cm.getWrapperElement().style['font-size'] = `${this.props.fontSize}px`;
+  }
+
+  componentDidUpdate(prevProps) {
+    if (this.props.content !== prevProps.content &&
+        this.props.content !== this._cm.getValue()) {
+      this._cm.setValue(this.props.content); // eslint-disable-line no-underscore-dangle
+    }
+    if (this.props.fontSize !== prevProps.fontSize) {
+      this._cm.getWrapperElement().style['font-size'] = `${this.props.fontSize}px`;
+    }
+  }
+
+  componentWillUnmount() {
+    this._cm = null;
+  }
+
+  _cm: CodeMirror.Editor
+
+  render() {
+    return <div ref="container" className="editor-holder"></div>;
+  }
+}
+
+export default Editor;

client/modules/IDE/components/Editor.jsx

@@ -1,42 +0,0 @@
-import React from 'react';
-import CodeMirror from 'codemirror';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/addon/selection/active-line'
-
-class Editor extends React.Component {
-  _cm: CodeMirror.Editor
-
-	componentDidMount() {
-		this._cm = CodeMirror(this.refs.container, {
-      theme: 'p5-widget',
-      value: this.props.content,
-      lineNumbers: true,
-      styleActiveLine: true,
-      mode: 'javascript'
-    });
-    this._cm.on('change', () => {
-      this.props.updateFile("sketch.js", this._cm.getValue());
-    });
-		this._cm.getWrapperElement().style['font-size'] = this.props.fontSize+'px';
-	}
-
-	componentDidUpdate(prevProps) {
-		if (this.props.content !== prevProps.content &&
-        this.props.content !== this._cm.getValue()) {
-      this._cm.setValue(this.props.content);
-    }
-		if (this.props.fontSize !== prevProps.fontSize) {
-			this._cm.getWrapperElement().style['font-size'] = this.props.fontSize+'px';
-		}
-	}
-
-	componentWillUnmount() {
-		this._cm = null;
-	}
-
-	render() {
-		return <div ref="container" className="editor-holder"></div>;
-	}
-}
-
-export default Editor;

client/modules/IDE/components/Preferences.js

@@ -0,0 +1,38 @@
+import React from 'react';
+
+const Isvg = require('react-inlinesvg');
+const exitUrl = require('../../../images/exit.svg');
+const plusUrl = require('../../../images/plus.svg');
+const minusUrl = require('../../../images/minus.svg');
+const classNames = require('classnames');
+
+class Preferences extends React.Component {
+  render() {
+    const preferencesContainerClass = classNames({
+      preferences: true,
+      'preferences--selected': this.props.isVisible
+    });
+    return (
+      <div className={preferencesContainerClass} tabIndex="0">
+        <div className="preferences__heading">
+          <h2 className="preferences__title">Preferences</h2>
+          <button className="preferences__exit-button" onClick={this.props.closePreferences}>
+            <Isvg src={exitUrl} alt="Exit Preferences" />
+          </button>
+        </div>
+        <div className="preference">
+          <h3 className="preference__title">Text Size</h3>
+          <button className="preference__plus-button" onClick={this.props.decreaseFont}>
+            <Isvg src={minusUrl} alt="Decrease Font Size" />
+          </button>
+          <p className="preference__value">{this.props.fontSize}</p>
+          <button className="preference__minus-button" onClick={this.props.increaseFont}>
+            <Isvg src={plusUrl} alt="Increase Font Size" />
+          </button>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default Preferences;

client/modules/IDE/components/Preferences.jsx

@@ -1,38 +0,0 @@
-import React from 'react';
-
-var Isvg = require('react-inlinesvg');
-var exitUrl = require('../../../images/exit.svg');
-var plusUrl = require('../../../images/plus.svg');
-var minusUrl = require('../../../images/minus.svg');
-var classNames = require('classnames');
-
-class Preferences extends React.Component {
-	render() {
-		let preferencesContainerClass = classNames({
-			"preferences": true,
-			"preferences--selected": this.props.isVisible
-		});
-		return (
-			<div className={preferencesContainerClass} tabindex="0">
-				<div className="preferences__heading">
-					<h2 className="preferences__title">Preferences</h2>
-					<button className="preferences__exit-button" onClick={this.props.closePreferences}>
-						<Isvg src={exitUrl} alt="Exit Preferences" />
-					</button>
-				</div>
-				<div className="preference">
-					<h3 className="preference__title">Text Size</h3>
-						<button className="preference__plus-button" onClick={this.props.decreaseFont}>
-							<Isvg src={minusUrl} alt="Decrease Font Size" />
-						</button>
-						<p className="preference__value">{this.props.fontSize}</p>
-						<button className="preference__minus-button" onClick={this.props.increaseFont}>
-							<Isvg src={plusUrl} alt="Increase Font Size" />
-						</button>
-				</div>
-			</div>
-		);
-	}
-}
-
-export default Preferences;

client/modules/IDE/components/Preview.js

@@ -0,0 +1,20 @@
+import React from 'react';
+
+class Preview extends React.Component {
+  componentDidMount() {
+
+  }
+
+  render() {
+    return (
+      <div>
+        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.0/p5.min.js"></script>
+        <script type="text/javascript">
+          {this.props.content}
+        </script>
+      </div>
+    );
+  }
+}
+
+export default Preview;

client/modules/IDE/components/Preview.jsx

@@ -1,21 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-
-class Preview extends React.Component {
-	componentDidMount() {
-		console.log(ReactDOM.findDOMNode(this));
-	}
-
-	render() {
-		return (
-			<div>
-				<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.0/p5.min.js"></script>
-				<script type="text/javascript">
-					{this.props.content}
-				</script>
-			</div>
-		);
-	}
-}
-
-export default Preview;

client/modules/IDE/components/PreviewFrame.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
+class PreviewFrame extends React.Component {
+
+  componentDidMount() {
+    if (this.props.isPlaying) {
+      this.renderFrameContents();
+    }
+  }
+
+  clearPreview() {
+    const doc = ReactDOM.findDOMNode(this).contentDocument;
+    doc.write('');
+    doc.close();
+  }
+
+  renderFrameContents() {
+    const doc = ReactDOM.findDOMNode(this).contentDocument;
+    if (doc.readyState === 'complete') {
+      renderSketch();
+    } else {
+      setTimeout(this.renderFrameContents, 0);
+    }
+  }
+
+  renderSketch() {
+    const doc = ReactDOM.findDOMNode(this).contentDocument;
+    this.clearPreview();
+    ReactDOM.render(this.props.head, doc.head);
+    const p5Script = doc.createElement('script');
+    p5Script.setAttribute('src', 'https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.0/p5.min.js');
+    doc.body.appendChild(p5Script);
+
+    const sketchScript = doc.createElement('script');
+    sketchScript.textContent = this.props.content;
+    doc.body.appendChild(sketchScript);
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    if (this.props.isPlaying !== prevProps.isPlaying) {
+      if (this.props.isPlaying) {
+        this.renderSketch();
+      } else {
+        this.clearPreview();
+      }
+    }
+
+    if (this.props.isPlaying && this.props.content !== prevProps.content) {
+      this.renderSketch();
+    }
+  }
+
+  componentWillUnmount() {
+    ReactDOM.unmountComponentAtNode(ReactDOM.findDOMNode(this).contentDocument.body);
+  }
+
+  render() {
+    return <iframe
+      className="preview-frame"
+      frameBorder="0"
+      sandbox="allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-modals allow-forms"
+      title="sketch output"></iframe>;
+  }
+}
+
+export default PreviewFrame;

client/modules/IDE/components/PreviewFrame.jsx

@@ -1,64 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-
-class PreviewFrame extends React.Component {
-
-	componentDidMount() {
-		if (this.props.isPlaying) {
-			this.renderFrameContents();
-		}
-	}
-
-	renderFrameContents() {
-		let doc = ReactDOM.findDOMNode(this).contentDocument;
-    if(doc.readyState === 'complete') {
-    	renderSketch();
-    } else {
-       setTimeout(this.renderFrameContents, 0);
-    }
-	}
-
-	renderSketch() {
-		let doc = ReactDOM.findDOMNode(this).contentDocument;
-		this.clearPreview();
-		ReactDOM.render(this.props.head, doc.head);
-		let p5Script = doc.createElement('script');
-		p5Script.setAttribute('src', 'https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.0/p5.min.js');
-		doc.body.appendChild(p5Script);
-
-		let sketchScript = doc.createElement('script');
-		sketchScript.textContent = this.props.content;
-		doc.body.appendChild(sketchScript);
-	}
-
-	clearPreview() {
-		let doc = ReactDOM.findDOMNode(this).contentDocument;
-		doc.write('');
-		doc.close();
-	}
-
-	componentDidUpdate(prevProps, prevState) {
-		if (this.props.isPlaying != prevProps.isPlaying) {
-			if (this.props.isPlaying) {
-				this.renderSketch();
-			}
-			else {
-				this.clearPreview();
-			}
-		}
-
-		if (this.props.isPlaying && this.props.content != prevProps.content) {
-			this.renderSketch();
-		}
-	}
-
-	componentWillUnmount() {
-		ReactDOM.unmountComponentAtNode(ReactDOM.findDOMNode(this).contentDocument.body);
-	}
-
-	render() {
-    return <iframe className="preview-frame" frameBorder="0" sandbox="allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-modals allow-forms" title="sketch output"></iframe>;
-  }
-}
-
-export default PreviewFrame;

client/modules/IDE/components/Toolbar.js

@@ -0,0 +1,52 @@
+import React from 'react';
+
+const Isvg = require('react-inlinesvg');
+const playUrl = require('../../../images/play.svg');
+const logoUrl = require('../../../images/p5js-logo.svg');
+const stopUrl = require('../../../images/stop.svg');
+const preferencesUrl = require('../../../images/preferences.svg');
+const classNames = require('classnames');
+
+class Toolbar extends React.Component {
+  render() {
+    let playButtonClass = classNames({
+      'toolbar__play-button': true,
+      'toolbar__play-button--selected': this.props.isPlaying
+    });
+    let stopButtonClass = classNames({
+      'toolbar__stop-button': true,
+      'toolbar__stop-button--selected': !this.props.isPlaying
+    });
+    let preferencesButtonClass = classNames({
+      'toolbar__preferences-button': true,
+      'toolbar__preferences-button--selected': this.props.isPreferencesVisible
+    });
+
+    return (
+      <div className="toolbar">
+        <img className="toolbar__logo" src={logoUrl} alt="p5js Logo" />
+        <button className={playButtonClass} onClick={this.props.startSketch}>
+          <Isvg src={playUrl} alt="Play Sketch" />
+        </button>
+        <button className={stopButtonClass} onClick={this.props.stopSketch}>
+          <Isvg src={stopUrl} alt="Stop Sketch" />
+        </button>
+        <div className="toolbar__project-name-container">
+          <span
+            className="toolbar__project-name"
+            onBlur={this.props.setProjectName.bind(this)}
+            contentEditable
+            suppressContentEditableWarning
+          >
+            {this.props.projectName}
+          </span>
+        </div>
+        <button className={preferencesButtonClass} onClick={this.props.openPreferences}>
+          <Isvg src={preferencesUrl} alt="Show Preferences" />
+        </button>
+      </div>
+    );
+  }
+}
+
+export default Toolbar;

client/modules/IDE/components/Toolbar.jsx

@@ -1,50 +0,0 @@
-import React from 'react';
-
-var Isvg = require('react-inlinesvg');
-var playUrl = require('../../../images/play.svg');
-var logoUrl = require('../../../images/p5js-logo.svg');
-var stopUrl = require('../../../images/stop.svg');
-var preferencesUrl = require('../../../images/preferences.svg');
-var classNames = require('classnames');
-
-class Toolbar extends React.Component {
-	render() {
-		let playButtonClass = classNames({
-			"toolbar__play-button": true,
-			"toolbar__play-button--selected": this.props.isPlaying
-		});
-		let stopButtonClass = classNames({
-			"toolbar__stop-button": true,
-			"toolbar__stop-button--selected": !this.props.isPlaying
-		});
-		let preferencesButtonClass = classNames({
-			"toolbar__preferences-button": true,
-			"toolbar__preferences-button--selected": this.props.isPreferencesVisible
-		});
-
-		return (
-			<div className="toolbar">
-				<img className="toolbar__logo" src={logoUrl} alt="p5js Logo"/>
-				<button className={playButtonClass} onClick={this.props.startSketch}>
-					<Isvg src={playUrl} alt="Play Sketch" />
-				</button>
-				<button className={stopButtonClass} onClick={this.props.stopSketch}>
-					<Isvg src={stopUrl} alt="Stop Sketch" />
-				</button>
-				<div className="toolbar__project-name-container">
-					<span className="toolbar__project-name"
-								onBlur={this.props.setProjectName.bind(this)}
-								contentEditable={true}
-								suppressContentEditableWarning={true}>
-								{this.props.projectName}
-					</span>
-				</div>
-				<button className={preferencesButtonClass} onClick={this.props.openPreferences}>
-					<Isvg src={preferencesUrl} alt="Show Preferences" />
-				</button>
-			</div>
-		);
-	}
-}
-
-export default Toolbar;

client/modules/IDE/pages/IDEView.js

@@ -0,0 +1,83 @@
+import React from 'react';
+import Editor from '../components/Editor';
+import PreviewFrame from '../components/PreviewFrame';
+import Toolbar from '../components/Toolbar';
+import Preferences from '../components/Preferences';
+import Nav from '../../../components/Nav';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import * as FileActions from '../actions/files';
+import * as IDEActions from '../actions/ide';
+import * as PreferencesActions from '../actions/preferences';
+import * as ProjectActions from '../actions/project';
+
+class IDEView extends React.Component {
+  componentDidMount() {
+    if (this.props.params.project_id) {
+      const id = this.props.params.project_id;
+      this.props.getProject(id);
+    }
+  }
+
+  render() {
+    return (
+      <div className="ide">
+        <Nav
+          user={this.props.user}
+          createProject={this.props.createProject}
+          saveProject={this.props.saveProject}
+        />
+        <Toolbar
+          className="Toolbar"
+          isPlaying={this.props.ide.isPlaying}
+          startSketch={this.props.startSketch}
+          stopSketch={this.props.stopSketch}
+          projectName={this.props.project.name}
+          setProjectName={this.props.setProjectName}
+          openPreferences={this.props.openPreferences}
+          isPreferencesVisible={this.props.preferences.isVisible}
+        />
+        <Preferences
+          isVisible={this.props.preferences.isVisible}
+          closePreferences={this.props.closePreferences}
+          increaseFont={this.props.increaseFont}
+          decreaseFont={this.props.decreaseFont}
+          fontSize={this.props.preferences.fontSize}
+        />
+        <Editor
+          content={this.props.file.content}
+          updateFile={this.props.updateFile}
+          fontSize={this.props.preferences.fontSize}
+        />
+        <PreviewFrame
+          content={this.props.file.content}
+          head={
+            <link type="text/css" rel="stylesheet" href="/preview-styles.css" />
+          }
+          isPlaying={this.props.ide.isPlaying}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state) {
+  return {
+    file: state.file,
+    ide: state.ide,
+    preferences: state.preferences,
+    user: state.user,
+    project: state.project
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return bindActionCreators(Object.assign({},
+    FileActions,
+    ProjectActions,
+    IDEActions,
+    PreferencesActions),
+  dispatch);
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(IDEView);

client/modules/IDE/pages/IDEView.jsx

@@ -1,72 +0,0 @@
-import React from 'react'
-import Editor from '../components/Editor'
-import PreviewFrame from '../components/PreviewFrame'
-import Toolbar from '../components/Toolbar'
-import Preferences from '../components/Preferences'
-import Nav from '../../../components/Nav'
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
-import * as FileActions from '../actions/files'
-import * as IDEActions from '../actions/ide'
-import * as PreferencesActions from '../actions/preferences'
-import * as ProjectActions from '../actions/project'
-
-class IDEView extends React.Component {
-	componentDidMount() {
-		if (this.props.params.project_id) {
-			const id = this.props.params.project_id
-			this.props.getProject(id);
-		}
-	}
-
-	render() {
-		return (
-			<div className="ide">
-				<Nav user={this.props.user}
-						 createProject={this.props.createProject}
-						 saveProject={this.props.saveProject}/>
-				<Toolbar 
-					className="Toolbar"
-					isPlaying={this.props.ide.isPlaying}
-					startSketch={this.props.startSketch}
-					stopSketch={this.props.stopSketch}
-					projectName={this.props.project.name}
-					setProjectName={this.props.setProjectName}
-					openPreferences={this.props.openPreferences}
-					isPreferencesVisible={this.props.preferences.isVisible}/>
-				<Preferences
-					isVisible={this.props.preferences.isVisible}
-					closePreferences={this.props.closePreferences}
-					increaseFont={this.props.increaseFont}
-					decreaseFont={this.props.decreaseFont}
-					fontSize={this.props.preferences.fontSize}/>
-				<Editor
-					content={this.props.file.content}
-					updateFile={this.props.updateFile}
-					fontSize={this.props.preferences.fontSize} />
-				<PreviewFrame
-					content={this.props.file.content}
-					head={
-			      <link type='text/css' rel='stylesheet' href='/preview-styles.css' />
-			    }
-			    isPlaying={this.props.ide.isPlaying}/>
-			</div>
-		)
-	}
-}
-
-function mapStateToProps(state) {
-	return {
-		file: state.file,
-		ide: state.ide,
-		preferences: state.preferences,
-		user: state.user,
-		project: state.project
-	}
-}
-
-function mapDispatchToProps(dispatch) {
-	return bindActionCreators(Object.assign({}, FileActions, ProjectActions, IDEActions, PreferencesActions), dispatch);
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(IDEView);

client/modules/IDE/reducers/files.js

@@ -1,7 +1,7 @@
 import * as ActionTypes from '../../../constants';
 
 const initialState = {
-	name: "sketch.js",
+  name: 'sketch.js',
   content: `function setup() { 
   createCanvas(400, 400);
 } 
@@ -9,7 +9,7 @@ const initialState = {
 function draw() { 
   background(220);
 }`
-}
+};
 
 const file = (state = initialState, action) => {
   switch (action.type) {
@@ -17,20 +17,20 @@ const file = (state = initialState, action) => {
       return {
         name: action.name,
         content: action.content
-			}
+      };
     case ActionTypes.NEW_PROJECT:
       return {
         name: action.file.name,
         content: action.file.conent
-			}
+      };
     default:
-			return state
+      return state;
   }
-}
+};
 
 export default file;
 
-//i'll add this in when there are multiple files
+// i'll add this in when there are multiple files
 // const files = (state = [], action) => {
 //  switch (action.type) {
 //    case ActionTypes.CHANGE_SELECTED_FILE:

client/modules/IDE/reducers/ide.js

@@ -2,25 +2,25 @@ import * as ActionTypes from '../../../constants';
 
 const initialState = {
   isPlaying: false
-}
+};
 
 const ide = (state = initialState, action) => {
   switch (action.type) {
     case ActionTypes.TOGGLE_SKETCH:
       return {
         isPlaying: !state.isPlaying
-			}
+      };
     case ActionTypes.START_SKETCH:
       return {
         isPlaying: true
-			}
+      };
     case ActionTypes.STOP_SKETCH:
       return {
         isPlaying: false
-			}
+      };
     default:
-			return state
+      return state;
   }
-}
+};
 
 export default ide;

client/modules/IDE/reducers/preferences.js

@@ -3,7 +3,7 @@ import * as ActionTypes from '../../../constants';
 const initialState = {
   isVisible: false,
   fontSize: 18
-}
+};
 
 const preferences = (state = initialState, action) => {
   switch (action.type) {
@@ -11,25 +11,25 @@ const preferences = (state = initialState, action) => {
       return {
         isVisible: true,
         fontSize: state.fontSize
-			}
+      };
     case ActionTypes.CLOSE_PREFERENCES:
       return {
         isVisible: false,
         fontSize: state.fontSize
-			}
+      };
     case ActionTypes.INCREASE_FONTSIZE:
       return {
         isVisible: state.isVisible,
-				fontSize: state.fontSize+2
+        fontSize: state.fontSize + 2
-			}
+      };
     case ActionTypes.DECREASE_FONTSIZE:
       return {
         isVisible: state.isVisible,
-				fontSize: state.fontSize-2
+        fontSize: state.fontSize - 2
-			}
+      };
     default:
-			return state
+      return state;
   }
-}
+};
 
 export default preferences;

client/modules/IDE/reducers/project.js

@@ -1,20 +1,20 @@
 import * as ActionTypes from '../../../constants';
 
 const initialState = {
-	name: "Hello p5.js"
+  name: 'Hello p5.js'
-}
+};
 
 const project = (state = initialState, action) => {
   switch (action.type) {
     case ActionTypes.SET_PROJECT_NAME:
       return {
         name: action.name
-			}
+      };
     case ActionTypes.NEW_PROJECT:
       return {
         id: action.id,
         name: action.name
-			}
+      };
     case ActionTypes.SET_PROJECT:
       return {
         id: action.project.id,
@@ -23,10 +23,10 @@ const project = (state = initialState, action) => {
           name: action.project.file.name,
           content: action.project.file.content
         }
-			}
+      };
     default:
       return state;
   }
-}
+};
 
 export default project;

client/modules/User/actions.js

@@ -1,51 +1,52 @@
-import * as ActionTypes from '../../constants'
+import * as ActionTypes from '../../constants';
-import { browserHistory } from 'react-router'
+import { browserHistory } from 'react-router';
-import axios from 'axios'
+import axios from 'axios';
 
 
 const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
 
-export function signUpUser(formValues) {
-  return function(dispatch) {
-    axios.post(`${ROOT_URL}/signup`, formValues, {withCredentials: true})
-      .then(response => {
-        dispatch({ type: ActionTypes.AUTH_USER,
-                    user: response.data
-        });
-        browserHistory.push('/');
-      })
-      .catch(response => dispatch(authError(response.data.error)));
-  }
-}
-
-export function loginUser(formValues) {
-  return function(dispatch) {
-    axios.post(`${ROOT_URL}/login`, formValues, {withCredentials: true})
-      .then(response => {
-        dispatch({ type: ActionTypes.AUTH_USER,
-                    user: response.data
-        });
-        browserHistory.push('/');
-      })
-      .catch(response => dispatch(authError(response.data.error)));
-  }
-}
-
-export function getUser() {
-  return function(dispatch) {
-    axios.get(`${ROOT_URL}/session`, {withCredentials: true})
-      .then(response => {
-        dispatch({type: ActionTypes.AUTH_USER,
-          user: response.data
-        });
-      })
-      .catch(response => dispatch(authError(response.data.error)));
-  }
-}
-
 export function authError(error) {
   return {
     type: ActionTypes.AUTH_ERROR,
     payload: error
   };
 }
+
+export function signUpUser(formValues) {
+  return (dispatch) => {
+    axios.post(`${ROOT_URL}/signup`, formValues, { withCredentials: true })
+      .then(response => {
+        dispatch({ type: ActionTypes.AUTH_USER,
+                    user: response.data
+        });
+        browserHistory.push('/');
+      })
+      .catch(response => dispatch(authError(response.data.error)));
+  };
+}
+
+export function loginUser(formValues) {
+  return (dispatch) => {
+    axios.post(`${ROOT_URL}/login`, formValues, { withCredentials: true })
+      .then(response => {
+        dispatch({ type: ActionTypes.AUTH_USER,
+                    user: response.data
+        });
+        browserHistory.push('/');
+      })
+      .catch(response => dispatch(authError(response.data.error)));
+  };
+}
+
+export function getUser() {
+  return (dispatch) => {
+    axios.get(`${ROOT_URL}/session`, { withCredentials: true })
+      .then(response => {
+        dispatch({
+          type: ActionTypes.AUTH_USER,
+          user: response.data
+        });
+      })
+      .catch(response => dispatch(authError(response.data.error)));
+  };
+}

client/modules/User/components/LoginForm.js

@@ -0,0 +1,34 @@
+import React from 'react';
+
+class LoginForm extends React.Component {
+  render() {
+    const { fields: { email, password }, handleSubmit } = this.props;
+    return (
+      <form className="login-form" onSubmit={handleSubmit(this.props.loginUser.bind(this))}>
+        <p className="login-form__field">
+          <label className="login-form__email-label" htmlFor="email">Email:</label>
+          <input
+            className="login-form__email-input"
+            id="email"
+            type="text"
+            placeholder="Email"
+            {...email}
+          />
+        </p>
+        <p className="login-form__field">
+          <label className="signup-form__password-label" htmlFor="password">Password:</label>
+          <input
+            className="signup-form__password-input"
+            id="password"
+            type="password"
+            placeholder="Password"
+            {...password}
+          />
+        </p>
+        <input type="submit" value="Login" />
+      </form>
+    );
+  }
+}
+
+export default LoginForm;

client/modules/User/components/LoginForm.jsx

@@ -1,22 +0,0 @@
-import React from 'react'
-
-class LoginForm extends React.Component {
-	render() {
-		const {fields: {email, password}, handleSubmit } = this.props;
-		return (
-			<form className="login-form" onSubmit={handleSubmit(this.props.loginUser.bind(this))}>
-				<p className="login-form__field">
-					<label className="login-form__email-label" for="email">Email:</label>
-					<input className="login-form__email-input" id="email" type="text" placeholder="Email" {...email}/>
-				</p>
-				<p className="login-form__field">
-					<label className="signup-form__password-label" for="password">Password:</label>
-					<input className="signup-form__password-input" id="password" type="password" placeholder="Password" {...password}/>
-				</p>
-				<input type="submit" value="Login" />
-			</form>
-		)
-	}
-}
-
-export default LoginForm;

client/modules/User/components/SignupForm.js

@@ -0,0 +1,58 @@
+import React from 'react';
+
+class SignupForm extends React.Component {
+  render() {
+    const { fields: { username, email, password, confirmPassword }, handleSubmit } = this.props;
+    return (
+      <form className="signup-form" onSubmit={handleSubmit(this.props.signUpUser.bind(this))}>
+        <p className="signup-form__field">
+          <label className="signup-form__username-label" htmlFor="username">Username:</label>
+          <input
+            className="signup-form__username-input"
+            id="username"
+            type="text"
+            placeholder="Username"
+            {...username}
+          />
+        </p>
+        <p className="signup-form__field">
+          <label className="signup-form__email-label" htmlFor="email">Email:</label>
+          <input
+            className="signup-form__email-input"
+            id="email"
+            type="text"
+            placeholder="Email"
+            {...email}
+          />
+        </p>
+        <p className="signup-form__field">
+          <label className="signup-form__password-label" htmlFor="password">Password:</label>
+          <input
+            className="signup-form__password-input"
+            id="password"
+            type="password"
+            placeholder="Password"
+            {...password}
+          />
+        </p>
+        <p className="signup-form__field">
+          <label
+            className="signup-form__confirm-password-label"
+            htmlFor="confirm-password">
+            Confirm Password:
+          </label>
+          <input
+            className="signup-form__confirm-password-input"
+            id="confirm-password"
+            type="password"
+            placeholder="Confirm Password"
+            {...confirmPassword}
+          />
+        </p>
+        <input type="submit" value="Sign Up" />
+      </form>
+    );
+  }
+}
+
+export default SignupForm;

client/modules/User/components/SignupForm.jsx

@@ -1,30 +0,0 @@
-import React from 'react'
-
-class SignupForm extends React.Component {
-	render() {
-		const {fields: { username, email, password, confirmPassword }, handleSubmit} = this.props;
-		return (
-			<form className="signup-form" onSubmit={handleSubmit(this.props.signUpUser.bind(this))}>
-				<p className="signup-form__field">
-					<label className="signup-form__username-label" for="username">Username:</label>
-					<input className="signup-form__username-input" id="username" type="text" placeholder="Username" {...username}/>
-				</p>
-				<p className="signup-form__field">
-					<label className="signup-form__email-label" for="email">Email:</label>
-					<input className="signup-form__email-input" id="email" type="text" placeholder="Email" {...email}/>
-				</p>
-				<p className="signup-form__field">
-					<label className="signup-form__password-label" for="password">Password:</label>
-					<input className="signup-form__password-input" id="password" type="password" placeholder="Password" {...password}/>
-				</p>
-				<p className="signup-form__field">
-					<label className="signup-form__confirm-password-label" for="confirm-password">Confirm Password:</label>
-					<input className="signup-form__confirm-password-input" id="confirm-password" type="password" placeholder="Confirm Password" {...confirmPassword}/>
-				</p>
-				<input type="submit" value="Sign Up" />
-			</form>
-		)
-	}
-}
-
-export default SignupForm;

client/modules/User/pages/LoginView.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import { bindActionCreators } from 'redux';
+import { reduxForm } from 'redux-form';
+import * as UserActions from '../actions';
+import LoginForm from '../components/LoginForm';
+
+class LoginView extends React.Component {
+  render() {
+    return (
+      <div className="login">
+        <h1>Login</h1>
+        <LoginForm {...this.props} />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state) {
+  return {
+    user: state.user
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return bindActionCreators(UserActions, dispatch);
+}
+
+function validate(formProps) {
+  const errors = {};
+  return errors;
+}
+
+export default reduxForm({
+  form: 'login',
+  fields: ['email', 'password'],
+  validate
+}, mapStateToProps, mapDispatchToProps)(LoginView);

client/modules/User/pages/LoginView.jsx

@@ -1,37 +0,0 @@
-import React from 'react'
-import { bindActionCreators } from 'redux'
-import {reduxForm} from 'redux-form'
-import * as UserActions from '../actions'
-import LoginForm from '../components/LoginForm'
-
-class LoginView extends React.Component {
-	render() {
-		return (
-			<div className="login">
-				<h1>Login</h1>
-				<LoginForm {...this.props} />
-			</div>
-		)
-	}
-}
-
-function mapStateToProps(state) {
-	return {
-		user: state.user
-	}
-}
-
-function mapDispatchToProps(dispatch) {
-	return bindActionCreators(UserActions, dispatch);
-}
-
-function validate(formProps) {
-	const errors = {};
-	return errors;
-}
-
-export default reduxForm({
-	form: 'login',
-	fields: ['email', 'password'],
-	validate
-}, mapStateToProps, mapDispatchToProps)(LoginView);

client/modules/User/pages/SignupView.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { bindActionCreators } from 'redux';
+import * as UserActions from '../actions';
+import { reduxForm } from 'redux-form';
+import SignupForm from '../components/SignupForm';
+
+class SignupView extends React.Component {
+  render() {
+    return (
+      <div className="signup">
+        <h1>Sign Up</h1>
+        <SignupForm {...this.props} />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state) {
+  return {
+    user: state.user
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return bindActionCreators(UserActions, dispatch);
+}
+
+function validate(formProps) {
+  const errors = {};
+  return errors;
+}
+
+// export default connect(mapStateToProps, mapDispatchToProps)(SignupView);
+export default reduxForm({
+  form: 'signup',
+  fields: ['username', 'email', 'password', 'passwordConfirm'],
+  validate
+}, mapStateToProps, mapDispatchToProps)(SignupView);

client/modules/User/pages/SignupView.jsx

@@ -1,39 +0,0 @@
-import React from 'react'
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
-import * as UserActions from '../actions'
-import { reduxForm } from 'redux-form'
-import SignupForm from '../components/SignupForm'
-
-class SignupView extends React.Component {
-	render() {
-		return (
-			<div className="signup">
-				<h1>Sign Up</h1>
-				<SignupForm {...this.props} />
-			</div>
-		)
-	}
-}
-
-function mapStateToProps(state) {
-	return {
-		user: state.user
-	}
-}
-
-function mapDispatchToProps(dispatch) {
-	return bindActionCreators(UserActions, dispatch);
-}
-
-function validate(formProps) {
-	const errors = {};
-	return errors;
-}
-
-// export default connect(mapStateToProps, mapDispatchToProps)(SignupView);
-export default reduxForm({
-	form: 'signup',
-	fields: ['username', 'email', 'password', 'passwordConfirm'],
-	validate
-}, mapStateToProps, mapDispatchToProps)(SignupView);

client/modules/User/reducers.js

@@ -1,6 +1,6 @@
-import * as ActionTypes from '../../constants'
+import * as ActionTypes from '../../constants';
 
-const user = (state = {authenticated: false}, action) => {
+const user = (state = { authenticated: false }, action) => {
   switch (action.type) {
     case ActionTypes.AUTH_USER:
       return { ...action.user,
@@ -8,10 +8,10 @@ const user = (state = {authenticated: false}, action) => {
     case ActionTypes.AUTH_ERROR:
       return {
         authenticated: false
-			}
+      };
     default:
       return state;
   }
-}
+};
 
 export default user;

client/reducers.js

@@ -1,10 +1,10 @@
-import { combineReducers } from 'redux'
+import { combineReducers } from 'redux';
-import file from './modules/IDE/reducers/files'
+import file from './modules/IDE/reducers/files';
-import ide from './modules/IDE/reducers/ide'
+import ide from './modules/IDE/reducers/ide';
-import preferences from './modules/IDE/reducers/preferences'
+import preferences from './modules/IDE/reducers/preferences';
-import project from './modules/IDE/reducers/project'
+import project from './modules/IDE/reducers/project';
-import user from './modules/User/reducers'
+import user from './modules/User/reducers';
-import { reducer as form } from 'redux-form'
+import { reducer as form } from 'redux-form';
 
 const rootReducer = combineReducers({
   form,
@@ -13,6 +13,6 @@ const rootReducer = combineReducers({
   preferences,
   user,
   project
-})
+});
 
-export default rootReducer
+export default rootReducer;

client/routes.js

@@ -1,24 +1,24 @@
-import { Route, IndexRoute } from 'react-router'
+import { Route, IndexRoute } from 'react-router';
-import React from 'react'
+import React from 'react';
-import App from './modules/App/App'
+import App from './modules/App/App';
-import IDEView from './modules/IDE/pages/IDEView'
+import IDEView from './modules/IDE/pages/IDEView';
-import LoginView from './modules/User/pages/LoginView'
+import LoginView from './modules/User/pages/LoginView';
-import SignupView from './modules/User/pages/SignupView'
+import SignupView from './modules/User/pages/SignupView';
-import { getUser } from './modules/User/actions'
+import { getUser } from './modules/User/actions';
+
+const checkAuth = (store) => {
+  store.dispatch(getUser());
+};
 
 const routes = (store) => {
   return (
     <Route path="/" component={App}>
-			<IndexRoute component={IDEView} onEnter={checkAuth(store)}/>
+      <IndexRoute component={IDEView} onEnter={checkAuth(store)} />
-			<Route path="/login" component={LoginView}/>
+      <Route path="/login" component={LoginView} />
-			<Route path="/signup" component={SignupView}/>
+      <Route path="/signup" component={SignupView} />
-			<Route path="/projects/:project_id" component={IDEView}/>
+      <Route path="/projects/:project_id" component={IDEView} />
     </Route>
   );
-}
+};
-
-const checkAuth = (store) => {
-	store.dispatch(getUser());
-}
 
 export default routes;

client/store.js

@@ -1,10 +1,9 @@
-import { createStore, applyMiddleware, compose } from 'redux'
+import { createStore, applyMiddleware, compose } from 'redux';
-import thunk from 'redux-thunk'
+import thunk from 'redux-thunk';
-import DevTools from './modules/App/components/DevTools'
+import DevTools from './modules/App/components/DevTools';
-import rootReducer from './reducers'
+import rootReducer from './reducers';
 
 export default function configureStore(initialState) {
-
   const enhancers = [
     applyMiddleware(thunk),
   ];
@@ -18,15 +17,16 @@ export default function configureStore(initialState) {
     rootReducer,
     initialState,
     compose(...enhancers)
-  )
+  );
 
   if (module.hot) {
     // Enable Webpack hot module replacement for reducers
     module.hot.accept('./reducers', () => {
-      const nextRootReducer = require('./reducers').default
+      const nextRootReducer = require('./reducers').default; // eslint-disable-line global-require
-      store.replaceReducer(nextRootReducer)
+      store.replaceReducer(nextRootReducer);
-    })
+    });
   }
 
-  return store
+  return store;
 }
+

package.json

@@ -11,7 +11,7 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/catarak/p5.js-web-editor"
+    "url": "git+https://github.com/catarak/p5.js-web-editor.git"
   },
   "devDependencies": {
     "babel-eslint": "^6.1.0",
@@ -56,6 +56,7 @@
     "connect-mongo": "^1.2.0",
     "cookie-parser": "^1.4.1",
     "dotenv": "^2.0.0",
+    "eslint-loader": "^1.3.0",
     "express": "^4.13.4",
     "express-session": "^1.13.0",
     "mongoose": "^4.4.16",

server/config/passport.js

@@ -1,8 +1,8 @@
 const passport = require('passport');
-const GitHubStrategy = require('passport-github').Strategy;
+// const GitHubStrategy = require('passport-github').Strategy;
 const LocalStrategy = require('passport-local').Strategy;
 
-import User from '../models/user'
+import User from '../models/user';
 
 passport.serializeUser((user, done) => {
   done(null, user.id);
@@ -18,11 +18,15 @@ passport.deserializeUser((id, done) => {
  * Sign in using Email and Password.
  */
 passport.use(new LocalStrategy({ usernameField: 'email' }, (email, password, done) => {
-  User.findOne({ email: email.toLowerCase() }, (err, user) => {
+  User.findOne({ email: email.toLowerCase() },
+    (err, user) => { // eslint-disable-line consistent-return
       if (!user) {
         return done(null, false, { msg: `Email ${email} not found.` });
       }
-    user.comparePassword(password, (err, isMatch) => {
+      user.comparePassword(password, (innerErr, isMatch) => {
+        if (innerErr) {
+          return done(innerErr);
+        }
         if (isMatch) {
           return done(null, user);
         }
@@ -34,7 +38,7 @@ passport.use(new LocalStrategy({ usernameField: 'email' }, (email, password, don
 /**
  * Sign in with GitHub.
  */
-//TODO add dotenv so I can add github login
+// TODO add dotenv so I can add github login
 // passport.use(new GitHubStrategy({
 //   clientID: process.env.GITHUB_ID,
 //   clientSecret: process.env.GITHUB_SECRET,
@@ -44,7 +48,8 @@ passport.use(new LocalStrategy({ usernameField: 'email' }, (email, password, don
 //   if (req.user) {
 //     User.findOne({ github: profile.id }, (err, existingUser) => {
 //       if (existingUser) {
-//         req.flash('errors', { msg: 'There is already a GitHub account that belongs to you. Sign in with that account or delete it, then link it with your current account.' });
+//         req.flash('errors', { msg: 'There is already a GitHub account that belongs to you. '
+//          + 'Sign in with that account or delete it, then link it with your current account.' });
 //         done(err);
 //       } else {
 //         User.findById(req.user.id, (err, user) => {
@@ -68,7 +73,8 @@ passport.use(new LocalStrategy({ usernameField: 'email' }, (email, password, don
 //       }
 //       User.findOne({ email: profile._json.email }, (err, existingEmailUser) => {
 //         if (existingEmailUser) {
-//           req.flash('errors', { msg: 'There is already an account using this email address. Sign in to that account and link it with GitHub manually from Account Settings.' });
+//           req.flash('errors', { msg: 'There is already an account using this email address. Sign'
+//             + ' in to that account and link it with GitHub manually from Account Settings.' });
 //           done(err);
 //         } else {
 //           const user = new User();

server/controllers/project.controller.js

@@ -1,17 +1,17 @@
-import Project from '../models/project'
+import Project from '../models/project';
 
 export function createProject(req, res) {
-	let projectValues = {
+  const projectValues = {
-		user: req.user ? req.user._id : undefined,
+    user: req.user ? req.user._id : undefined, // eslint-disable-line no-underscore-dangle
     file: {}
-	}
+  };
 
   Object.assign(projectValues, req.body);
 
-	Project.create(projectValues, function(err, newProject) {
+  Project.create(projectValues, (err, newProject) => {
-		if (err) { return res.json({success: false}); }
+    if (err) { return res.json({ success: false }); }
     return res.json({
-			id: newProject._id,
+      id: newProject._id, // eslint-disable-line no-underscore-dangle
       name: newProject.name,
       file: {
         name: newProject.file.name,
@@ -22,13 +22,13 @@ export function createProject(req, res) {
 }
 
 export function updateProject(req, res) {
-	Project.update({_id: req.params.project_id}, 
+  Project.update({ _id: req.params.project_id },
     {
       $set: req.body
-		}, function(err, updatedProject) {
+    }, (err, updatedProject) => {
-			if (err) { return res.json({success: false}) }
+      if (err) { return res.json({ success: false }); }
       return res.json({
-				id: updatedProject._id,
+        id: updatedProject._id, // eslint-disable-line no-underscore-dangle
         name: updatedProject.name,
         file: {
           name: updatedProject.file.name,
@@ -39,18 +39,18 @@ export function updateProject(req, res) {
 }
 
 export function getProject(req, res) {
-	Project.findById(req.params.project_id, function(err, project) {
+  Project.findById(req.params.project_id, (err, project) => {
     if (err) {
-			return res.status(404).send({message: 'Project with that id does not exist'}); 
+      return res.status(404).send({ message: 'Project with that id does not exist' });
     }
 
     return res.json({
-			id: project._id,
+      id: project._id, // eslint-disable-line no-underscore-dangle
       name: project.name,
       file: {
         name: project.file.name,
         content: project.file.conent
       }
     });
-	})
+  });
 }

server/controllers/session.controller.js

@@ -1,22 +1,15 @@
-import User from '../models/user'
+import passport from 'passport';
-import passport from 'passport'
-import path from 'path'
-
-
-export function destroySession(req, res) {
-
-}
 
 export function createSession(req, res, next) {
-	passport.authenticate('local', (err, user, info) => {
+  passport.authenticate('local', (err, user) => { // eslint-disable-line consistent-return
     if (err) { return next(err); }
     if (!user) {
       return res.status(401).send({ error: 'Invalid username or password' });
     }
 
-		req.logIn(user, (err) => {
+    req.logIn(user, (innerErr) => {
-			if (err) { return next(err); }
+      if (innerErr) { return next(innerErr); }
-			res.json({
+      return res.json({
         email: req.user.email,
         username: req.user.username
       });
@@ -24,12 +17,12 @@ export function createSession(req, res, next) {
   })(req, res, next);
 }
 
-export function getSession(req, res, next) {
+export function getSession(req, res) {
   if (req.user) {
     return res.json({
       email: req.user.email,
       username: req.user.username
     });
   }
-	res.status(404).send({message: 'Session does not exist'});
+  return res.status(404).send({ message: 'Session does not exist' });
 }

server/controllers/user.controller.js

@@ -1,6 +1,4 @@
-import User from '../models/user'
+import User from '../models/user';
-import passport from 'passport'
-import path from 'path'
 
 export function createUser(req, res, next) {
   const user = new User({
@@ -9,15 +7,18 @@ export function createUser(req, res, next) {
     password: req.body.password
   });
 
-  User.findOne({email: req.body.email}, (err, existingUser) => {
+  User.findOne({ email: req.body.email },
+    (err, existingUser) => { // eslint-disable-line consistent-return
+      if (err) { res.status(404).send({ error: err }); }
+
       if (existingUser) {
         return res.status(422).send({ error: 'Email is in use' });
       }
-		user.save((err) => {
+      user.save((saveErr) => { // eslint-disable-line consistent-return
-			if (err) { return next(err); }
+        if (saveErr) { return next(saveErr); }
-			req.logIn(user, (err) => {
+        req.logIn(user, (loginErr) => { // eslint-disable-line consistent-return
-				if (err) {
+          if (loginErr) {
-					return next(err);
+            return next(loginErr);
           }
           res.json({
             email: req.user.email,
@@ -26,5 +27,4 @@ export function createUser(req, res, next) {
         });
       });
     });
-
 }

server/models/project.js

@@ -3,15 +3,15 @@ const Schema = mongoose.Schema;
 import shortid from 'shortid';
 
 const fileSchema = new Schema({
-	name: {type: String, default: 'sketch.js'},
+  name: { type: String, default: 'sketch.js' },
-	content: {type: String}
+  content: { type: String }
-}, {timestamps: true});
+}, { timestamps: true });
 
 const projectSchema = new Schema({
-	name: {type: String, default: "Hello p5.js, it's the server"},
+  name: { type: String, default: "Hello p5.js, it's the server" },
-	user: {type: Schema.Types.ObjectId, ref: 'User'},
+  user: { type: Schema.Types.ObjectId, ref: 'User' },
-	file: {type: fileSchema},
+  file: { type: fileSchema },
-	_id: {type: String, default: shortid.generate}
+  _id: { type: String, default: shortid.generate }
-}, {timestamps: true});
+}, { timestamps: true });
 
 export default mongoose.model('Project', projectSchema);

server/models/user.js

@@ -4,26 +4,26 @@ const bcrypt = require('bcrypt-nodejs');
 
 const userSchema = new Schema({
   name: { type: String, default: '' },
-	username: { type: String, required: true, unique: true},
+  username: { type: String, required: true, unique: true },
   password: { type: String },
   github: { type: String },
   email: { type: String, unique: true },
   tokens: Array,
   admin: { type: Boolean, default: false }
-}, {timestamps: true});
+}, { timestamps: true });
 
 /**
  * Password hash middleware.
  */
-userSchema.pre('save', function (next) {
+userSchema.pre('save', (next) => { // eslint-disable-line consistent-return
   const user = this;
   if (!user.isModified('password')) { return next(); }
-  bcrypt.genSalt(10, (err, salt) => {
+  bcrypt.genSalt(10, (err, salt) => { // eslint-disable-line consistent-return
-    if (err) { return next(err); }
-    bcrypt.hash(user.password, salt, null, (err, hash) => {
     if (err) { return next(err); }
+    bcrypt.hash(user.password, salt, null, (innerErr, hash) => {
+      if (innerErr) { return next(innerErr); }
       user.password = hash;
-      next();
+      return next();
     });
   });
 });
@@ -31,7 +31,7 @@ userSchema.pre('save', function (next) {
 /**
  * Helper method for validating user's password.
  */
-userSchema.methods.comparePassword = function (candidatePassword, cb) {
+userSchema.methods.comparePassword = (candidatePassword, cb) => {
   bcrypt.compare(candidatePassword, this.password, (err, isMatch) => {
     cb(err, isMatch);
   });

server/routes/server.routes.js

@@ -1,24 +1,24 @@
-import {Router} from 'express'
+import { Router } from 'express';
 const router = new Router();
-import path from 'path'
+import path from 'path';
 
 // this is intended to be a temporary file
 // until i figure out isomorphic rendering
 
-router.route('/').get(function(req, res) {
+router.route('/').get((req, res) => {
-	res.sendFile(path.resolve(__dirname + '/../../index.html'));
+  res.sendFile(path.resolve(`${__dirname}/../../index.html`));
 });
 
-router.route('/signup').get(function(req, res) {
+router.route('/signup').get((req, res) => {
-	res.sendFile(path.resolve(__dirname + '/../../index.html'));
+  res.sendFile(path.resolve(`${__dirname}/../../index.html`));
 });
 
-router.route('/projects/:project_id').get(function(req, res) {
+router.route('/projects/:project_id').get((req, res) => {
-	res.sendFile(path.resolve(__dirname + '/../../index.html'));
+  res.sendFile(path.resolve(`${__dirname}/../../index.html`));
 });
 
-router.route('/login').get(function(req, res) {
+router.route('/login').get((req, res) => {
-	res.sendFile(path.resolve(__dirname + '/../../index.html'));
+  res.sendFile(path.resolve(`${__dirname}/../../index.html`));
 });
 
 export default router;

server/routes/session.routes.js

@@ -1,15 +1,12 @@
 import { Router } from 'express';
 import * as SessionController from '../controllers/session.controller';
-import passport from 'passport';
 
 const router = new Router();
 
 router.route('/login').post(SessionController.createSession);
 
-router.route('/logout').get(SessionController.destroySession);
-
 router.route('/session').get(SessionController.getSession);
 
 export default router;
 
-//TODO add github authentication stuff
+// TODO add github authentication stuff

server/server.js

@@ -7,7 +7,7 @@ const MongoStore = require('connect-mongo')(session);
 import passport from 'passport';
 import path from 'path';
 
-//Webpack Requirements
+// Webpack Requirements
 import webpack from 'webpack';
 import config from '../webpack.config';
 import webpackDevMiddleware from 'webpack-dev-middleware';
@@ -15,22 +15,22 @@ import webpackHotMiddleware from 'webpack-hot-middleware';
 
 const app = new Express();
 
-//add check if production environment here
+// add check if production environment here
 const compiler = webpack(config);
 app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }));
 app.use(webpackHotMiddleware(compiler));
 
-//Import all required modules
+// Import all required modules
 import serverConfig from './config';
 import users from './routes/user.routes';
 import sessions from './routes/session.routes';
 import projects from './routes/project.routes';
 import serverRoutes from './routes/server.routes';
 
-//Body parser, cookie parser, sessions, serve public assets
+// Body parser, cookie parser, sessions, serve public assets
 
 app.use(Express.static(path.resolve(__dirname, '../static')));
-app.use(bodyParser.urlencoded({extended: true}));
+app.use(bodyParser.urlencoded({ extended: true }));
 app.use(bodyParser.json());
 app.use(cookieParser());
 app.use(session({
@@ -53,13 +53,15 @@ app.use(passport.session());
 app.use('/api', users);
 app.use('/api', sessions);
 app.use('/api', projects);
-//this is supposed to be TEMPORARY -- until i figure out 
+// this is supposed to be TEMPORARY -- until i figure out
 // isomorphic rendering
 app.use('/', serverRoutes);
 
-const passportConfig = require('./config/passport');
+// configure passport
+// const passportConfig = require('./config/passport');
+require('./config/passport');
 
-//Connect to MongoDB
+// Connect to MongoDB
 // mongoose.connect(process.env.MONGODB_URI || process.env.MONGOLAB_URI);
 mongoose.connect(serverConfig.mongoURL);
 mongoose.connection.on('error', () => {
@@ -67,9 +69,9 @@ mongoose.connection.on('error', () => {
   process.exit(1);
 });
 
-app.get("/", function(req, res) {
+app.get('/', (req, res) => {
-  res.sendFile(path.resolve(__dirname + '/../index.html'));
+  res.sendFile(path.resolve(`${__dirname}/../index.html`));
-})
+});
 
 // start app
 app.listen(serverConfig.port, (error) => {
@@ -79,3 +81,4 @@ app.listen(serverConfig.port, (error) => {
 });
 
 export default app;
+