From 719042e41b11e627834e627225160645910e05c9 Mon Sep 17 00:00:00 2001 From: catarak Date: Mon, 20 Jun 2016 13:29:32 -0400 Subject: [PATCH] combine project view and ide view --- server/controllers/project.controller.js | 15 ++- shared/containers/IDEView/IDEView.jsx | 12 ++- shared/containers/ProjectView/ProjectView.jsx | 40 ++++++++ shared/redux/actions/index.js | 10 +- shared/redux/actions/project.js | 95 +++++++++++++++++++ shared/redux/actions/user.js | 2 +- shared/redux/constants/constants.js | 4 + shared/redux/reducers/project.js | 9 ++ shared/routes.js | 2 + 9 files changed, 176 insertions(+), 13 deletions(-) create mode 100644 shared/containers/ProjectView/ProjectView.jsx create mode 100644 shared/redux/actions/project.js diff --git a/server/controllers/project.controller.js b/server/controllers/project.controller.js index f1735184..d9900b98 100644 --- a/server/controllers/project.controller.js +++ b/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 + } + }); + }) } \ No newline at end of file diff --git a/shared/containers/IDEView/IDEView.jsx b/shared/containers/IDEView/IDEView.jsx index fc27642f..3de279e2 100644 --- a/shared/containers/IDEView/IDEView.jsx +++ b/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 (
@@ -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); diff --git a/shared/containers/ProjectView/ProjectView.jsx b/shared/containers/ProjectView/ProjectView.jsx new file mode 100644 index 00000000..f9a43451 --- /dev/null +++ b/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 ( +
+

{this.props.project.name}

+

+ {this.props.file.content} +

+
+ ); + } + + 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); + diff --git a/shared/redux/actions/index.js b/shared/redux/actions/index.js index bcf56bab..2a924bc4 100644 --- a/shared/redux/actions/index.js +++ b/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 { diff --git a/shared/redux/actions/project.js b/shared/redux/actions/project.js new file mode 100644 index 00000000..11028859 --- /dev/null +++ b/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 + })); + } +} \ No newline at end of file diff --git a/shared/redux/actions/user.js b/shared/redux/actions/user.js index d08d5d52..5dc2a78f 100644 --- a/shared/redux/actions/user.js +++ b/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) { diff --git a/shared/redux/constants/constants.js b/shared/redux/constants/constants.js index dc4aeabb..a1fe8529 100644 --- a/shared/redux/constants/constants.js +++ b/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'; diff --git a/shared/redux/reducers/project.js b/shared/redux/reducers/project.js index a95916e7..b4256aa8 100644 --- a/shared/redux/reducers/project.js +++ b/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; } diff --git a/shared/routes.js b/shared/routes.js index 1e4d9c3b..5f0893d3 100644 --- a/shared/routes.js +++ b/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) => { + ); }