mirror of
https://github.com/Akif9748/akf-forum.git
synced 2024-11-22 20:10:40 +03:00
bcrypt fix + forms to a
This commit is contained in:
parent
67b5f4c2ad
commit
b26314d4a2
9 changed files with 107 additions and 117 deletions
|
@ -32,6 +32,8 @@ Akf-forum has got an API for AJAX, other clients etc. And, you can learn about A
|
|||
- If thread deleted, not show its messages in API.
|
||||
- Thread.ejs fix with new theme
|
||||
- Profile photos will store in database
|
||||
- regex for pfp for now and
|
||||
- admin perm for undelete, thread+message
|
||||
|
||||
### Frontend
|
||||
### User
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
.threads {
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
|
@ -18,6 +17,7 @@
|
|||
.threads-box:hover {
|
||||
background-color: #e2e2e2;
|
||||
}
|
||||
|
||||
.thread-box-title {
|
||||
padding: 10px;
|
||||
font-size: 18px;
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
box-shadow: 0 0 5px 0 #beb9b9;
|
||||
max-width:500px;
|
||||
}
|
||||
|
||||
.user-box-title {
|
||||
|
@ -28,6 +29,7 @@
|
|||
.user-box-img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
|
|
@ -1,7 +1,11 @@
|
|||
import request from "./request.js";
|
||||
|
||||
const messages = document.getElementById("messages");
|
||||
let messages_raw = [];
|
||||
const message_div = document.getElementById("messages");
|
||||
|
||||
const messages_raw = await fetch(`/api/threads/${message_div.getAttribute("value")}/messages/`).then(res => res.json());
|
||||
for (const message of messages_raw)
|
||||
renderMessage(message);
|
||||
|
||||
function renderMessage(message) {
|
||||
const messageElement = document.createElement("div");
|
||||
messageElement.classList.add("message");
|
||||
|
@ -12,51 +16,36 @@ function renderMessage(message) {
|
|||
<h3 style="float:right;">${new Date(message.time).toLocaleString()}</h3>
|
||||
|
||||
<h2>
|
||||
<img class="circle" src=${message.author.avatar} alt=${message.author.name}>
|
||||
<a href=${"/users/" + message.author.id}> ${message.author.name}</a>:
|
||||
<img class="circle" src="${message.author.avatar}" alt="${message.author.name}">
|
||||
<a href="/users/${message.author.id}"> ${message.author.name}</a>:
|
||||
</h2>
|
||||
|
||||
<p>${message.content.replaceAll("\n", "<br>")}</p><br>
|
||||
<div id="message-delete-${message.id}">
|
||||
${!message.deleted ?
|
||||
`<form style="display:inline;">
|
||||
<button id="delete_message" value="${message.id}" type="submit">DELETE</button>
|
||||
</form>` :
|
||||
"<h3 style=\"display:inline;\">This message has been deleted</h3>"}
|
||||
${/* if */!message.deleted ?
|
||||
`
|
||||
<a onclick="delete_message('${message.id}');">DELETE</a>
|
||||
<a onclick="edit_message('${message.id}');">EDIT</a>
|
||||
` /* else */ :
|
||||
`<h3 style=\"display:inline;\">This message has been deleted</h3>
|
||||
<a onclick="undelete_message('${message.id}');">UNDELETE</a>
|
||||
`
|
||||
|
||||
}
|
||||
</div>
|
||||
<div style="float: right;">
|
||||
<h3 id="count${message.id}" style="display:inline;">${message.reactCount}</h3>
|
||||
<button style="display:inline;" id="like" value="${message.id}">+🔼</button>
|
||||
<button style="display:inline;" id="dislike" value="${message.id}" >-🔽</button>
|
||||
<h3 id="count${message.id}" style="display:inline;">0</h3>
|
||||
<a onclick="react('${message.id}', 'like');">+🔼</a>
|
||||
<a onclick="react('${message.id}', 'dislike');">-🔽</a>
|
||||
</div>
|
||||
`;
|
||||
|
||||
messages.appendChild(messageElement);
|
||||
messages.innerHTML += "<br>";
|
||||
message_div.appendChild(messageElement);
|
||||
message_div.innerHTML += "<br>";
|
||||
};
|
||||
|
||||
/**
|
||||
* Main Renderer
|
||||
*/
|
||||
(async () => {
|
||||
|
||||
messages_raw = await fetch(`/api/threads/${messages.getAttribute("value")}/messages/`).then(res => res.json());
|
||||
if (messages_raw?.error) {
|
||||
|
||||
document.getElementById("messages").innerHTML
|
||||
+= '<div class="message"><h1>THIS THREAD HAS NOT GOT ANY MESSAGE</h1></div>';
|
||||
|
||||
|
||||
} else
|
||||
for (const message of messages_raw)
|
||||
renderMessage(message);
|
||||
|
||||
window.scrollTo(0, document.body.scrollHeight);
|
||||
|
||||
})();
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Message Sender
|
||||
*/
|
||||
|
@ -74,41 +63,49 @@ document.getElementById("send").addEventListener("submit", async e => {
|
|||
});
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* Button Listener
|
||||
* OTHER FUNCTIONS
|
||||
*/
|
||||
document.addEventListener("click", async e => {
|
||||
// e.preventDefault();
|
||||
if (e.target.id === "delete_thread") {
|
||||
const response = await request("/api/threads/" + e.target.value + "/delete");
|
||||
|
||||
async function delete_thread(id) {
|
||||
const response = await request("/api/threads/" + id + "/delete");
|
||||
if (response.deleted) {
|
||||
alert("Thread deleted");
|
||||
location.reload();
|
||||
}
|
||||
|
||||
} else if (e.target.id === "undelete_thread") {
|
||||
const response = await request("/api/threads/" + e.target.value + "/undelete");
|
||||
}
|
||||
async function undelete_thread(id) {
|
||||
const response = await request("/api/threads/" + id + "/undelete");
|
||||
if (!response.deleted) {
|
||||
alert("Thread undeleted");
|
||||
location.reload();
|
||||
|
||||
}
|
||||
|
||||
} else if (e.target.id === "delete_message") {
|
||||
e.preventDefault();
|
||||
const response = await request(`/api/messages/${e.target.value}/delete`);
|
||||
}
|
||||
async function undelete_message(id) {
|
||||
const response = await request(`/api/messages/${id}/undelete`);
|
||||
if (!response.deleted)
|
||||
document.getElementById("message-delete-" + id).innerHTML = `<a onclick=\"delete_message('${id}');\">DELETE</a>`;
|
||||
|
||||
}
|
||||
async function delete_message(id) {
|
||||
const response = await request(`/api/messages/${id}/delete`);
|
||||
if (response.deleted) {
|
||||
alert("Message deleted");
|
||||
document.getElementById("message-delete-" + e.target.value).innerHTML = "<h3 style=\"display:inline;\">This message has been deleted</h3>";
|
||||
document.getElementById("message-delete-" + id).innerHTML = `
|
||||
<h3 style=\"display:inline;\">This message has been deleted</h3>
|
||||
<a onclick="undelete_message('${id}');">UNDELETE</a>`;// ADMIN PERM FIX
|
||||
}
|
||||
}
|
||||
async function react(id, type) {
|
||||
const res = await request(`/api/messages/${id}/react/${type}`)
|
||||
document.getElementById(`count${id}`).innerHTML = res.reactCount;
|
||||
}
|
||||
} /*else if (e.target.id === "edit_thread") {
|
||||
window.location.href = "/threads/<%= thread.id }/edit";
|
||||
} */
|
||||
|
||||
if (!e.target.id.includes("like")) return;
|
||||
const res = await request("/api/messages/" + e.target.value + "/react/" + e.target.id)
|
||||
|
||||
document.getElementById("count" + e.target.value).innerHTML = res.reactCount;
|
||||
|
||||
});
|
||||
window.delete_message = delete_message;
|
||||
window.undelete_message = undelete_message;
|
||||
window.react = react;
|
||||
window.delete_thread = delete_thread;
|
||||
window.undelete_thread = undelete_thread;
|
|
@ -1,7 +1,6 @@
|
|||
const { Router } = require("express")
|
||||
const { Router, request, response } = require("express")
|
||||
const app = Router();
|
||||
const bcrypt = require("bcrypt");
|
||||
const { request, response } = require("express");
|
||||
const { SecretModel, UserModel } = require("../../models")
|
||||
|
||||
/**
|
||||
|
@ -26,10 +25,9 @@ app.use(async (req, res, next) => {
|
|||
if (!user)
|
||||
return res.error(401, "We have not got any user has got this name")
|
||||
|
||||
const validPassword = await bcrypt.compare(password, user.password);
|
||||
|
||||
if (!validPassword)
|
||||
return res.error(401, 'Incorrect Password!')
|
||||
if (!bcrypt.compare(password, user.password)) return res.error(401, 'Incorrect Password!');
|
||||
|
||||
req.user = await UserModel.findOne({ name: req.headers.username });
|
||||
|
||||
next();
|
||||
|
|
|
@ -14,9 +14,7 @@ app.post("/", async (req, res) => {
|
|||
const user = await SecretModel.findOne({ username });
|
||||
if (user) {
|
||||
|
||||
const validPassword = await bcrypt.compare(password, user.password);
|
||||
|
||||
if (!validPassword) return res.error( 403, 'Incorrect Password!')
|
||||
if (!bcrypt.compare(password, user.password)) return res.error( 403, 'Incorrect Password!')
|
||||
const member = await UserModel.findOne({ name: username });
|
||||
if (!member || member.deleted) return res.error( 403, 'Incorrect Username and/or Password!')
|
||||
|
||||
|
|
|
@ -8,24 +8,24 @@
|
|||
<%- include("extra/navbar") %>
|
||||
|
||||
<link rel="stylesheet" href="/css/thread.css" />
|
||||
<% if (user){ %>
|
||||
<script type="module" src="/js/thread.js"></script>
|
||||
<% }%>
|
||||
|
||||
|
||||
<h1 style="font-size: 35px;color: #4d18e6;" ><%= thread.title %></h1>
|
||||
|
||||
<h1 style="font-size: 35px;color: #4d18e6;" >
|
||||
<%= thread.title %>
|
||||
</h1>
|
||||
|
||||
<h2 style="display:inline;">By <a href="<%="/users/" + thread.author.id %>"> <%= thread.author.name %></a>
|
||||
<h2 style="display:inline;">By <a href="<%='/users/' + thread.author.id %>"> <%= thread.author.name %></a>
|
||||
<img class="circle" src="<%=thread.author.avatar %>">
|
||||
</h2>
|
||||
|
||||
<% if (user && !thread.deleted){ %>
|
||||
|
||||
<button id="delete_thread" value="<%= thread.id %>" style="display:inline;" type="submit">DELETE</button>
|
||||
<button id="edit_thread" style="display:inline;" type="submit">EDIT</button>
|
||||
<a onclick="delete_thread('<%= thread.id %>' )" value=style="display:inline;" >DELETE</a>
|
||||
<a onclick="edit_thread('<%= thread.id %>')" style="display:inline;" >EDIT</a>
|
||||
<% } else if (thread.deleted) { %>
|
||||
<h3 style="display:inline;">This thread has been deleted</h3>
|
||||
<button id="undelete_thread" value="<%= thread.id %>" style="display:inline;" type="submit">UNDELETE</button>
|
||||
<a onclick="undelete_thread('<%= thread.id %>')" style="display:inline;" >UNDELETE</a>
|
||||
|
||||
<% }; %>
|
||||
|
||||
|
@ -44,20 +44,20 @@
|
|||
<h3 style="float:right;">26.08.2022 15:37:42</h3>
|
||||
|
||||
<h2>
|
||||
<img class="circle" src="https://cdn.discordapp.com/avatars/539506680140922890/abd74d10aac094fc8a5ad5c86f29fdb9.png?size=1024" alt="Akif9748">
|
||||
<img class="circle" src="https://cdn.discordapp.com/avatars/539506680140922890/abd74d10aac094fc8a5ad5c86f29fdb9.png?size=1024">
|
||||
<a href="/users/0"> Akif9748</a>:
|
||||
</h2>
|
||||
|
||||
<p>Example message for development</p><br>
|
||||
<div id="message-delete-3">
|
||||
<form style="display:inline;">
|
||||
<button id="delete_message" value="3" type="submit">DELETE</button>
|
||||
</form>
|
||||
<a onclick="delete_message('3');">DELETE</a>
|
||||
<a onclick="edit_message('3');">EDIT</a>
|
||||
|
||||
</div>
|
||||
<div style="float: right;">
|
||||
<h3 id="count3" style="display:inline;">0</h3>
|
||||
<button style="display:inline;" id="like" value="3">+🔼</button>
|
||||
<button style="display:inline;" id="dislike" value="3">-🔽</button>
|
||||
<a onclick="react('3', 'like');">+🔼</a>
|
||||
<a onclick="react('3', 'dislike');">-🔽</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--EXAMPLE MESSAGE END-->
|
||||
|
@ -80,9 +80,7 @@
|
|||
|
||||
</form>
|
||||
|
||||
<% if (user){ %>
|
||||
<script type="module" src="/js/thread.js"></script>
|
||||
<% }%>
|
||||
|
||||
<script>
|
||||
document.getElementById("message-<%= scroll %>").scrollIntoView();
|
||||
</script>
|
||||
|
|
|
@ -40,21 +40,15 @@
|
|||
</ul>
|
||||
|
||||
<% if (user?.admin && !member.deleted) {%>
|
||||
<form id="admin">
|
||||
<button class="big" type="submit">Give admin permissions!</button>
|
||||
</form>
|
||||
<a class="big" id="admin">Give admin permissions!</a>
|
||||
|
||||
<form id="delete">
|
||||
<button class="big" type="submit">Delete user!</button>
|
||||
</form>
|
||||
<a class="big" id="delete">Delete user!</a>
|
||||
|
||||
<script type="module">
|
||||
|
||||
import request from "../../js/request.js";
|
||||
|
||||
document.addEventListener("submit", async e => {
|
||||
document.addEventListener("click", async e => {
|
||||
e.preventDefault();
|
||||
|
||||
if (e.target.id == "admin") {
|
||||
|
||||
const response = await request("/api/users/<%= member.id %>/admin");
|
||||
|
@ -77,23 +71,22 @@
|
|||
<% }; %>
|
||||
<% if (member.deleted) {%>
|
||||
<h1>This user has been deleted!</h1>
|
||||
<a onclick="undelete();" type="">Undelete user! </a>
|
||||
|
||||
|
||||
<form id="undelete">
|
||||
<button class="big" type="submit">Undelete user!</button>
|
||||
</form>
|
||||
|
||||
<script type="module">
|
||||
|
||||
import request from "../../js/request.js";
|
||||
|
||||
document.addEventListener("submit", async e => {
|
||||
async function undelete(params) {
|
||||
|
||||
const response = await request("/api/users/<%= member.id %>/undelete");
|
||||
|
||||
if (response.deleted) return;
|
||||
alert("User is undeleted successfully!");
|
||||
location.reload()
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
|
|
@ -11,12 +11,14 @@
|
|||
|
||||
<div class="users">
|
||||
<% users.forEach(user=>{ %>
|
||||
<div style="display:flex;justify-content:center;">
|
||||
<div class="user-box">
|
||||
<img src="<%= user.avatar %>" class="user-box-img">
|
||||
<div class="user-box-title"> <a href="<%= user.getLink() %>">
|
||||
<% if (user.deleted) { %> <span style="color: RED;">[DELETED]</span><% } %>
|
||||
<%= user.name %></a></div>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue