From 1d3d323c66802fd82c4100b87a011a7aa88bb9f7 Mon Sep 17 00:00:00 2001 From: Xhonia Robinson Date: Thu, 10 Aug 2017 16:57:02 -0700 Subject: [PATCH] populating --- backend/models.js | 1 - backend/routes/routes.js | 35 ++++++++++++++++++++++----------- reactApp/components/Docs.js | 17 ++++++++-------- reactApp/components/MyEditor.js | 33 +++++++++++++++++++++++++------ reactApp/components/Toolbar.js | 19 ++++++++++++------ 5 files changed, 72 insertions(+), 33 deletions(-) diff --git a/backend/models.js b/backend/models.js index d446ca5..9d027fc 100644 --- a/backend/models.js +++ b/backend/models.js @@ -12,7 +12,6 @@ var userSchema = mongoose.Schema({ var documentSchema = mongoose.Schema({ title: String, - date: String, content:Object, author: { type: mongoose.Schema.Types.ObjectId, diff --git a/backend/routes/routes.js b/backend/routes/routes.js index 161b020..2f9e188 100644 --- a/backend/routes/routes.js +++ b/backend/routes/routes.js @@ -30,17 +30,18 @@ router.use(function(req, res, next){ // }); router.post('/newdoc', function(req,res){ - console.log("body", req.body); + // console.log("body.content", req.body.content); // console.log("req.user?", req.user); - Document.findById(id, function(err, dock){ + Document.find({title:req.body.title}, function(err, dock){ + console.log("THIS IS DOCK:", dock); if (err){ console.log("error in doc find"); - } else if (!dock){ + } else if (dock.length === 0){ + console.log("HALP"); var doc = new Document({ - title: req.body.title, - date: req.body.date, + title: req.body.body.title, author: req.user, - content: req.body.content + content: req.body.body.content }) doc.save(function(err, doc) { if (err) { @@ -52,10 +53,10 @@ router.post('/newdoc', function(req,res){ res.send('created'); }); } else{ - console.log("dock in else", dock); - dock.title= req.body.title, - dock.content=req.body.content, - dock.save(function(err,doc){ + console.log("dock in else", req.body); + dock[0].title= req.body.body.title, + dock[0].content=req.body.body.content, + dock[0].save(function(err,doc){ if (err){ console.log("robinson",err); res.status(500).send('ERR'); @@ -92,7 +93,19 @@ router.get('/doclist', function(req, res){ }) // console.log("array of docs? or objects?", Doc); }) - +router.get('/opendoc', function(req,res){ + console.log("getting doc info to pop editor", req.query); + Document.findById(req.query.id, function(err, doc){ + if(err){ + console.log("problem getting doc info to popualte editor", err); + res.status(500).send('ERR'); + return; + }else { + console.log("got doc info", doc); + res.send(doc) + } + }) +}) router.get('/protected', function(req, res, next) { console.log('user reached backend') res.send('yo') diff --git a/reactApp/components/Docs.js b/reactApp/components/Docs.js index e120144..0007a9b 100644 --- a/reactApp/components/Docs.js +++ b/reactApp/components/Docs.js @@ -45,14 +45,14 @@ class Docs extends React.Component { console.log("createDoc clicked"); this.props.history.push('/editor') } - docClick(e){ - - console.log("doc that was clicked:", e.currentTarget.textContent); - // axios.get('http://localhost:3000/newdoc', { - // e.currentTarget.textContent - // }) - this.props.history.push('/editor') - } + // docClick(e){ + // + // console.log("doc that was clicked:", e.currentTarget.textContent); + // // axios.get('http://localhost:3000/newdoc', { + // // e.currentTarget.textContent + // // }) + // this.props.history.push('/editor') + // } render(){ var modalClass1 = classNames({ 'modal': true, @@ -77,7 +77,6 @@ class Docs extends React.Component { { this.modal1Toggle(e) this.createDoc(e) - this.props.history.push('/editor') }}/> diff --git a/reactApp/components/MyEditor.js b/reactApp/components/MyEditor.js index 70ee23b..4d90e92 100644 --- a/reactApp/components/MyEditor.js +++ b/reactApp/components/MyEditor.js @@ -1,6 +1,6 @@ var React = require('react'); import ReactDOM from 'react-dom'; -import {Editor, EditorState, Modifier, RichUtils, ContentState, convertFromoRaw} from 'draft-js'; +import {Editor, EditorState, Modifier, RichUtils, ContentState, convertFromRaw} from 'draft-js'; import Toolbar from './Toolbar'; import Register from './Register'; var axios = require('axios'); @@ -121,17 +121,38 @@ const ColorControls = (props) => { class MyEditor extends React.Component { constructor(props) { super(props); - this.state = {editorState: EditorState.createEmpty()}; + this.state = { + editorState: EditorState.createEmpty(), + title: "Untitled" + }; this.focus = () => this.refs.editor.focus(); this.onChange = (editorState) => this.setState({editorState}); this.toggleColor = (toggledColor) => this.toggleColor(toggledColor); } componentDidMount(){ - console.log("state:", this.state.editorState); - axios.get('http://localhost:3000/doc') + console.log("props", this.props.match); + fetch(`http://localhost:3000/opendoc?id=${this.props.match.params.id}`, { + credentials: 'include', + }) .then((response)=>{ - console.log("find the raw content to convert from:", response.data); + // console.log("find the raw content to convert from:", response.json()); + // var notRaw = convertFromRaw(response.data.content); + // console.log("converted from raw", notRaw); + // this.setState({ + // editorState: EditorState.createWithContent(notRaw), + // title: response.data.title + // }) + return response.json(); + }) + .then((resp) => { + console.log("RESP: ", resp); + var notRaw = convertFromRaw(JSON.parse(resp.content)); + console.log("converted from raw", notRaw); + this.setState({ + editorState: EditorState.createWithContent(notRaw), + title: resp.title + }) }) .catch((err)=>{ console.log("error getting doc page", err); @@ -216,7 +237,7 @@ class MyEditor extends React.Component { onToggle={this.toggleColor} /> */} - this.boldClicked(e)} + this.boldClicked(e)} italicClicked={(e) => this.italicClicked(e)} underlineClicked={(e) => this.underlineClicked(e)} codeClicked={(e) => this.codeClicked(e)} diff --git a/reactApp/components/Toolbar.js b/reactApp/components/Toolbar.js index 9fe8383..c1b4a2d 100644 --- a/reactApp/components/Toolbar.js +++ b/reactApp/components/Toolbar.js @@ -7,7 +7,7 @@ class Toolbar extends React.Component { constructor(props){ super(props); this.state = { - title: "Untitled Document", + title: this.props.title, modal: false } } @@ -17,12 +17,19 @@ class Toolbar extends React.Component { var rawContent = convertToRaw(content) console.log("raw content state:", rawContent); var date = new Date(); + //{content:JSON.stringify(rawContent), title: this.state.title} axios.post('http://localhost:3000/newdoc', { - title: this.state.title, - date: date, - content: rawContent - - }) + method: "POST", + credentials: 'include', + headers: {'Content-Type': 'application/json'}, + body: {content:JSON.stringify(rawContent), title: this.state.title} + } ) + // fetch('http://localhost:3000/newdoc', { + // method: "POST", + // credentials: 'include', + // headers: {'Content-Type': 'application/json'}, + // body: {name: "xhonia"} + // }) .then(function (response) { console.log("success response on creat doc",response); //if response is good, do something maybe?