首頁 探索 說明
註冊 登入
lee
/
leemorgan-dev
1
0
複刻 0
Files 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Display articles.

Lee Morgan 5 年之前
父節點
693cc99dd1
當前提交
04c3f40ea0
共有 7 個文件被更改，包括 116 次插入 和 1 次删除
分割檢視 顯示文件統計
  1. 24 0
      controllers/blog.js
  2. 1 0
      models/blog.js
  3. 3 0
      routes.js
  4. 26 0
      views/blog/index.css
  5. 51 0
      views/blog/index.html
  6. 9 1
      views/blog/new.html
  7. 2 0
      views/main/index.html

+ 24 - 0
controllers/blog.js
查看文件 

@@ -1,5 +1,6 @@
 
 const Blog = require("../models/blog.js");
 
 const Uploader = require("../models/uploader.js");
 
+const createId = require("./createId.js");
 
 
 module.exports = {
 
     /*
 
@@ -11,6 +12,9 @@ module.exports = {
 
         tags: String
 
         blog: String
 
     }
 
+    req.files = {
 
+        thumbnail: File
 
+    }
 
     redirect to home
 
     */
 
     create: function(req, res){
 
@@ -19,10 +23,14 @@ module.exports = {
 
                 if(uploader === "none") throw "uploader";
 
                 if(req.body.password !== uploader.password) throw "pass";
 
 
+                let fileString = `/thumbNails/${createId(25)}`;
 
+                req.files.thumbnail.mv(`${__dirname}/..${fileString}`);
 
+
 
                 let blog = new Blog({
 
                     writer: uploader._id,
 
                     title: req.body.title,
 
                     tags: req.body.tags.split(","),
 
+                    thumbnail: fileString,
 
                     article: req.body.blog
 
                 });
 
 
@@ -48,5 +56,21 @@ module.exports = {
 
             .catch((err)=>{
 
                 return res.json("ERROR: could not retrieve blog data");
 
             });
 
+    },
 
+
 
+    /*
 
+    GET: gets a single blog
 
+    req.params.id = String (blog id)
 
+    response = Blog
 
+    */
 
+    getBlog: function(req, res){
 
+        Blog.findOne({_id: req.params.id})
 
+            .populate("writer")
 
+            .then((blog)=>{
 
+                return res.json(blog);
 
+            })
 
+            .catch((err)=>{
 
+                return res.json("Error: unable to retrieve the blog");
 
+            });
 
     }
 
 }

+ 1 - 0
models/blog.js
查看文件 

@@ -11,6 +11,7 @@ const BlogSchema = new mongoose.Schema({
 
         required: true
 
     },
 
     tags: [String],
 
+    thumbnail: String,
 
     article: {
 
         type: String,
 
         required: true

+ 3 - 0
routes.js
查看文件 

@@ -18,9 +18,12 @@ module.exports = function(app){
 
     app.get("/writing/directories", writing.listDirectories);
 
 
     //BLOG
 
+    app.get("/blog/style", (req, res)=>{res.sendFile(`${views}/blog/index.css`)});
 
     app.get("/blog/new", (req, res)=>{res.sendFile(`${views}/blog/new.html`)});
 
     app.post("/blog/new", blog.create);
 
     app.get("/blog/retrieve", blog.getBlogs);
 
+    app.get("/blog/json/:id", blog.getBlog);
 
+    app.get("/blog/:id", (req, res)=>{res.sendFile(`${views}/blog/index.html`)});
 
 
     //IMAGES
 
     app.get("/images/subline", (req, res)=>{res.sendFile(`${views}/images/subline.png`)});

+ 26 - 0
views/blog/index.css
查看文件 

@@ -0,0 +1,26 @@
 
+*{margin:0;padding:0;}
 
+
 
+body{
 
+    background: rgb(196, 198, 192);
 
+    padding: 25px;
 
+    font-family: monospace;
 
+}
 
+
 
+#contents{
 
+    display: flex;
 
+    flex-direction: column;
 
+    align-items:center;
 
+    max-width: 1000px;
 
+    margin: auto;
 
+}
 
+
 
+    #article{
 
+        margin-top: 35px;
 
+    }
 
+
 
+        p{
 
+            margin: 20px 0;
 
+            font-size: 20px;
 
+            line-height: 1.5;
 
+            text-indent: 35px;
 
+        }

+ 51 - 0
views/blog/index.html
查看文件 

@@ -0,0 +1,51 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+    <head>
 
+        <meta charset="utf-8">
 
+        <title>Lee Morgan -blog-</title>
 
+        <link rel="stylesheet" href="/blog/style">
 
+    </head>
 
+    <body>
 
+        <div id="contents">
 
+            <h1 id="title"></h1>
 
+            
+            <h3 id="author"></h3>
 
+            
+            <h4 id="date"></h4>
 
+            
+            <div id="article"></div>
 
+        </div>
 
+
 
+        <script>
 
+            let id = window.location.pathname.split("/");
 
+            id = id[id.length-1];
 
+
 
+            fetch(`/blog/json/${id}`)
 
+                .then(response => response.json())
 
+                .then((response)=>{
 
+                    let date = new Date(response.date);
 
+                    dateOptions = {
 
+                        year: "numeric",
 
+                        day: "numeric",
 
+                        month: "long"
 
+                    }
 
+
 
+                    console.log(response);
 
+                    document.getElementById("title").innerText = response.title;
 
+                    document.getElementById('author').innerText = response.writer.name;
 
+                    document.getElementById("date").innerText = date.toLocaleDateString("en-us", dateOptions);
 
+                    
+                    let container = document.getElementById("article");
 
+                    let paragraphs = response.article.split("\r\n");
 
+                    for(let i = 0; i < paragraphs.length; i++){
 
+                        let p = document.createElement("p");
 
+                        p.innerText = paragraphs[i];
 
+                        container.appendChild(p);
 
+                    }
 
+                })
 
+                .catch((err)=>{
 
+                    console.log(err);
 
+                });
 
+        </script>
 
+    </body>
 
+</html>

+ 9 - 1
views/blog/new.html
查看文件 

@@ -19,7 +19,11 @@
 
         </style>
 
     </head>
 
     <body>
 
-        <form action="/blog/new" method="post">
 
+        <form
 
+            action="/blog/new"
 
+            method="post"
 
+            enctype="multipart/form-data"    
+        >
 
             <label>Uploader
 
                 <input name="uploader" type="text" required>
 
             </label>
 
@@ -40,6 +44,10 @@
 
                 <textarea name="blog" required></textarea>
 
             </label>
 
 
+            <label>Thumbnail
 
+                <input name="thumbnail" type="file">
 
+            </label>
 
+
 
             <input type="submit" value="Submit">
 
         </form>
 
     </body>

+ 2 - 0
views/main/index.html
查看文件 

@@ -233,6 +233,8 @@
 
                     let card = template.cloneNode(true);
 
                     card.href = `/blog/${blogs[i]._id}`;
 
                     card.children[0].innerText = blogs[i].title;
 
+                    card.children[1].src = blogs[i].thumbnail;
 
+                    card.children[1].alt = `${blogs[i].title} thumbnail`;
 
                     container.appendChild(card);
 
                 }
 
             }