combine project view and ide view

server/controllers/project.controller.js

@@ -43,5 +43,18 @@ export function updateProject(req, res) {
 }
 
 export function getProject(req, res) {
+	Project.findById(req.params.project_id, function(err, project) {
+		if (err) { 
+			return res.status(404).send({message: 'Project with that id does not exist'}); 
+		}
 
+		return res.json({
+			id: project._id,
+			name: project.name,
+			file: {
+				name: project.file.name,
+				content: project.file.conent
+			}
+		});
+	})
 }

shared/containers/IDEView/IDEView.jsx

@@ -6,9 +6,17 @@ import Preferences from '../../components/Preferences/Preferences'
 import Nav from '../../components/Nav/Nav'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
-import * as FileActions from '../../redux/actions'
+import * as IndexActions from '../../redux/actions'
+import * as ProjectActions from '../../redux/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">
@@ -57,7 +65,7 @@ function mapStateToProps(state) {
 }
 
 function mapDispatchToProps(dispatch) {
-	return bindActionCreators(FileActions, dispatch);
+	return bindActionCreators(Object.assign({}, IndexActions, ProjectActions), dispatch);
 }
 
 export default connect(mapStateToProps, mapDispatchToProps)(IDEView);

shared/containers/ProjectView/ProjectView.jsx

@@ -0,0 +1,40 @@
+import React from 'react'
+import * as ProjectActions from '../../redux/actions/project'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
+
+class ProjectView extends React.Component {
+	render() {
+		return (
+			<div className="project">
+				<h1>{this.props.project.name}</h1>
+				<p>
+					{this.props.file.content}
+				</p>
+			</div>
+		);
+	}
+
+	componentDidMount() {
+		const id = this.props.params.project_id
+		this.props.getProject(id);
+	}
+}
+
+function mapStateToProps(state) {
+	return {
+		file: state.file,
+		ide: state.ide,
+		user: state.user,
+		project: state.project
+	}
+}
+
+function mapDispatchToProps(dispatch) {
+	return bindActionCreators(ProjectActions, dispatch);
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(ProjectView);
+

shared/redux/actions/index.js

@@ -1,15 +1,7 @@
 import * as ActionTypes from '../constants/constants';
 import axios from 'axios'
 
-const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api/' : '/api';
-
-export function updateFile(name, content) {
-	return {
-		type: ActionTypes.CHANGE_SELECTED_FILE,
-		name: name,
-		content: content
-	}
-}
+const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
 
 export function toggleSketch() {
 	return {

shared/redux/actions/project.js

@@ -0,0 +1,95 @@
+import * as ActionTypes from '../constants/constants'
+import axios from 'axios'
+
+const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
+
+export function updateFile(name, content) {
+	return {
+		type: ActionTypes.CHANGE_SELECTED_FILE,
+		name: name,
+		content: content
+	}
+}
+
+export function getProject(id) {
+	return function(dispatch) {
+		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
+			}));
+	}
+}
+
+export function setProjectName(event) {
+	var name = event.target.textContent;
+	return {
+		type: ActionTypes.SET_PROJECT_NAME,
+		name: name
+	}
+}
+
+export function saveProject() {
+	return function(dispatch, getState) {
+		var state = getState();
+		var formParams = Object.assign({}, state.project);
+		formParams.file = state.file;
+		if (state.id) {
+			axios.put(`${ROOT_URL}/projects/${state.id}`, formParams, {withCredentials: true})
+				.then(response => {
+					dispatch({
+						type: ActionTYpes.PROJECT_SAVE_SUCCESS
+					})
+					.catch(response => dispatch({
+						type: ActionTypes.PROJECT_SAVE_FAIL
+					}));
+				})
+		}
+		else {
+			axios.post(`${ROOT_URL}/projects`, formParams, {withCredentials: true})
+				.then(response => {
+					browserHistory.push('/' + response.data.id);
+					dispatch({
+						type: ActionTypes.NEW_PROJECT,
+						name: response.data.name,
+						id: response.data.id,
+						file: {
+							name: response.data.file.name,
+							content: response.data.file.content
+						}
+					});
+				})
+				.catch(response => dispatch({
+					type: ActionTypes.PROJECT_SAVE_FAIL
+				}));
+		}
+	}
+}
+
+
+export function createProject() {
+	return function(dispatch) {
+		axios.post(`${ROOT_URL}/projects`, {}, {withCredentials: true})
+			.then(response => {
+				dispatch({
+					type: ActionTypes.NEW_PROJECT,
+					name: response.data.name,
+					id: response.data.id,
+					file: {
+						name: response.data.file.name,
+						content: response.data.file.content
+					}
+				});
+				browserHistory.push('/' + response.data.id);
+			})
+			.catch(response => dispatch({
+				type: ActionTypes.PROJECT_SAVE_FAIL
+			}));
+	}
+}

shared/redux/actions/user.js

@@ -3,7 +3,7 @@ import { browserHistory } from 'react-router'
 import axios from 'axios'
 
 
-const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api/' : '/api';
+const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
 
 export function signUpUser(formValues) {
   return function(dispatch) {

shared/redux/constants/constants.js

@@ -20,3 +20,7 @@ export const PROJECT_SAVE_SUCCESS = 'PROJECT_SAVE_SUCCESS';
 export const PROJECT_SAVE_FAIL = 'PROJECT_SAVE_FAIL';
 export const NEW_PROJECT = 'NEW_PROJECT';
 
+export const SET_PROJECT = 'SET_PROJECT';
+
+//eventually, handle errors more specifically and better
+export const ERROR = 'ERROR';

shared/redux/reducers/project.js

@@ -15,6 +15,15 @@ const project = (state = initialState, action) => {
 				id: action.id,
 				name: action.name
 			}
+		case ActionTypes.SET_PROJECT:
+			return {
+				id: action.project.id,
+				name: action.project.name,
+				file: {
+					name: action.project.file.name,
+					content: action.project.file.content
+				}
+			}
 		default:
 			return state;
 	}

shared/routes.js

@@ -4,6 +4,7 @@ import App from './containers/App'
 import IDEView from './containers/IDEView/IDEView'
 import LoginView from './containers/LoginView/LoginView'
 import SignupView from './containers/SignupView/SignupView'
+import ProjectView from './containers/ProjectView/ProjectView'
 import { getUser } from './redux/actions/user';
 
 const routes = (store) => {
@@ -12,6 +13,7 @@ const routes = (store) => {
 			<IndexRoute component={IDEView} onEnter={checkAuth(store)}/>
 			<Route path="/login" component={LoginView}/>
 			<Route path="/signup" component={SignupView}/>
+			<Route path="/projects/:project_id" component={IDEView}/>
 		</Route>
 	);
 }