Blog Posting Done

Aditya-0712 · Jul 21, 2023 · a60edb7 · a60edb7
1 parent 0791719
commit a60edb7
Show file tree

Hide file tree

Showing 8 changed files with 104 additions and 7 deletions.
diff --git a/models/blog.js b/models/blog.js
@@ -3,16 +3,17 @@ var currBlog = [];
 
 module.exports = class newBlog
 {
-    constructor(title, content)
+    constructor(user, title, content)
     {
+        this.user = user;
         this.title = title;
         this.content = content;
         this.id = Math.random().toString();
     }
 
     save()
     {
-        const tmp = {TITLE:this.title, CONTENT:this.content, ID:this.id};
+        const tmp = {USER:this.user, TITLE:this.title, CONTENT:this.content, ID:this.id};
         arr.push(tmp);
         currBlog = [];
         currBlog.push(tmp);

diff --git a/public/css/home.css b/public/css/home.css
@@ -261,6 +261,13 @@ body
     background-color: rgb(107, 34, 176);
 }
 
+.null
+{
+    font:17px helvetica-reg;
+    color:rgba(0, 0, 0, 0.4);
+    margin:30px auto 0px auto;
+}
+
 @media screen and (min-width:800px)
 {
     .topbar

diff --git a/public/css/myBlogs.css b/public/css/myBlogs.css
@@ -261,6 +261,13 @@ body
     background-color: rgb(107, 34, 176);
 }
 
+.null
+{
+    font:17px helvetica-reg;
+    color:rgba(0, 0, 0, 0.4);
+    margin:30px auto 0px auto;
+}
+
 @media screen and (min-width:800px)
 {
     .topbar

diff --git a/routes/slash-home.js b/routes/slash-home.js
@@ -1,9 +1,12 @@
 const exp = require('express');
+const newBlog = require('../models/blog');
 const route = exp.Router();
-const path = require('path');
 
 route.get('/home', (req,res) => {
-    res.sendFile(path.join(__dirname, '../', 'views', 'home.html'));
+    const arr = newBlog.getAllBLogs();
+    const data ={arr:arr};
+
+    res.render('home', data);
 })
 
 module.exports = route;
diff --git a/routes/slash-post.js b/routes/slash-post.js
@@ -9,13 +9,13 @@ route.get('/post', (req,res) => {
 })
 
 route.post('/post', (req,res) => {
-    const obj = new newBlog(req.body.TITLE, req.body.BLOG);
+    const currProfile = addProfile.getCurrentUser();
+
+    const obj = new newBlog(currProfile[0].USERNAME, req.body.TITLE, req.body.BLOG);
     obj.save();
 
     const latestBlog = newBlog.getLastBlog();
 
-    const currProfile = addProfile.getCurrentUser();
-
     addProfile.saveBlog(latestBlog[0].ID, currProfile[0].USERNAME); 
     res.redirect('/home');
 })

diff --git a/views/home.ejs b/views/home.ejs
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>BlogBase | Home</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="../css/fonts.css">
+        <link rel="stylesheet" href="../css/home.css">
+    </head>
+    <body>
+
+        <div class="pctopbar">
+            <img src="../images/main_logo.png" alt="logo">
+            <p>BlogBase</p>
+            <div class="under"><a href="/account">My Account</a><div></div></div>
+            <div class="under"><a href="/myblogs">My Blogs</a><div></div></div>
+            <div class="under"><a href="/" style="color:red">Logout</a><div style="background-color:red"></div></div>
+        </div>
+
+        <div class="topbar">
+            <img src="../images/main_logo.png" alt="logo">
+            <p>BlogBase</p>
+            <div class="ham" id="ham">
+                <div></div>
+                <div></div>
+                <div></div>
+            </div>
+        </div>
+
+        <div class="sidebar" id="sidebar">
+            <div class="header">
+                <img src="../images/main_logo.png" alt="logo">
+                <p>BlogBase</p>
+            </div>
+            <a href="/account" style="margin-top: 60px;">My Account</a>
+            <a href="/myblogs">My Blogs</a>
+            <a href="/" style="color:red">Logout</a>
+        </div>
+
+        <p class="title">LATEST BLOGS</p>
+
+        <% if(arr.length==0){ %>
+            <p class="null">No Latest Blogs Posted :(</p>
+        <% } else{ %>
+            <% for(let i=0; i<arr.length; i++){ %>
+                <div class="post">
+                    <div class="ptop">
+                        <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
+                            <path d="M406.5 399.6C387.4 352.9 341.5 320 288 320H224c-53.5 0-99.4 32.9-118.5 79.6C69.9 362.2 48 311.7 48 256C48 141.1 141.1 48 256 48s208 93.1 208 208c0 55.7-21.9 106.2-57.5 143.6zm-40.1 32.7C334.4 452.4 296.6 464 256 464s-78.4-11.6-110.5-31.7c7.3-36.7 39.7-64.3 78.5-64.3h64c38.8 0 71.2 27.6 78.5 64.3zM256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-272a40 40 0 1 1 0-80 40 40 0 1 1 0 80zm-88-40a88 88 0 1 0 176 0 88 88 0 1 0 -176 0z"/>
+                        </svg>
+                        <div>
+                            <p class="user"><%= arr[i].USER %></p>
+                            <p class="blog_title"><%= arr[i].TITLE %></p>
+                        </div>
+                    </div>
+                    <p class="content"><%= arr[i].CONTENT %></p>
+
+                    <div class="likes">
+                        <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
+                            <path d="M323.8 34.8c-38.2-10.9-78.1 11.2-89 49.4l-5.7 20c-3.7 13-10.4 25-19.5 35l-51.3 56.4c-8.9 9.8-8.2 25 1.6 33.9s25 8.2 33.9-1.6l51.3-56.4c14.1-15.5 24.4-34 30.1-54.1l5.7-20c3.6-12.7 16.9-20.1 29.7-16.5s20.1 16.9 16.5 29.7l-5.7 20c-5.7 19.9-14.7 38.7-26.6 55.5c-5.2 7.3-5.8 16.9-1.7 24.9s12.3 13 21.3 13L448 224c8.8 0 16 7.2 16 16c0 6.8-4.3 12.7-10.4 15c-7.4 2.8-13 9-14.9 16.7s.1 15.8 5.3 21.7c2.5 2.8 4 6.5 4 10.6c0 7.8-5.6 14.3-13 15.7c-8.2 1.6-15.1 7.3-18 15.1s-1.6 16.7 3.6 23.3c2.1 2.7 3.4 6.1 3.4 9.9c0 6.7-4.2 12.6-10.2 14.9c-11.5 4.5-17.7 16.9-14.4 28.8c.4 1.3 .6 2.8 .6 4.3c0 8.8-7.2 16-16 16H286.5c-12.6 0-25-3.7-35.5-10.7l-61.7-41.1c-11-7.4-25.9-4.4-33.3 6.7s-4.4 25.9 6.7 33.3l61.7 41.1c18.4 12.3 40 18.8 62.1 18.8H384c34.7 0 62.9-27.6 64-62c14.6-11.7 24-29.7 24-50c0-4.5-.5-8.8-1.3-13c15.4-11.7 25.3-30.2 25.3-51c0-6.5-1-12.8-2.8-18.7C504.8 273.7 512 257.7 512 240c0-35.3-28.6-64-64-64l-92.3 0c4.7-10.4 8.7-21.2 11.8-32.2l5.7-20c10.9-38.2-11.2-78.1-49.4-89zM32 192c-17.7 0-32 14.3-32 32V448c0 17.7 14.3 32 32 32H96c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32H32z"/>
+                        </svg>
+                        <p>0</p>
+                    </div>
+                </div>
+            <% } %>
+        <% } %>
+
+        <a href="/post" class="plus">
+            <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512">
+                <path d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"/>
+            </svg>
+        </a>
+
+        <script src="../js/home.js"></script>
+    </body>
+</html>
diff --git a/views/home.html b/views/home.html
@@ -38,6 +38,8 @@
 
         <p class="title">LATEST BLOGS</p>
 
+        <p class="null">No Latest Blogs Posted :(</p>
+
         <div class="post">
             <div class="ptop">
                 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">

diff --git a/views/myBlogs.html b/views/myBlogs.html
@@ -38,6 +38,8 @@
 
         <p class="title">MY BLOGS</p>
 
+        <p class="null">No Blogs Posted By You! :(</p>
+
         <div class="post">
             <div class="ptop">
                 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">