diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/html/blog-single.html | 61 | ||||
| -rw-r--r-- | src/html/blog.html | 27 | ||||
| -rw-r--r-- | src/html/feed.html | 4 | ||||
| -rw-r--r-- | src/html/index.html | 9 | ||||
| -rw-r--r-- | src/html/post-single.html | 41 | ||||
| -rw-r--r-- | src/html/projects.html | 1 | ||||
| -rw-r--r-- | src/html/tags.html | 2 | ||||
| -rw-r--r-- | src/server.js | 21 |
8 files changed, 82 insertions, 84 deletions
diff --git a/src/html/blog-single.html b/src/html/blog-single.html deleted file mode 100644 index 75cbf92..0000000 --- a/src/html/blog-single.html +++ /dev/null @@ -1,61 +0,0 @@ -<!doctype html> -<html lang="en"> - -<head> - <title>Mark's Kitchen - Blog</title> - <meta charset="UTF-8"> - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> - <link rel="stylesheet" type="text/css" href="/css/styles.css"> - <script src="https://cdn.jsdelivr.net/npm/vue"></script> - <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> --> - <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> - <script> - window.onload = function () { - var feed = new Vue({ - el: '.feed', - data: { - posts: [] - }, - created() { - var id = parseInt(window.location.pathname.split("/")[2]); - fetch(new Request('/posts/blog')).then(response => response.json()) - .then(response => { response.forEach(post => { - if(post.id == id){ - post.description = marked(post.description) - this.posts.push(post); - } - }); - }); - } - }); - } - </script> -</head> - -<body> - <div> - <h1> - <a class="navigation" href="/" title="marks.kitchen"><</a> - <a class="navigation" href="/blog" title="marks.kitchen/blog"><</a> - Blog - </h1> - <div id="feed" class="feed"> - <div class="card" v-for="post in posts"> - <p class="card-text" v-html="post.description"></p> - <div class="card-img"> - <span v-for="image in post.images"> - <a v-bind:href="image"><img v-bind:src="image"></a> - </span> - </div> - <p class="date"> - <a v-bind:href="'/blog/'+post.id">{{ post.createdAt.substring(0,10) }}</a> - <span v-for="tag in post.tags"> - <a class="tag" v-bind:href="'/tags#'+tag">{{tag}}</a> - </span> - </p> - </div> - </div> - </div> -</body> - -</html>
\ No newline at end of file diff --git a/src/html/blog.html b/src/html/blog.html index c034711..c0662f7 100644 --- a/src/html/blog.html +++ b/src/html/blog.html @@ -6,11 +6,12 @@ <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" type="text/css" href="/css/styles.css"> - <script src="https://cdn.jsdelivr.net/npm/vue"></script> - <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> --> - <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> + <script src="/js/feed.js"></script> + <!-- <script src="https://cdn.jsdelivr.net/npm/vue"></script> --> + <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> + <!-- <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> --> <script> - window.onload = function () { + window.onload = loadFeed(function () { var feed = new Vue({ el: '.feed', data: { @@ -18,15 +19,12 @@ }, created() { fetch(new Request('/posts/blog')).then(response => response.json()) - .then(response => { response.forEach(post => { - post.description = marked(post.description) - this.posts.push(post); - }); - }); - } - }); + .then(response => this.posts = response); } + }); + }) </script> + </head> <body> @@ -35,7 +33,7 @@ <a class="navigation" href="/" title="marks.kitchen"><</a> Blog </h1> - <div id="feed" class="feed"> + <!-- <div id="feed" class="feed"> <div class="card" v-for="post in posts"> <p class="card-text" v-html="post.description"></p> <div class="card-img"> @@ -44,13 +42,14 @@ </span> </div> <p class="date"> - <a v-bind:href="'/blog/'+post.id">{{ post.createdAt.substring(0,10) }}</a> + <a v-bind:href="'/blog/'+post.id">{{{ post.createdAt.substring(0,10) }}}</a> <span v-for="tag in post.tags"> <a class="tag" v-bind:href="'/tags#'+tag">{{tag}}</a> </span> </p> </div> - </div> + </div> --> + <div id="feed" class="feed"></div> </div> </body> diff --git a/src/html/feed.html b/src/html/feed.html index 15a364d..7128174 100644 --- a/src/html/feed.html +++ b/src/html/feed.html @@ -3,11 +3,11 @@ <p class="card-text" v-html="post.description"></p> <div class="card-img"> <span v-for="image in post.images"> - <a v-bind:href="image"><img v-bind:src="image"></a> + <a v-bind:href="'/'+image"><img v-bind:src="'/'+image"></a> </span> </div> <p class="date"> - {{ post.createdAt.substring(0,10) }} + <a v-bind:href="'/post/'+post.type+'/'+post.id">{{ post.createdAt.substring(0,10) }}</a> <span v-for="tag in post.tags"> <a class="tag" v-bind:href="'/tags#'+tag">{{tag}}</a> </span> diff --git a/src/html/index.html b/src/html/index.html index ce67842..f51122b 100644 --- a/src/html/index.html +++ b/src/html/index.html @@ -36,11 +36,12 @@ <a href="misc" class="btn btn-primary">Misc</a> </nav> - <div id="feed"></div> + <div id="feed"> + </div> - <footer> - <div>Mark Powers</div> - </footer> + <!-- <footer> + <div>Mark Powers 2020</div> + </footer> --> </body> </html>
\ No newline at end of file diff --git a/src/html/post-single.html b/src/html/post-single.html new file mode 100644 index 0000000..221ade4 --- /dev/null +++ b/src/html/post-single.html @@ -0,0 +1,41 @@ +<!doctype html> +<html lang="en"> + +<head> + <title>Mark's Kitchen - Blog</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + <link rel="stylesheet" type="text/css" href="/css/styles.css"> + <script src="/js/feed.js"></script> + <script src="https://cdn.jsdelivr.net/npm/vue"></script> + <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> --> + <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> + <script> + window.onload = loadFeed(function () { + var feed = new Vue({ + el: '.feed', + data: { + posts: [] + }, + created() { + var name = window.location.pathname.split("/")[2]; + var id = parseInt(window.location.pathname.split("/")[3]); + fetch(new Request('/posts/'+name+"/"+id)).then(response => response.json()) + .then(response => { response.forEach(post => this.posts = response); + }); + } + }); + }) + </script> +</head> + +<body> + <div> + <h1> + <a class="navigation" href="/" title="marks.kitchen"><</a> + </h1> + <div id="feed"></div> + </div> +</body> + +</html>
\ No newline at end of file diff --git a/src/html/projects.html b/src/html/projects.html index 16d3f25..f71c833 100644 --- a/src/html/projects.html +++ b/src/html/projects.html @@ -33,6 +33,7 @@ <div> <h1> <a class="navigation" href="/" title="marks.kitchen"><</a> + <a class="navigation" href="/misc" title="marks.kitchen/misc"><</a> Projects </h1> <h2>A collection of my projects, mostly programming</h2> diff --git a/src/html/tags.html b/src/html/tags.html index 7f2cb16..c6e4022 100644 --- a/src/html/tags.html +++ b/src/html/tags.html @@ -32,7 +32,7 @@ <body> <div id="view"> - <h1>Viewing: {{tag}}</h1> + <h1><a class="navigation" href="/" title="marks.kitchen"><</a>{{tag}}</h1> <div id="feed"></div> </div> </body> diff --git a/src/server.js b/src/server.js index 72cc417..b92d7d4 100644 --- a/src/server.js +++ b/src/server.js @@ -143,8 +143,8 @@ function setUpRoutes(models, jwtFunctions, database) { res.status(400).send(e.message); } }) - server.get('/blog/:id', async (req, res, next) => { - res.sendFile(__dirname + "/html/blog-single.html"); + server.get('/post/:type/:id', async (req, res, next) => { + res.sendFile(__dirname + "/html/post-single.html"); }) server.get('/tags/:name', async (req, res, next) => { console.log("TAGS/NAME"); @@ -181,6 +181,23 @@ function setUpRoutes(models, jwtFunctions, database) { res.status(400).send(e.message); } }) + server.get('/posts/:type/:id', async (req, res, next) => { + try { + const { type, id } = req.params; + var posts = await models.posts.findAll({ + where: { + type: type, + id: id + }, order: [['createdAt', 'DESC']] + }); + posts = posts.map(x => x.get({ plain: true })); + await addImagesAndTagsToPosts(models, posts) + res.status(200).send(posts); + next(); + } catch (e) { + res.status(400).send(e.message); + } + }) server.post('/posts', upload.array('images'), async (req, res, next) => { try { const type = req.body.type |