beautified

client/js/app.js

@@ -13,22 +13,22 @@ import * as actions from './redux/actions';
 
 import Index from './pages/Index';
 
-class Main extends React.Component{
-    render(){
-        return(
+class Main extends React.Component {
+    render() {
+        return (
             <div>{React.cloneElement(this.props.children, this.props)}</div>
         );
     }
 }
 
-function mapStateToProps(state){
+function mapStateToProps(state) {
     return {
         redux: state.reducer
     }
 }
 
-function mapDispatchToProps(dispatch){
-    return{
+function mapDispatchToProps(dispatch) {
+    return {
         actions: bindActionCreators(actions, dispatch)
     }
 }
@@ -44,4 +44,4 @@ ReactDOM.render((
             </Route>
         </Router>
     </Provider>
-),document.getElementById('app'));
+), document.getElementById('app'));

client/js/components/Footer.js

@@ -2,10 +2,10 @@ import React from 'react';
 
 import '../../assets/scss/Footer.scss';
 
-export default class Footer extends React.Component{
+export default class Footer extends React.Component {
 
-  render(){
-    return(
+  render() {
+    return (
       <div class="Footer">
         Site created and maintained by Mitchell Gerber
       </div>

client/js/components/Header.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import {bubble} from '../../assets/js/bubble';
 
-export default class Header extends React.Component{
-  componentDidMount(){
+export default class Header extends React.Component {
+  componentDidMount() {
     bubble();
   }
 
-  render(){
-    return(
+  render() {
+    return (
       <header id="header" class="Header">
         <canvas id="canvas" width="854" height="709"></canvas>
       </header>

client/js/components/Post.js

@@ -1,23 +1,23 @@
+import hljs from 'highlight.js';
+import marked from 'marked';
 import React from 'react';
 import {Link} from 'react-router';
-import marked from 'marked';
-import hljs from 'highlight.js';
 
 import '../../assets/scss/Content.scss';
 
 const renderer = new marked.Renderer();
 
 marked.setOptions({
-    langPrefix: 'hljs ',
-    highlight: (code) => {
-      return  hljs.highlightAuto(code).value;
-    }
+  langPrefix: 'hljs ',
+  highlight: (code) => {
+    return hljs.highlightAuto(code).value;
+  }
 });
 
-export default class Post extends React.Component{
+export default class Post extends React.Component {
 
-  render(){
-    return(
+  render() {
+    return (
       <div class="Content">
         <div dangerouslySetInnerHTML={{__html : marked(this.props.content, {renderer : renderer})}}>
         </div>

client/js/components/Preview.js

@@ -3,11 +3,11 @@ import {Link} from 'react-router';
 
 import '../../assets/scss/Content.scss';
 
-export default class Preview extends React.Component{
+export default class Preview extends React.Component {
 
-  insertPosts(posts){
+  insertPosts(posts) {
     let elements = [];
-    for (let i = 0; i < this.props.postLimit && i < posts.length; i++){
+    for (let i = 0; i < this.props.postLimit && i < posts.length; i++) {
       elements.push(
         <div class="post" key={i}>
           <div class="date">
@@ -27,9 +27,9 @@ export default class Preview extends React.Component{
     return elements;
   }
 
-  render(){
+  render() {
     const posts = this.props.posts;
-    
+
     return (
       <div class="Content">
         {posts.length > 0 ? this.insertPosts(posts): null}

client/js/components/Sidebar.js

@@ -7,9 +7,9 @@ import SensorList from './sensors/SensorList';
 import me from '../../assets/images/me.jpg';
 import '../../assets/scss/Sidebar.scss';
 
-export default class Sidebar extends React.Component{
+export default class Sidebar extends React.Component {
 
-  constructor(){
+  constructor() {
     super();
 
     this.state = {
@@ -19,7 +19,7 @@ export default class Sidebar extends React.Component{
     this.onToggle = this.onToggle.bind(this);
   }
 
-  onToggle(){
+  onToggle() {
     let temp = this.state.toggler;
     temp = temp === "open" ? "" : "open";
 
@@ -28,8 +28,8 @@ export default class Sidebar extends React.Component{
     });
   }
 
-  render(){
-    return(
+  render() {
+    return (
       <div class={"Sidebar " + this.state.toggler}>
         <a onClick={this.onToggle} class="toggler">
           <i

client/js/components/sensors/SensorList.js

@@ -3,21 +3,21 @@ import 'whatwg-fetch';
 
 export default class SensorList extends React.Component {
 
-  constructor(){
+  constructor() {
     super();
 
     this.state = {
-      sensors : {},
+      sensors: {},
       fetching: false,
       fetched: false
     }
   }
 
-  componentDidMount(){
+  componentDidMount() {
     this.loadSensorData();
   }
 
-  loadSensorData(){
+  loadSensorData() {
     this.setState({
       fetching: true
     });
@@ -49,7 +49,7 @@ export default class SensorList extends React.Component {
       </div>
     );
   }
-  render(){
+  render() {
     return (
       <div>
         {this.state.fetched ? this.state.sensors.map(this.insertSensorData) : null}

client/js/pages/Index.js

@@ -17,31 +17,31 @@ import '../../assets/css/dracula.css';
 import loading from '../../assets/images/loading.svg';
 
 export default class Index extends React.Component {
-    componentDidMount() {
-        this.props.actions.fetchPreview();
-        this.page = this.props.params.page;
-        this.page === 'post' ? this.props.actions.fetchPost(this.props.params.category, this.props.params.post) : "";
+  componentDidMount() {
+    this.props.actions.fetchPreview();
+    this.page = this.props.params.page;
+    this.page === 'post' ? this.props.actions.fetchPost(this.props.params.category, this.props.params.post) : "";
+  }
+
+
+  componentWillReceiveProps(nextProps) {
+    if (this.props.params !== nextProps.params) {
+      const params = nextProps.params;
+      this.page = params.page;
+
+      if (typeof params.post !== 'undefined' && typeof params.category !== 'undefined') {
+        this.props.actions.fetchPost(params.category, params.post);
+      }
     }
+  }
 
+  render() {
+    const fetched = this.props.redux.fetched;
+    const fetching = this.props.redux.fetching;
 
-    componentWillReceiveProps(nextProps){
-        if(this.props.params !== nextProps.params){
-            const params = nextProps.params;
-            this.page = params.page;
-
-            if(typeof params.post !== 'undefined' && typeof params.category !== 'undefined'){
-              this.props.actions.fetchPost(params.category, params.post);
-            }
-        }
-    }
-
-    render() {
-      const fetched = this.props.redux.fetched;
-      const fetching = this.props.redux.fetching;
-
-        return (
-          <div>
-            <Header />
+    return (
+      <div>
+            <Header/>
               <div class="Main">
                   {typeof this.page === 'undefined' && !fetching
                     ? <Preview posts={this.props.redux.preview.posts}
@@ -50,12 +50,12 @@ export default class Index extends React.Component {
                     : null}
                   {this.page === 'post' && !fetching ? <Post content={this.props.redux.post}/> : null}
                   {fetching ? loadingElement : null}
-                <Sidebar />
+                <Sidebar/>
               </div>
-            <Footer />
+            <Footer/>
           </div>
-        );
-    }
+    );
+  }
 }
 
 const loadingElement = <div class="Loading">

client/js/redux/actions.js

@@ -2,7 +2,7 @@ import * as types from "./constants";
 import marked from 'marked';
 import 'whatwg-fetch';
 
-export function increasePostLimit(){
+export function increasePostLimit() {
     return {
         type: types.INCREASE_POST_LIMIT
     }
@@ -15,15 +15,15 @@ function initPreview(posts) {
     }
 }
 
-function loadPost(post){
+function loadPost(post) {
     return {
-      type: types.LOAD_POST,
-      post
+        type: types.LOAD_POST,
+        post
     }
 }
 
-function fetching(){
-    return{
+function fetching() {
+    return {
         type: types.FETCHING
     }
 }

client/js/redux/constants.js

@@ -1,6 +1,6 @@
 //constants
+export const INCREASE_POST_LIMIT = 'INCREASE_POST_LIMIT';
 export const INIT_PREVIEW = 'INIT_PREVIEW';
-export const FILTER_PREVIEW = 'FILTER_PREVIEW';
-export const LOAD_POST = 'LOAD_POST';
 export const FETCHING = 'FETCHING';
-export const INCREASE_POST_LIMIT = 'INCREASE_POST_LIMIT';
+export const FILTER_PREVIEW = 'FILTER_PREVIEW';
+export const LOAD_POST = 'LOAD_POST';

client/js/redux/reducers.js

@@ -1,10 +1,6 @@
 //just using one reducer - use combineReducers from redux to modularize things
-import {
-    combineReducers
-} from 'redux';
-import {
-    routerReducer
-} from 'react-router-redux';
+import {combineReducers} from 'redux';
+import {routerReducer} from 'react-router-redux';
 
 //import typs
 import * as types from './constants';
@@ -38,12 +34,12 @@ function reducer(state = defaultState, action) {
             });
         case types.FETCHING:
             return Object.assign({}, state, {
-                fetched : false,
+                fetched: false,
                 fetching: true
             });
         case types.INCREASE_POST_LIMIT:
             return Object.assign({}, state, {
-                postLimit : state.postLimit + 10
+                postLimit: state.postLimit + 10
             });
     }
 

client/js/redux/store.js

@@ -1,8 +1,8 @@
-import {applyMiddleware, createStore} from 'redux';
-import {syncHistoryWithStore} from 'react-router-redux';
-import {browserHistory} from 'react-router';
-import thunk from 'redux-thunk';
 import logger from 'redux-logger';
+import thunk from 'redux-thunk';
+import {applyMiddleware, createStore} from 'redux';
+import {browserHistory} from 'react-router';
+import {syncHistoryWithStore} from 'react-router-redux';
 
 import reducers from './reducers';