Changed project structure to have the root page into main and subbed out the pages into their own folder

client/homebrew/brewRenderer/brewRenderer.jsx

@@ -0,0 +1,14 @@
+var React = require('react');
+var _ = require('lodash');
+var cx = require('classnames');
+
+var COM = React.createClass({
+
+	render : function(){
+		return <div className='COM'>
+			COM Ready!
+		</div>
+	}
+});
+
+module.exports = COM;

client/homebrew/brewRenderer/brewRenderer.less

@@ -0,0 +1,3 @@
+.COM{
+
+}

client/homebrew/homebrew.jsx

@@ -4,9 +4,9 @@ var cx = require('classnames');
 
 var CreateRouter = require('pico-router').createRouter;
 
-var HomePage = require('./homePage/homePage.jsx');
-var EditPage = require('./editPage/editPage.jsx');
-var SharePage = require('./sharePage/sharePage.jsx');
+var HomePage = require('./pages/homePage/homePage.jsx');
+var EditPage = require('./pages/editPage/editPage.jsx');
+var SharePage = require('./pages/sharePage/sharePage.jsx');
 
 var Router;
 var Homebrew = React.createClass({

client/homebrew/homebrew.less

@@ -9,7 +9,6 @@ html,body, #reactContainer{
 	height: 100vh;
 	margin: 0;
 	font-family      : 'Open Sans', sans-serif;
-	//overflow: hidden;
 }
 
 .homebrew{
@@ -26,7 +25,7 @@ html,body, #reactContainer{
 		.content{
 			flex: auto;
 			position: relative;
-			height: calc(~"100% - 29px");
+			height: calc(~"100% - 29px"); //Navbar height
 		}
 	}
 

client/homebrew/pages/editPage/editPage.jsx

@@ -2,11 +2,11 @@ var React = require('react');
 var _ = require('lodash');
 var cx = require('classnames');
 
-var Statusbar = require('../statusbar/statusbar.jsx');
-var PageContainer = require('../pageContainer/pageContainer.jsx');
-var Editor = require('../editor/editor.jsx');
+var Statusbar = require('../../statusbar/statusbar.jsx');
+var PageContainer = require('../../pageContainer/pageContainer.jsx');
+var Editor = require('../../editor/editor.jsx');
 
-var FullClassGen = require('../editor/snippets/fullclass.gen.js');
+var FullClassGen = require('../../editor/snippets/fullclass.gen.js');
 
 var request = require("superagent");
 

client/homebrew/pages/homePage/homePage.jsx

@@ -3,23 +3,23 @@ var _ = require('lodash');
 var cx = require('classnames');
 
 //var Statusbar = require('../statusbar/statusbar.jsx');
-var PageContainer = require('../pageContainer/pageContainer.jsx');
+//var PageContainer = require('../pageContainer/pageContainer.jsx');
 //var Editor = require('../editor/editor.jsx');
 
 
 
 var Nav = require('naturalcrit/nav/nav.jsx');
-var Navbar = require('../navbar/navbar.jsx');
+var Navbar = require('../../navbar/navbar.jsx');
 
-var RedditShare = require('../navbar/redditShare.navitem.jsx');
+var RedditShare = require('../../navbar/redditShare.navitem.jsx');
 
-var SplitPane = require('../splitPane/splitPane.jsx');
+var SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
 
 
 
 //var CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
 
-var Editor = require('../editor/editor.jsx');
+var Editor = require('../../editor/editor.jsx');
 
 
 

client/homebrew/pages/sharePage/sharePage.jsx

@@ -2,9 +2,9 @@ var React = require('react');
 var _ = require('lodash');
 var cx = require('classnames');
 
-var Statusbar = require('../statusbar/statusbar.jsx');
+var Statusbar = require('../../statusbar/statusbar.jsx');
 
-var PageContainer = require('../pageContainer/pageContainer.jsx');
+var PageContainer = require('../../pageContainer/pageContainer.jsx');
 
 var SharePage = React.createClass({
 	getDefaultProps: function() {

client/homebrew/splitPane/splitPane.jsx

@@ -1,93 +0,0 @@
-var React = require('react');
-var _ = require('lodash');
-var cx = require('classnames');
-
-var SplitPane = React.createClass({
-	getDefaultProps: function() {
-		return {
-			onDragFinish : function(){} //fires when dragging
-		};
-	},
-	getInitialState: function() {
-		return {
-			storageKey : 'naturalcrit-pane-split',
-			size : null,
-			isDragging : false
-		};
-	},
-	componentDidMount: function() {
-		var paneSize = window.localStorage.getItem(this.props.storageKey);
-		if(paneSize){
-			this.setState({
-				size : paneSize
-			})
-		}
-	},
-
-	handleUp : function(){
-		if(this.state.isDragging){
-			this.props.onDragFinish(this.state.size);
-			window.localStorage.setItem(this.props.storageKey, this.state.size);
-		}
-		this.setState({ isDragging : false });
-	},
-	handleDown : function(){
-		this.setState({ isDragging : true });
-		//this.unFocus()
-	},
-	handleMove : function(e){
-		if(!this.state.isDragging) return;
-		this.setState({
-			size : e.pageX
-		});
-	},
-/*
-	unFocus : function() {
-		if(document.selection){
-				document.selection.empty();
-		}else{
-			window.getSelection().removeAllRanges();
-		}
-	},
-*/
-	renderDivider : function(){
-		return <div className='divider' onMouseDown={this.handleDown}>
-			<div className='dots'>
-				<i className='fa fa-circle' />
-				<i className='fa fa-circle' />
-				<i className='fa fa-circle' />
-			</div>
-		</div>
-	},
-
-	render : function(){
-		return <div className='splitPane' onMouseMove={this.handleMove} onMouseUp={this.handleUp}>
-			<Pane ref='pane1' width={this.state.size}>{this.props.children[0]}</Pane>
-			{this.renderDivider()}
-			<Pane ref='pane2'>{this.props.children[1]}</Pane>
-		</div>
-	}
-});
-
-var Pane = React.createClass({
-	getDefaultProps: function() {
-		return {
-			width : null
-		};
-	},
-	render : function(){
-		var styles = {};
-		if(this.props.width){
-			styles = {
-				flex : 'none',
-				width : this.props.width + 'px'
-			}
-		}
-		return <div className={cx('pane', this.props.className)} style={styles}>
-			{this.props.children}
-		</div>
-	}
-});
-
-
-module.exports = SplitPane;

client/homebrew/splitPane/splitPane.less

@@ -1,31 +0,0 @@
-
-.splitPane{
-	position       : relative;
-	display        : flex;
-	height         : 100%;
-	outline        : none;
-	flex-direction : row;
-	.pane{
-		overflow-x : hidden;
-		flex       : 1;
-	}
-	.divider{
-		display          : table;
-		height           : 100%;
-		width            : 12px;
-		cursor           : ew-resize;
-		background-color : #bbb;
-		text-align       : center;
-		.dots{
-			display        : table-cell;
-			vertical-align : middle;
-			text-align     : center;
-			i{
-				display   : block;
-				margin    : 10px 0px;
-				font-size : 6px;
-				color     : #666;
-			}
-		}
-	}
-}