diff options
| -rw-r--r-- | public/views/createPost.html | 8 | ||||
| -rw-r--r-- | public/views/dashboard.html | 52 | ||||
| -rw-r--r-- | routes/posts.js | 17 |
3 files changed, 68 insertions, 9 deletions
diff --git a/public/views/createPost.html b/public/views/createPost.html index e01ad55..30c9cad 100644 --- a/public/views/createPost.html +++ b/public/views/createPost.html @@ -72,7 +72,7 @@ <h1>Create New Post</h1> </header> <div class="span9" style="padding: 0; margin: 0;"> - <div id="createPost"> + <div id="createPost" class="form"> <div class="form-group"> <label for="title">Title</label> <input type="text" class="form-control" id="title" name="title" placeholder="Title" @@ -102,7 +102,11 @@ <div id="error" class="alert alert-error hidden"> <strong>Error!</strong> Please fill out all fields. </div> - <button class="btn btn-primary" id="publishPost">Create New Post</button> + <div class="control-group"> + <div class="controls"> + <button type="submit" class="btn btn-primary" id="publishPost">Create New Post</button> + </div> + </div> </div> </div> </div> diff --git a/public/views/dashboard.html b/public/views/dashboard.html index 3791678..6556fd9 100644 --- a/public/views/dashboard.html +++ b/public/views/dashboard.html @@ -45,8 +45,8 @@ <div class="span9"> <header class="page-header"> <h1>All Posts</h1> - <div id="posts"></div> </header> + <div id="posts"></div> </div> </div> </div> @@ -58,6 +58,56 @@ <script src="/static/assets/js/bootstrap-collapse.js"></script> <script src="/static/assets/js/pages/config.js"></script> <script src="/static/assets/js/pages/authCheck.js"></script> + <script> + $(document).ready(() => { + // hit api/blog/posts to get all the posts + $.ajax({ + url: '/api/blog/posts', + type: 'GET', + success: (data) => { + const posts = document.getElementById('posts'); + data.forEach(post => { + const leadParagraphCotainer = document.createElement('div'); + leadParagraphCotainer.className = 'lead'; + const title = document.createElement('h3'); + title.innerHTML = post.title; + const content = document.createElement('p'); + content.innerHTML = post.content.substring(0, 100) + '...'; + const date = document.createElement('p'); + date.innerHTML = post.publishDate; + const tags = document.createElement('p'); + post.tags.forEach(tag => { + const tagSpan = document.createElement('span'); + tagSpan.className = 'label label-info'; + tagSpan.innerHTML = tag; + tagSpan.style.marginRight = '5px'; + tags.appendChild(tagSpan); + }); + const editButton = document.createElement('a'); + editButton.className = 'btn btn-primary'; + editButton.innerHTML = 'Edit Post'; + editButton.style.marginRight = '15px'; + const deleteButton = document.createElement('a'); + deleteButton.className = 'btn btn-danger'; + deleteButton.innerHTML = 'Delete Post'; + const editButtonContainer = document.createElement('div'); + editButtonContainer.className = 'btn-group'; + editButtonContainer.appendChild(editButton); + editButtonContainer.appendChild(deleteButton); + leadParagraphCotainer.appendChild(title); + leadParagraphCotainer.appendChild(content); + leadParagraphCotainer.appendChild(date); + leadParagraphCotainer.appendChild(tags); + leadParagraphCotainer.appendChild(editButtonContainer); + posts.appendChild(leadParagraphCotainer); + }) + }, + error: (err) => { + console.log(err); + } + }); + }) + </script> </body> </html>
\ No newline at end of file diff --git a/routes/posts.js b/routes/posts.js index d81327f..3ae3a3c 100644 --- a/routes/posts.js +++ b/routes/posts.js @@ -8,7 +8,6 @@ router.get("/posts", (req, res) => { let query = store.collection("posts"); query - .limit(1) .get() .then((querySnapshot) => { querySnapshot.forEach((documentSnapshot) => { @@ -23,18 +22,24 @@ router.get("/posts", (req, res) => { router.post("/new", (req, res) => { const { title, content, tags, publishDate } = req.body; const store = firebase.firestore(); + const id = store.collection("posts").doc().id; const post = { + id, title, content, tags: String(tags).split(",").length > 0 ? String(tags).split(",") : [], publishDate, }; let query = store.collection("posts"); - query.add(post).then(() => { - res.json({ success: true }); - }).catch((err) => { - res.json({ success: false, err }); - }); + query + .doc(id) + .set(post) + .then(() => { + res.json({ success: true }); + }) + .catch((err) => { + res.json({ success: false, err }); + }); }); module.exports = router; |