From 47315ffb81e9efd5ba062c492257f8716490b248 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Lu=C3=ADs?= Date: Thu, 23 Nov 2023 22:44:55 -0300 Subject: [PATCH] Forum funcional --- src/forum/assets/css/forum.css | 39 +++- src/forum/assets/css/post.css | 18 +- src/forum/assets/css/style2.css | 287 -------------------------- src/forum/assets/css/style3.css | 348 ------------------------------- src/forum/assets/css/style4.css | 349 -------------------------------- src/forum/assets/js/index.js | 147 +++++++++++--- src/forum/assets/js/modal.js | 28 ++- src/forum/cadastrodepost.html | 122 ----------- src/forum/deletepost.html | 89 -------- src/forum/index.html | 4 +- src/forum/post.html | 5 +- src/forum/updatepost.html | 136 ------------- 12 files changed, 189 insertions(+), 1383 deletions(-) delete mode 100644 src/forum/assets/css/style2.css delete mode 100644 src/forum/assets/css/style3.css delete mode 100644 src/forum/assets/css/style4.css delete mode 100644 src/forum/cadastrodepost.html delete mode 100644 src/forum/deletepost.html delete mode 100644 src/forum/updatepost.html diff --git a/src/forum/assets/css/forum.css b/src/forum/assets/css/forum.css index 86c9f06..69543c8 100644 --- a/src/forum/assets/css/forum.css +++ b/src/forum/assets/css/forum.css @@ -1,4 +1,4 @@ -main article{ +main article { background-color: var(--light-grey); margin: 2em auto; padding: 1.5em 2.5em; @@ -6,6 +6,10 @@ main article{ border-radius: 1.5vmax; } +main article.autor { + border: 2px solid var(--principal-blue); +} + button#add-post { float: right; padding: 1em; @@ -30,6 +34,7 @@ button#add-post:hover { } #posts article h3 { + color: var(--principal-blue); display: inline; margin: 0 1em 0 0; vertical-align: middle; @@ -51,9 +56,29 @@ button#add-post:hover { float: right; } -/* #posts span { - float: right; - background-color: var(--light-grey); - padding: 5px 10px; - border-radius: 1vmax; -} */ +#posts article .engajamento span { + margin-right: 1em; +} + +#posts article .engajamento button { + padding: 0; + border: none; + background: none; + font-size: 1em; +} + +#posts article .engajamento button:hover { + cursor: pointer; +} + +#posts article .engajamento .edit { + color: var(--blue); +} + +#posts article .engajamento .delete { + color: var(--red); +} + +#posts article .engajamento button i { + margin-left: .5em; +} diff --git a/src/forum/assets/css/post.css b/src/forum/assets/css/post.css index a9d8c06..04497e1 100644 --- a/src/forum/assets/css/post.css +++ b/src/forum/assets/css/post.css @@ -37,23 +37,30 @@ section.conteudo { } .secao-comentarios { - padding: 1em 3em; + padding: 1em; +} + +#comentar { + display: flex; + align-items: center; } #comentar input{ - width: 60%; + flex: 3; + margin-right: .5em; + vertical-align: middle; padding: .6em; border: 1px solid #333; border-radius: .5vmax; - margin-bottom: 1em; font-size: 1em; } #comentar button { - padding: 1em; + flex: 1; + margin: auto; + padding: 1em; border: none; border-radius: .5vmax; - margin-top: 1.5em; background-color: var(--principal-blue); color: var(--white); font-weight: bold; @@ -65,5 +72,4 @@ section.conteudo { section.comentarios { margin: 1em 0; - } diff --git a/src/forum/assets/css/style2.css b/src/forum/assets/css/style2.css deleted file mode 100644 index 47019a8..0000000 --- a/src/forum/assets/css/style2.css +++ /dev/null @@ -1,287 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap'); -@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap"); - -:root { - --principal-blue: #1372bf; - --white: #f9f9f9; - --light-grey: #cccccc; - --grey: #858585; - --black: #2C2C2C; - --light-blue: #88FFFF; - --light-yellow: #FFFC5C; - --light-red: #FF5544; - --light-green: #55AA55; -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - background-color: var(--white); - font-family: "Poppins", sans-serif; -} - -h1 { - margin-top: 20px; - text-align: center; -} - -h2 { - display: block; - margin: 1em auto 0.5em; - font-size: 2em; - text-align: start; -} - -h3 { - width: 100%; - margin: 1em 0 .5em; - font-size: 1.4em; - color: var(--white); -} - -a { - text-decoration: none; -} - -ul { - list-style: none; -} - -/* HEADER */ -header { - position: sticky; - top: 0; - width: 100%; - padding: 1em 0; - z-index: 1; - background-color: var(--black); -} - -.logo { - display: inline-block; - margin-left: 20px; - color: var(--principal-blue); - font-size: 1.5em; - font-family: 'Bungee', sans-serif; -} - -nav { - position: fixed; - width: 100%; - height: 100%; - max-height: 0; - overflow: hidden; - background-color: var(--black); - transition: max-height .5s ease-out; -} - -.menu a { - display: block; - padding: 10px 25px; - color: var(--white); -} - -nav ul { - margin: 0 20px; -} - -nav ul li{ - margin: 0 3px; -} - -nav ul li:hover, -nav ul li:last-child { - background: var(--principal-blue); - transition: .5s linear; -} - -.hamb { - margin: 0 2em; - padding: 20px 20px; - float: right; - cursor: pointer; -} - -.hamb-line { - display: block; - position: relative; - width: 24px; - height: 3px; - background: var(--white); -} - -.hamb-line::before, -.hamb-line::after { - display: block; - position: absolute; - width: 100%; - height: 100%; - content: ''; - background: var(--white); - transition: all .2s ease-out; -} - -.hamb-line::before { - top: 7px; -} - -.hamb-line::after { - top: -7px; -} - -.side-menu { - display: none; -} - -.side-menu:checked ~ nav { - max-height: 100%; -} - -.side-menu:checked ~ .hamb .hamb-line { - background: transparent; -} - -.side-menu:checked ~ .hamb .hamb-line::before { - top:0; - transform: rotate(-45deg); -} - -.side-menu:checked ~ .hamb .hamb-line::after { - top:0; - transform: rotate(45deg); -} - -@media (min-width: 768px) { - nav { - position: relative; - width: fit-content; - max-height: none; - top: 0; - float: right; - background-color: transparent; - } - - .menu li { - float: left; - } - - .hamb { - display: none; - } -} - -/* MAIN CONTENT */ - -main section div{ - font-size: larger; - position: relative; - left: 20px; -} - -main article form div{ - background-color: rgba(228, 225, 225, 0.891); - justify-content: center; - position: relative; - left: 350px; - width: 40%; - padding: 30px; - border-radius: 30px; -} - -main article form div h4{ - font-size: 15pt; - text-align: center; - margin-top: 30px; -} - -main form div input{ - width: 100%; - height: 40px; - border-radius: 20px; - text-align: center; -} - - -main article form div button{ - margin-top: 20px; - position: relative; - justify-content: center; - width: 100%; - padding: 10px; - border-radius: 20px; -} - -main article form div button:hover{ - background-color: green; -} - -.conteudo{ - height: 200px; -} - - -/* FOOTER */ - -footer { - display: grid; - grid-template-columns: 4fr 3fr; - margin-top: 3em; - padding: 1em 4em 3em; - background-color: var(--black); - color: var(--light-grey); -} - -footer section { - display: flex; - width: 100%; - min-height: 15em; - padding: 0 2em; - flex-direction: column; -} - -footer section p { - margin-top: .5em; - text-align: justify; -} - -footer section li { - list-style: none; -} - -footer section li a { - font-weight: bold; - text-decoration: underline; - color: inherit; -} - -@media screen and (max-width: 1024px) { - footer { - padding: 1em; - } -} - -@media screen and (max-width: 768px) { - footer { - grid-template-columns: 1fr; - padding: 0; - } -} - -#posts a { - color: inherit; -} - -#posts h4 { - text-transform: capitalize; -} - -#posts span { - float: right; - background-color: var(--light-grey); - padding: 5px 10px; - border-radius: 1vmax; -} \ No newline at end of file diff --git a/src/forum/assets/css/style3.css b/src/forum/assets/css/style3.css deleted file mode 100644 index cdcbcbe..0000000 --- a/src/forum/assets/css/style3.css +++ /dev/null @@ -1,348 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap'); -@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap"); - -:root { - --principal-blue: #1372bf; - --white: #f9f9f9; - --light-grey: #cccccc; - --grey: #858585; - --black: #2C2C2C; - --light-blue: #88FFFF; - --light-yellow: #FFFC5C; - --light-red: #FF5544; - --light-green: #55AA55; -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - background-color: var(--white); - font-family: "Poppins", sans-serif; -} - -h1 { - margin-top: 20px; - text-align: center; -} - -h2 { - display: block; - margin: 1em auto 0.5em; - font-size: 2em; - text-align: start; -} - -h3 { - width: 100%; - margin: 1em 0 .5em; - font-size: 1.4em; - color: var(--white); -} - -a { - text-decoration: none; -} - -ul { - list-style: none; -} - -/* HEADER */ -header { - position: sticky; - top: 0; - width: 100%; - padding: 1em 0; - z-index: 1; - background-color: var(--black); -} - -.logo { - display: inline-block; - margin-left: 20px; - color: var(--principal-blue); - font-size: 1.5em; - font-family: 'Bungee', sans-serif; -} - -nav { - position: fixed; - width: 100%; - height: 100%; - max-height: 0; - overflow: hidden; - background-color: var(--black); - transition: max-height .5s ease-out; -} - -.menu a { - display: block; - padding: 10px 25px; - color: var(--white); -} - -nav ul { - margin: 0 20px; -} - -nav ul li{ - margin: 0 3px; -} - -nav ul li:hover, -nav ul li:last-child { - background: var(--principal-blue); - transition: .5s linear; -} - -.hamb { - margin: 0 2em; - padding: 20px 20px; - float: right; - cursor: pointer; -} - -.hamb-line { - display: block; - position: relative; - width: 24px; - height: 3px; - background: var(--white); -} - -.hamb-line::before, -.hamb-line::after { - display: block; - position: absolute; - width: 100%; - height: 100%; - content: ''; - background: var(--white); - transition: all .2s ease-out; -} - -.hamb-line::before { - top: 7px; -} - -.hamb-line::after { - top: -7px; -} - -.side-menu { - display: none; -} - -.side-menu:checked ~ nav { - max-height: 100%; -} - -.side-menu:checked ~ .hamb .hamb-line { - background: transparent; -} - -.side-menu:checked ~ .hamb .hamb-line::before { - top:0; - transform: rotate(-45deg); -} - -.side-menu:checked ~ .hamb .hamb-line::after { - top:0; - transform: rotate(45deg); -} - -@media (min-width: 768px) { - nav { - position: relative; - width: fit-content; - max-height: none; - top: 0; - float: right; - background-color: transparent; - } - - .menu li { - float: left; - } - - .hamb { - display: none; - } -} - -/* MAIN CONTENT */ - -main section div{ - font-size: larger; - position: relative; - left: 210px; -} - -main article form div{ - background-color: rgba(228, 225, 225, 0.891); - justify-content: center; - position: relative; - width: 100%; - padding: 30px; - border-radius: 30px; -} - -main article form div h4{ - font-size: 15pt; - text-align: center; - margin-top: 30px; -} - -main form div input{ - width: 100%; - height: 40px; - border-radius: 20px; - text-align: center; -} - - -main article form div button{ - margin-top: 20px; - position: relative; - justify-content: center; - width: 100%; - padding: 10px; - border-radius: 20px; -} - -main article form div button:hover{ - background-color: green; -} - -.conteudo{ - height: 200px; - overflow: auto; -} - -/* MAIN CONTAINT 2*/ - -main section{ - margin: 10px; -} - -main section div{ - display: inline-block; - margin: 10px; - font-size: large; -} - -main section div h2{ - position: relative; - font-size: 30pt; - top: 10px; - left: 40px; -} - -main section div div + div{ - position: relative; - padding: 10px; - bottom: 20px; - left: 850px; -} - -main section div + div button{ - position: relative; - left: 780px; - padding: 10px; - border-radius: 10px; -} - -main section div div + div button:hover{ - padding: 10px; - border-radius: 10px; - background-color: rgb(81, 195, 81); -} - -main article{ - background-color: rgba(228, 225, 225, 0.891); - margin: 0px auto 40px; - padding: 20px; - width: 80%; - height: auto; - border-radius: 40px; -} - -.foto{ - margin-right: 60px; - float: right; - position: relative; - left: 20px; -} - -.quantidade{ - float: right; - position: relative; - right: 18px; - top: 8px; -} - -/* FOOTER */ - -footer { - display: grid; - grid-template-columns: 4fr 3fr; - margin-top: 3em; - padding: 1em 4em 3em; - background-color: var(--black); - color: var(--light-grey); -} - -footer section { - display: flex; - width: 100%; - min-height: 15em; - padding: 0 2em; - flex-direction: column; -} - -footer section p { - margin-top: .5em; - text-align: justify; -} - -footer section li { - list-style: none; -} - -footer section li a { - font-weight: bold; - text-decoration: underline; - color: inherit; -} - -@media screen and (max-width: 1024px) { - footer { - padding: 1em; - } -} - -@media screen and (max-width: 768px) { - footer { - grid-template-columns: 1fr; - padding: 0; - } -} - -#posts a { - color: inherit; -} - -#posts h4 { - text-transform: capitalize; -} - -#posts span { - float: right; - background-color: var(--light-grey); - padding: 5px 10px; - border-radius: 1vmax; -} \ No newline at end of file diff --git a/src/forum/assets/css/style4.css b/src/forum/assets/css/style4.css deleted file mode 100644 index be3edca..0000000 --- a/src/forum/assets/css/style4.css +++ /dev/null @@ -1,349 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap'); -@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap"); - -:root { - --principal-blue: #1372bf; - --white: #f9f9f9; - --light-grey: #cccccc; - --grey: #858585; - --black: #2C2C2C; - --light-blue: #88FFFF; - --light-yellow: #FFFC5C; - --light-red: #FF5544; - --light-green: #55AA55; -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - background-color: var(--white); - font-family: "Poppins", sans-serif; -} - -h1 { - margin-top: 20px; - text-align: center; -} - -h2 { - display: block; - margin: 1em auto 0.5em; - font-size: 2em; - text-align: start; -} - -h3 { - width: 100%; - margin: 1em 0 .5em; - font-size: 1.4em; - color: var(--white); -} - -a { - text-decoration: none; -} - -ul { - list-style: none; -} - -/* HEADER */ -header { - position: sticky; - top: 0; - width: 100%; - padding: 1em 0; - z-index: 1; - background-color: var(--black); -} - -.logo { - display: inline-block; - margin-left: 20px; - color: var(--principal-blue); - font-size: 1.5em; - font-family: 'Bungee', sans-serif; -} - -nav { - position: fixed; - width: 100%; - height: 100%; - max-height: 0; - overflow: hidden; - background-color: var(--black); - transition: max-height .5s ease-out; -} - -.menu a { - display: block; - padding: 10px 25px; - color: var(--white); -} - -nav ul { - margin: 0 20px; -} - -nav ul li{ - margin: 0 3px; -} - -nav ul li:hover, -nav ul li:last-child { - background: var(--principal-blue); - transition: .5s linear; -} - -.hamb { - margin: 0 2em; - padding: 20px 20px; - float: right; - cursor: pointer; -} - -.hamb-line { - display: block; - position: relative; - width: 24px; - height: 3px; - background: var(--white); -} - -.hamb-line::before, -.hamb-line::after { - display: block; - position: absolute; - width: 100%; - height: 100%; - content: ''; - background: var(--white); - transition: all .2s ease-out; -} - -.hamb-line::before { - top: 7px; -} - -.hamb-line::after { - top: -7px; -} - -.side-menu { - display: none; -} - -.side-menu:checked ~ nav { - max-height: 100%; -} - -.side-menu:checked ~ .hamb .hamb-line { - background: transparent; -} - -.side-menu:checked ~ .hamb .hamb-line::before { - top:0; - transform: rotate(-45deg); -} - -.side-menu:checked ~ .hamb .hamb-line::after { - top:0; - transform: rotate(45deg); -} - -@media (min-width: 768px) { - nav { - position: relative; - width: fit-content; - max-height: none; - top: 0; - float: right; - background-color: transparent; - } - - .menu li { - float: left; - } - - .hamb { - display: none; - } -} - -/* MAIN CONTENT */ - -main section div{ - font-size: larger; - position: relative; - left: 200px; -} - -main article form div{ - background-color: rgba(228, 225, 225, 0.891); - justify-content: center; - position: relative; - width: 100%; - padding: 30px; - border-radius: 30px; -} - -main article form div h4{ - font-size: 15pt; - text-align: center; - margin-top: 30px; -} - -main form div input{ - width: 100%; - height: 40px; - border-radius: 20px; - text-align: center; -} - - -main article form div button{ - margin-top: 20px; - position: relative; - justify-content: center; - width: 100%; - padding: 10px; - border-radius: 20px; -} - -main article form div button:hover{ - background-color: green; -} - -.conteudo{ - height: 200px; - overflow: auto; -} - -/* MAIN CONTAINT 2*/ - -main section{ - margin: 10px; -} - -main section div{ - display: inline-block; - margin: 10px; - font-size: large; -} - -main section div h2{ - position: relative; - font-size: 30pt; - top: 10px; - left: 40px; -} - -main section div div + div{ - position: relative; - padding: 10px; - bottom: 20px; - left: 850px; -} - -main section div + div button{ - position: relative; - left: 780px; - padding: 10px; - border-radius: 10px; -} - -main section div div + div button:hover{ - padding: 10px; - border-radius: 10px; - background-color: rgb(81, 195, 81); -} - -main article{ - background-color: rgba(228, 225, 225, 0.891); - margin: 0px auto 40px; - padding: 20px; - width: 80%; - height: auto; - border-radius: 40px; -} - -.foto{ - margin-right: 60px; - float: right; - position: relative; - left: 20px; -} - -.quantidade{ - float: right; - position: relative; - right: 18px; - top: 8px; -} - - -/* FOOTER */ - -footer { - display: grid; - grid-template-columns: 4fr 3fr; - margin-top: 3em; - padding: 1em 4em 3em; - background-color: var(--black); - color: var(--light-grey); -} - -footer section { - display: flex; - width: 100%; - min-height: 15em; - padding: 0 2em; - flex-direction: column; -} - -footer section p { - margin-top: .5em; - text-align: justify; -} - -footer section li { - list-style: none; -} - -footer section li a { - font-weight: bold; - text-decoration: underline; - color: inherit; -} - -@media screen and (max-width: 1024px) { - footer { - padding: 1em; - } -} - -@media screen and (max-width: 768px) { - footer { - grid-template-columns: 1fr; - padding: 0; - } -} - -#posts a { - color: inherit; -} - -#posts h4 { - text-transform: capitalize; -} - -#posts span { - float: right; - background-color: var(--light-grey); - padding: 5px 10px; - border-radius: 1vmax; -} \ No newline at end of file diff --git a/src/forum/assets/js/index.js b/src/forum/assets/js/index.js index 0bd3961..6205db9 100644 --- a/src/forum/assets/js/index.js +++ b/src/forum/assets/js/index.js @@ -1,48 +1,78 @@ -const apiUrl = 'https://jsonserver.joao-paulopa392.repl.co'; +const apiURL = 'https://jsonserver.joao-paulopa392.repl.co'; let postsList; -window.addEventListener('load', showPosts, false) +const form = document.querySelector('#modal form'); -document.querySelector('#modal form').addEventListener('submit', addPost, false); +window.addEventListener('load', showPosts, false); +document.querySelector('#add-post').addEventListener('click', addPost, false); // READ async function loadPosts() { - try { postsList = await (await fetch(`${apiUrl}/posts`)).json() } + try { postsList = await (await fetch(`${apiURL}/posts`)).json() } catch (error) { console.error('Falha ao carregar posts:', error) } } +function generateHTML(post) { + const { id, titulo, categoria, comentarios, curtidas, conteudo, usuario } = post; + const isAuthor = usuario === JSON.parse(sessionStorage.getItem('user')).id; + + return ` +
+ +

${titulo}

+ +

${categoria}

+
+ ${comentarios.length} + ${curtidas} + ${isAuthor ? + ` + + + ` : + ''} +
+

${conteudo}

+
`; +} + async function showPosts() { try { await loadPosts(); - const textoHTML = postsList.map(post => ` -
- -

${post.titulo}

-

${post.categoria}

- -
- ${post.comentarios.length} - ${post.curtidas} - -
- -

${post.conteudo}

- -
- `).join(''); + const textoHTML = postsList.map(generateHTML).join(''); document.querySelector("#posts").innerHTML = textoHTML; + + // Event listeners + document.querySelectorAll('.edit').forEach(button => { + button.addEventListener('click', editPost, false); + }); + document.querySelectorAll('.delete').forEach(button => { + button.addEventListener('click', deletePost, false); + }); } catch (error) { console.error('Falha ao exibir os posts:', error); } } - // CREATE -async function addPost(event) { +function addPost() { + if (isLogged()) { + openAddModal(); + + form.removeEventListener('submit', handleEditSubmit, false); + form.removeEventListener('submit', handleAddSubmit, false); + form.addEventListener('submit', handleAddSubmit, false); + } else { + alert('Você precisa estar conectado para criar um novo post!'); + window.location.href = '../login.html'; + } +} + +async function handleAddSubmit(event) { event.preventDefault(); const newPost = { @@ -58,7 +88,7 @@ async function addPost(event) { }; try { - const response = await fetch(`${apiUrl}/posts`, { + const response = await fetch(`${apiURL}/posts`, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -75,3 +105,74 @@ async function addPost(event) { } catch (error) { console.error('Falha ao adicionar o post:', error); } } + +// UPDATE +function editPost() { + id = this.value; + const post = postsList.find(post => post.id == id); + + openEditModal(post); + + form.removeEventListener('submit', handleAddSubmit, false); + form.removeEventListener('submit', handleEditSubmit, false); + form.addEventListener('submit', handleEditSubmit, false); +} + +async function handleEditSubmit(event) { + event.preventDefault(); + + const form = document.querySelector('#modal form'); + const updatedPost = { + titulo: form.querySelector('#title').value, + categoria: form.querySelector('#category').value, + conteudo: form.querySelector('#content').value + }; + + try { + const response = await fetch(`${apiURL}/posts/${id}`, { + method: 'PATCH', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(updatedPost) + }); + + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + + await showPosts(); + closeModal(); + } catch (error) { + console.error('Falha ao atualizar o componente:', error); + } +} + + + +// DELETE +async function deletePost() { + const id = this.value; + const post = postsList.find(post => post.id == id); + + const confirmDelete = window.confirm(`Você realmente quer excluir ${post.titulo}?`); + if (confirmDelete) { + try { + const response = await fetch(`${apiURL}/posts/${id}`, { + method: 'DELETE', + headers: { + 'Content-Type': 'application/json', + } + }); + + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + + showPosts(); + } + catch (error) { + console.error('Falha ao deletar o componente:', error); + } + } +} diff --git a/src/forum/assets/js/modal.js b/src/forum/assets/js/modal.js index d9342c2..9644a54 100644 --- a/src/forum/assets/js/modal.js +++ b/src/forum/assets/js/modal.js @@ -1,26 +1,34 @@ let modal = document.querySelector("#modal"); -document.querySelector('#add-post').addEventListener('click', openAddModal, false); - document.querySelector('#close-modal').addEventListener('click', closeModal, false); window.addEventListener('click', event => { event.target == modal ? closeModal() : null; }, false); let modalTitle = document.querySelector('#modal h3'); let modalButton = document.querySelector('#modal form button'); -let inputName = document.querySelector('#modal form #title') -let inputQtd = document.querySelector('#modal form #qtd') +let inputTitle = document.querySelector('#modal form #title'); +let inputCategory = document.querySelector('#modal form #category'); +let inputContent = document.querySelector('#modal form #content'); function openAddModal() { - if (!isLogged()) { - alert('Você precisa estar conectado para acessar essa página!'); - window.location.href = '../login.html'; - } - - modalTitle.innerHTML = 'Adicionar post'; modalButton.innerHTML = 'Adicionar'; + inputTitle.value = ''; + inputCategory.value = ''; + inputContent.value = ''; + + modal.style.display = "block"; +} + +function openEditModal(post) { + modalTitle.innerHTML = 'Editar post'; + modalButton.innerHTML = 'Editar'; + + inputTitle.value = post.titulo; + inputCategory.value = post.categoria; + inputContent.value = post.conteudo; + modal.style.display = "block"; } diff --git a/src/forum/cadastrodepost.html b/src/forum/cadastrodepost.html deleted file mode 100644 index f298a94..0000000 --- a/src/forum/cadastrodepost.html +++ /dev/null @@ -1,122 +0,0 @@ - - - - - - - - - Cadastro de comentario - - - -
- - - - - - - - -
- -
-
-
-
-

Criar Post

-
-
-
- -
-
-
-

Titulo

- - -

Categoria

- - -

Conteúdo

- - - -
-
-
-
- - - - - - - - - diff --git a/src/forum/deletepost.html b/src/forum/deletepost.html deleted file mode 100644 index bfc4493..0000000 --- a/src/forum/deletepost.html +++ /dev/null @@ -1,89 +0,0 @@ - - - - - - - - - - Cadastro de comentario - - - -
- - - - - - - - -
- -
-
-
-
-

Deletar Post

-
-
-
- -
-
-
-

Id

- - - -
-
-
- -
-
-
-
- - - - - - - - diff --git a/src/forum/index.html b/src/forum/index.html index c449a4b..2d80eab 100644 --- a/src/forum/index.html +++ b/src/forum/index.html @@ -15,7 +15,7 @@
- + @@ -45,7 +45,7 @@

Fórum

- +
diff --git a/src/forum/post.html b/src/forum/post.html index 1f35095..29dbc7c 100644 --- a/src/forum/post.html +++ b/src/forum/post.html @@ -12,7 +12,7 @@
- + @@ -54,11 +54,8 @@

Comentários

    - - -