diff --git a/public/script.js b/public/script.js index b677186..dc0f88f 100644 --- a/public/script.js +++ b/public/script.js @@ -5,49 +5,45 @@ if (document.readyState !== 'loading') { } function ready () { - getBlogposts('/get-posts'); - + getBlogposts("/posts"); // send posts to server - var form = document.querySelector('form'); + const form = document.querySelector('form'); form.addEventListener('submit', function (event) { - event.preventDefault(); // prevents the form from contacting our server automatically (we want to do it ourselves) - var formActionUrl = form.action; // 'form.action' is the url '/create-post' - var formData = new FormData(form); - + const formActionUrl = form.action; // 'form.action' is the url '/post' + const formData = new FormData(form); postBlogposts(formActionUrl, formData); }); + } /**** * Function definitions ***/ -function postBlogposts (url, data) { - fetch(url, { - method: 'POST', - body: data - }) - .then(function (res) { - res.json() - .then(function (json) { - console.log(json); - addBlogpostsToPage(json); - document.querySelector('form').reset(); - }) +function postBlogposts(url, data) { + fetch(url, { + method: "POST", + body: data + }) + .then(function(res) { + res.json().then(function(json) { + addBlogpostsToPage(json); + document.querySelector("form").reset(); + window.location.href = "http://localhost:3000/" + }); }) - .catch(function (err) { - console.error(err) + .catch(function(err) { + console.error(err); }); } -function getBlogposts (url) { +function getBlogposts(url) { fetch(url, { method: 'GET' }) .then(function (res) { res.json() .then(function (json) { - console.log(json); addBlogpostsToPage(json); }); }) @@ -57,22 +53,21 @@ function getBlogposts (url) { } function addBlogpostsToPage (data) { - for (var blogpost in data) { - if (data.hasOwnProperty(blogpost)) { - - var postDiv = document.createElement('div'); - var postText = document.createElement('p'); - var thumbnail = document.createElement('img'); - var postContainer = document.querySelector('.post-container'); + JSON.parse(data).map(post => { + if (post.hasOwnProperty("blogpost")) { + const postDiv = document.createElement("div"); + const postText = document.createElement("p"); + const thumbnail = document.createElement("img"); + const postContainer = document.querySelector(".post-container"); thumbnail.src = "./img/logo2.png"; thumbnail.className = "thumbnail"; - postText.innerHTML = data[blogpost]; + postText.innerHTML = post.blogpost; postDiv.className = "post"; postDiv.appendChild(thumbnail); postDiv.appendChild(postText); postContainer.appendChild(postDiv); - } - } -} + } + }) +} \ No newline at end of file diff --git a/server.js b/server.js new file mode 100644 index 0000000..ee5763a --- /dev/null +++ b/server.js @@ -0,0 +1,38 @@ +//core modules +const fs = require('fs') + +//3rd party modules +const express = require('express') +const formidable = require("express-formidable"); +const hbs = require('hbs') +//variables +const port = 3000 + +//create app +const app = express() + +//serving public assets middleware +app.use(express.static('public', {'extensions': ['html']})) +hbs.registerPartials(__dirname + '/views/partials') +app.set('view engine', 'hbs') +hbs.registerHelper("getCurrentYear", () => new Date().getFullYear()); +hbs.registerHelper("setUpper", text => text.toUpperCase()); +app.use(formidable()); + +// router +app.get('/posts', (req, res) => { + res.json(fs.readFileSync(__dirname + "/data/posts.json", "utf8")); +}) +app.post('/post', (req, res) => { + const pathPostsFile = __dirname + "/data/posts.json"; + const allposts = JSON.parse(fs.readFileSync(pathPostsFile).toString()); + + const post = req.fields; + allposts.push(post) + fs.writeFileSync(pathPostsFile, JSON.stringify(allposts)); + res.json(fs.readFileSync(pathPostsFile, "utf8")); +}) + +app.listen(port, (req, res) => { + console.log("Server is runnig on port:", port); +}) \ No newline at end of file