Piyush Anand

package.json

@@ -1,25 +1,37 @@
 {
-  "name": "social-media-project",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "start": "node src/server.js",
-    "test": "mocha test/setup.js test/**/*.test.js",
-    "cover": "nyc --reporter=lcov npm run test"
-  },
-  "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "express": "^4.17.1",
-    "mysql2": "^2.1.0",
-    "sequelize": "^5.21.7",
-    "sqlite3": "^4.2.0"
-  },
-  "devDependencies": {
-    "chai": "^4.2.0",
-    "chai-as-promised": "^7.1.1",
-    "mocha": "^7.2.0",
-    "nyc": "^15.0.1"
-  }
-}
+    "name": "social-media-project",
+    "version": "1.0.0",
+    "description": "",
+    "main": "server.js",
+    "scripts": {
+        "start": "node src/server.js",
+        "test": "mocha test/setup.js test/**/*.test.js",
+        "cover": "nyc --reporter=lcov npm run test"
+    },
+    "author": "",
+    "license": "ISC",
+    "dependencies": {
+        "express": "^4.17.1",
+        "mysql2": "^2.1.0",
+        "sequelize": "^5.21.10",
+        "sqlite3": "^4.2.0"
+    },
+    "devDependencies": {
+        "chai": "^4.2.0",
+        "chai-as-promised": "^7.1.1",
+        "mocha": "^7.2.0",
+        "nyc": "^15.0.1"
+    },
+    "directories": {
+        "test": "test"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/creatorpiyush/Social_Media_Sample_Project_2020_May.git"
+    },
+    "keywords": [],
+    "bugs": {
+        "url": "https://github.com/creatorpiyush/Social_Media_Sample_Project_2020_May/issues"
+    },
+    "homepage": "https://github.com/creatorpiyush/Social_Media_Sample_Project_2020_May#readme"
+}

src/controllers/comments.js

@@ -0,0 +1,19 @@
+const { Posts, Users, Comments } = require("../db/models");
+
+async function createComment(user_id, post_id, comment_body) {
+    let user = await Users.findOne({
+        where: {
+            id: user_id,
+        },
+    })
+
+    return await Comments.create({
+        body: comment_body,
+        title: user.username,
+        userId: user_id,
+        postId: post_id,
+    })
+}
+module.exports = {
+    createComment,
+}

src/controllers/posts.js

@@ -1,34 +1,34 @@
-const { Posts, Users } = require('../db/models')
+const { Posts, Users, Comments } = require('../db/models')
 
 async function createNewPost(userId, title, body) {
-  const post = await Posts.create({
-    title,
-    body,
-    userId,
-  })
+    const post = await Posts.create({
+        title,
+        body,
+        userId,
+    })
 
-  return post
+    return post
 }
 
 /**
  * showAllPosts({username: ''})
  * showAllPosts({title: ''})
  */
 async function findAllPosts(query) {
-  let where = {}
-  if (query.userId) { where.userId = query.userId }
-  
-  const posts = await Posts.findAll({
-    include: [ Users ],
-    where
-  })
-
-  return posts
+    let where = {}
+    if (query.userId) { where.userId = query.userId }
+
+    const posts = await Posts.findAll({
+        include: [Users, Comments],
+        where
+    })
+
+    return posts
 }
 
 module.exports = {
-  createNewPost,
-  findAllPosts
+    createNewPost,
+    findAllPosts
 }
 
 /* Test Code */

src/db/models.js

@@ -1,55 +1,56 @@
 const Sequelize = require('sequelize')
 
+
 let db
-if (process.env.NODE_ENV == 'testing') {
-  db = new Sequelize({
-    dialect: 'sqlite',
-    storage: ':memory:',
-  })
+
+if (process.env.NODE_ENV == "testing") {
+    db = new Sequelize({
+        dialect: "sqlite",
+        storage: __dirname + "/test.db"
+    })
 } else {
-  db = new Sequelize({
-    dialect: 'mysql',
-    database: 'cbsocialmediadb',
-    username: 'cbsocialuser',
-    password: 'cbsocialpass',
-  })
+    db = new Sequelize({
+        dialect: "sqlite",
+        storage: __dirname + "/media.db"
+    })
 }
 
+
 const COL_ID_DEF = {
-  type: Sequelize.DataTypes.INTEGER,
-  autoIncrement: true,
-  primaryKey: true,
+    type: Sequelize.DataTypes.INTEGER,
+    autoIncrement: true,
+    primaryKey: true,
 }
 const COL_USERNAME_DEF = {
-  type: Sequelize.DataTypes.STRING(30),
-  unique: true,
-  allowNull: false,
+    type: Sequelize.DataTypes.STRING(30),
+    unique: true,
+    allowNull: false,
 }
 const COL_TITLE_DEF = {
-  type: Sequelize.DataTypes.STRING(140),
-  allowNull: false,
+    type: Sequelize.DataTypes.STRING(140),
+    allowNull: false,
 }
 
 const Users = db.define('user', {
-  id: COL_ID_DEF,
-  username: COL_USERNAME_DEF,
+    id: COL_ID_DEF,
+    username: COL_USERNAME_DEF,
 })
 
 const Posts = db.define('post', {
-  id: COL_ID_DEF,
-  title: COL_TITLE_DEF,
-  body: {
-    type: Sequelize.DataTypes.TEXT,
-    allowNull: false,
-  },
+    id: COL_ID_DEF,
+    title: COL_TITLE_DEF,
+    body: {
+        type: Sequelize.DataTypes.TEXT,
+        allowNull: false,
+    },
 })
 
 const Comments = db.define('comment', {
-  id: COL_ID_DEF,
-  title: COL_TITLE_DEF,
-  body: {
-    type: Sequelize.DataTypes.TEXT('tiny'),
-  },
+    id: COL_ID_DEF,
+    title: COL_TITLE_DEF,
+    body: {
+        type: Sequelize.DataTypes.TEXT('tiny'),
+    },
 })
 
 Users.hasMany(Posts)
@@ -62,8 +63,8 @@ Posts.hasMany(Comments)
 Comments.belongsTo(Posts)
 
 module.exports = {
-  db,
-  Users,
-  Posts,
-  Comments,
-}
+    db,
+    Users,
+    Posts,
+    Comments,
+}

src/public/app/all-posts.js

@@ -1,25 +1,41 @@
 function loadPosts() {
-  $.get('/api/posts', (posts) => {
-    for (let p of posts) {
-      $('#posts-container').append(
-        $(`
-        <div class="col-4">
-          <div class="card m-2">
-            <div class="card-body">
-              <h5 class="card-title">${p.title}</h5>
-              <h6 class="card-subtitle mb-2 text-muted">${p.user.username}</h6>
-              <p class="card-text">
-                ${p.body.substr(0, 200)}
-                <a href="#">...read more</a>
-              </p>
-              <a href="#" class="card-link">Comment</a>
-              <a href="#" class="card-link">Like</a>
-            </div>
-          </div>
-        </div>
-
-        `)
-      )
-    }
-  })
-}
+    $.get("/api/posts", (posts) => {
+
+        for (let p of posts) {
+            let item = $(`
+                    <div class="col-4">
+                      <div class="card m-2">
+                        <div class="card-body">
+                          <h5 class="card-title">${p.title}</h5>
+                          <h6 class="card-subtitle mb-2 text-muted">${p.user.username}</h6>
+                          <p class="card-text">${p.body.substr(0, 200)}<a href="#">...read more</a></p>
+                          <input type="text" placeholder="add suggestions" class="newComment">
+                          <button class="card-link btnComment">Comment</button> 
+                          <ul class="comment"></ul> 
+                          </div>
+                        </div>
+                      </div>
+                    `);
+            let commentBox = item.find(".comment");
+            for (let comment of p.comments) {
+                commentBox.append(
+                    $("<li></li>").text(`[${comment.title}] : ${comment.body}`)
+                );
+            }
+
+            item.find(".btnComment").on("click", () => {
+                $.post(
+                    "/api/comments", {
+                        post_id: p.id,
+                        comment_body: item.find(".newComment").val(),
+                        user_id: JSON.parse(window.localStorage.user).id,
+                    },
+                    (comment) => {
+                        $("#content").load(`/components/all-posts.html`);
+                    }
+                )
+            })
+            $("#posts-container").append(item);
+        }
+    })
+}

src/public/components/all-posts.html

@@ -1,11 +1,11 @@
 <div class="container my-2">
-  <h1 class="h1 text-center">Recent Posts</h1>
+    <h1 class="h1 text-center">Recent Posts</h1>
 
-  <div class="row" id="posts-container">
-  </div>
+    <div class="row" id="posts-container">
+    </div>
 </div>
 
-<script src="/app/my-posts.js"></script>
+<script src="/app/all-posts.js"></script>
 <script>
-  loadPosts()
+    loadPosts()
 </script>

src/public/components/my-posts.html

@@ -1,11 +1,11 @@
 <div class="container my-2">
-  <h1 class="h1 text-center">Recent Posts</h1>
+    <h1 class="h1 text-center">Recent Posts</h1>
 
-  <div class="row" id="posts-container">
-  </div>
+    <div class="row" id="posts-container">
+    </div>
 </div>
 
-<script src="/app/all-posts.js"></script>
+<script src="/app/my-posts.js"></script>
 <script>
-  loadMyPosts()
+    loadMyPosts()
 </script>