mirror of
https://github.com/Akif9748/akf-forum.git
synced 2024-12-22 15:49:08 +03:00
Modal.js
This commit is contained in:
parent
abeaddc24b
commit
318e95ec2e
7 changed files with 26 additions and 31 deletions
|
@ -59,6 +59,8 @@ Akf-forum has got an API for AJAX (fetch), other clients etc. And, you can learn
|
|||
- edit config from web admin panel.
|
||||
- user.state for ban, delete, etc.
|
||||
- Add a feature list to README.md
|
||||
- delete admin???
|
||||
- MODALS'S CSS & JS
|
||||
## Major Version History
|
||||
- V4: Caching
|
||||
- V3: New Theme
|
||||
|
|
2
index.js
2
index.js
|
@ -35,7 +35,7 @@ app.use(express.static("public"), express.json(), express.urlencoded({ extended:
|
|||
|
||||
res.error = (type, error) => res.reply("error", { type, error }, type);
|
||||
|
||||
if (req.user && !req.user.approved && !req.url.startsWith("/auth/email")) return res.error(403, "Your account is not approved yet.");
|
||||
if (req.user && !req.user.approved&& !req.user.admin && !req.url.startsWith("/auth/email")) return res.error(403, "Your account is not approved yet.");
|
||||
|
||||
if (req.user?.deleted) {
|
||||
req.session.destroy();
|
||||
|
|
|
@ -86,10 +86,14 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
.dots-menu.active {
|
||||
.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.no-display {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dots-menu a {
|
||||
display: block;
|
||||
margin: 8px;
|
||||
|
@ -105,12 +109,6 @@
|
|||
|
||||
}
|
||||
|
||||
.send>textarea{
|
||||
font-family:inherit;
|
||||
width: 100%;
|
||||
margin: 10px;
|
||||
border: 2px solid #e3e3e3;
|
||||
}
|
||||
/* Media Query */
|
||||
|
||||
@media(max-width:980px) {
|
||||
|
@ -170,7 +168,7 @@
|
|||
width: 120px;
|
||||
}
|
||||
|
||||
.dots-menu.active {
|
||||
.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
|
3
public/js/modal.js
Normal file
3
public/js/modal.js
Normal file
|
@ -0,0 +1,3 @@
|
|||
for (const modal of document.querySelectorAll("[modal]"))
|
||||
modal.onclick = () => {
|
||||
document.querySelector(modal.getAttribute("modal")).classList.toggle('active')};
|
|
@ -39,7 +39,7 @@ app.patch("/:id/", async (req, res) => {
|
|||
const { message, user } = req;
|
||||
|
||||
if (user.id !== message.authorID && !user.admin) return res.error(403, "You have not got permission for this.");
|
||||
if (!Object.values(req.body).some(Boolean)) return res.error(400, "Missing message informations for update in request body.");
|
||||
if (!Object.keys(req.body).some(Boolean)) return res.error(400, "Missing message informations for update in request body.");
|
||||
const { content, deleted } = req.body;
|
||||
|
||||
const limits = req.app.get("limits");
|
||||
|
|
|
@ -36,7 +36,7 @@ app.patch("/:id", async (req, res) => {
|
|||
const { user, member } = req;
|
||||
|
||||
if (req.user.id !== member.id && !user.admin) return res.error(403, "You have not got permission for this.");
|
||||
if (!Object.values(req.body).some(Boolean)) return res.error(400, "Missing member informations in request body.");
|
||||
if (!Object.keys(req.body).some(Boolean)) return res.error(400, "Missing member informations in request body.");
|
||||
|
||||
const { name, about, theme, admin, deleted } = req.body;
|
||||
|
||||
|
|
|
@ -24,16 +24,16 @@
|
|||
<div class="date">
|
||||
<a style="color: var(--anti);" href="/users/<%= thread.author.id %>"><%= thread.author.name %></a> <%= "• "+(thread.edited ? "Edited" : "Not edited")%>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="text-align:center;padding:8px">
|
||||
<% if ((user.id === thread.authorID || user.admin ) && thread.state !== "DELETED"){ %>
|
||||
|
||||
<a onclick="delete_thread('<%= thread.id %>')" class="btn-outline-primary">DELETE</a>
|
||||
<a onclick="edit_thread('<%= thread.id %>')" class="btn-outline-primary">EDIT</a>
|
||||
<% } else if (thread.state == "DELETED") { %>
|
||||
<h3 style="display:inline;">This thread has been deleted</h3>
|
||||
<h4 class="title" style="display:inline; font-size: 20px;">This thread has been deleted</h3>
|
||||
<a onclick="undelete_thread('<%= thread.id %>')" class="btn-primary">UNDELETE</a>
|
||||
|
||||
<% }; %>
|
||||
</div>
|
||||
|
||||
|
@ -44,7 +44,7 @@
|
|||
<div class="message" id="message-<%= message.id %>">
|
||||
<div class="left">
|
||||
<img src="<%= message.author.avatar %>" />
|
||||
<div class="username"><a href="/users/<%=message.authorID %>"><%=message.author.name %></a></div>
|
||||
<div class="username"><a href="/users/<%=message.author.id %>"><%=message.author.name %></a></div>
|
||||
<div class="date">
|
||||
<%= new Date(message.time).toLocaleDateString() %>
|
||||
</div>
|
||||
|
@ -57,7 +57,7 @@
|
|||
<% if(user){ %>
|
||||
<% if(user.id === message.authorID || user.admin){ %>
|
||||
|
||||
<div class="dots" onclick="dots('<%=message.id %>')">
|
||||
<div class="dots" modal="#modal-<%=message.id %>">
|
||||
<% if (message.deleted){ %>
|
||||
<i class='bx bx-trash bx-sm' id="deleted" style="color: var(--important);"></i>
|
||||
<% } %>
|
||||
|
@ -67,7 +67,7 @@
|
|||
<i class='bx bx-dots-horizontal-rounded'></i>
|
||||
</div>
|
||||
|
||||
<div class="dots-menu">
|
||||
<div class="dots-menu" id="modal-<%=message.id %>">
|
||||
<% if (!message.deleted){ %>
|
||||
<a onclick="delete_message('<%=message.id %>');">Delete</a>
|
||||
<a onclick="edit_message('<%=message.id %>');">Edit</a>
|
||||
|
@ -78,15 +78,11 @@
|
|||
<% } %>
|
||||
|
||||
<div class="reactions">
|
||||
<div <% if (message.react.like.includes(user?.id)) { %>
|
||||
style="color: var(--main)"
|
||||
<% } %> >
|
||||
<div <% if (message.react.like.includes(user?.id)) { %> style="color: var(--main)" <% } %>>
|
||||
<i onclick='react("<%= message.id %>","like");' class='bx bx-like'></i>
|
||||
<div id="like"><%=message.react.like.length %></div>
|
||||
</div>
|
||||
<div <% if (message.react.dislike.includes(user?.id)) { %>
|
||||
style="color: var(--main)"
|
||||
<% } %>>
|
||||
<div <% if (message.react.dislike.includes(user?.id)) { %> style="color: var(--main)" <% } %>>
|
||||
<i onclick='react("<%= message.id %>","dislike");' class='bx bx-dislike'></i>
|
||||
<div id="dislike"><%=message.react.dislike.length %></div>
|
||||
</div>
|
||||
|
@ -104,18 +100,14 @@
|
|||
const content = message.querySelector(".content");
|
||||
content.innerHTML = converter.makeHtml(content.rawText = content.innerHTML);
|
||||
}
|
||||
|
||||
function dots(id) {
|
||||
document.getElementById('message-' + id).querySelector(".dots-menu").classList.toggle('active')
|
||||
}
|
||||
</script>
|
||||
|
||||
<script src="/js/modal.js"></script>
|
||||
<% if (user){ %>
|
||||
<script type="module" src="/js/thread.js"></script>
|
||||
|
||||
<div class="message" id="send-div">
|
||||
|
||||
<form id="send" style="width:100%">
|
||||
<form id="send" style="width:100%">
|
||||
<textarea rows="4" id="textarea"></textarea>
|
||||
<input name="page" type="hidden" value="<%= page %>"></input>
|
||||
<button class="btn-primary">Send!</button>
|
||||
|
@ -131,7 +123,7 @@
|
|||
delay: 1000,
|
||||
},
|
||||
element: textarea,
|
||||
spellChecker: false
|
||||
spellChecker: false
|
||||
});
|
||||
|
||||
import request from "../../js/request.js";
|
||||
|
@ -143,7 +135,7 @@
|
|||
threadID: "<%= thread.id %>",
|
||||
content: simplemde.value()
|
||||
})
|
||||
simplemde.clearAutosavedValue();
|
||||
simplemde.clearAutosavedValue();
|
||||
let tp = Number("<%= thread.pages %>")
|
||||
let tm = Number("<%= thread.count %>")
|
||||
if (tp * 10 === tm) tp++;
|
||||
|
|
Loading…
Reference in a new issue