mirror of
https://github.com/Akif9748/akf-forum.git
synced 2024-11-22 20:10:40 +03:00
[WIP] Threads page is converting to new theme
This commit is contained in:
parent
7aa459e402
commit
0e659a8aa4
11 changed files with 109 additions and 143 deletions
34
README.md
34
README.md
|
|
@ -33,7 +33,9 @@ And, you can learn about API in `util/APIDOCS.md`.
|
|||
## Roadmap
|
||||
### TO-DO:
|
||||
- If thread deleted, not show its messages in API.
|
||||
- If redirect => /register, return
|
||||
- Thread.ejs fix with new theme
|
||||
- Profile photos will store in database
|
||||
|
||||
### Frontend
|
||||
### User
|
||||
| To do | Is done? | Priority |
|
||||
|
|
@ -56,7 +58,7 @@ And, you can learn about API in `util/APIDOCS.md`.
|
|||
| Send | 🟢 | HIGH |
|
||||
| Delete | 🟢 | HIGH |
|
||||
| Regex for scripts | 🔴 | HIGH |
|
||||
| Undelete | 🔴 | MEDIUM |
|
||||
| Undelete | 🟡 | MEDIUM |
|
||||
| React | 🟢 | MEDIUM |
|
||||
| Edit | 🔴 | MEDIUM |
|
||||
|
||||
|
|
@ -66,7 +68,7 @@ And, you can learn about API in `util/APIDOCS.md`.
|
|||
| Ratelimit | 🟢 | HIGH |
|
||||
| Create | 🟢 | HIGH |
|
||||
| Delete | 🟢 | HIGH |
|
||||
| Undelete | 🔴 | MEDIUM |
|
||||
| Undelete | 🟢 | MEDIUM |
|
||||
| Edit | 🔴 | MEDIUM |
|
||||
|
||||
### API
|
||||
|
|
@ -83,21 +85,15 @@ And, you can learn about API in `util/APIDOCS.md`.
|
|||
### Other
|
||||
| To do | Is done? | Priority |
|
||||
| ----- | -------- | -------- |
|
||||
| Footer | 🟢 | LOW |
|
||||
| Footer | 🔴 | LOW |
|
||||
| auto-scroll | 🟢 | LOW |
|
||||
| Multi-theme support | 🟡 | LOW |
|
||||
| Search | 🟡 | MEDIUM |
|
||||
| Better view, page support, support message limit correct | 🔴 | MEDIUM |
|
||||
| Sending message etc. will use fetch API | 🟢 | HIGH |
|
||||
| Multi-theme support, black theme | 🟡 | LOW |
|
||||
| Search | 🔴 | MEDIUM |
|
||||
| Page support, support message limit correct | 🔴 | MEDIUM |
|
||||
| from form to AJAX | 🟢 | HIGH |
|
||||
|
||||
### New Theme
|
||||
- [x] Login
|
||||
- [x] Register
|
||||
- [x] Main page
|
||||
- [x] Error
|
||||
- [x] Users
|
||||
- [x] Threads
|
||||
- [x] Create Thread
|
||||
- [ ] Thread
|
||||
- [ ] User
|
||||
- [ ] Admin
|
||||
## Major Version History
|
||||
- V3: New Theme
|
||||
- V2: Backend fix, mongoose is fixed. Really big fix.
|
||||
- V1: Mongoose added.
|
||||
- V0: Birth with quick.db
|
||||
|
|
@ -79,13 +79,20 @@ document.getElementById("send").addEventListener("submit", async e => {
|
|||
* Button Listener
|
||||
*/
|
||||
document.addEventListener("click", async e => {
|
||||
let page = 1;
|
||||
// e.preventDefault();
|
||||
if (e.target.id === "delete_thread") {
|
||||
const response = await request("/api/threads/" + e.target.value + "/delete");
|
||||
if (response.deleted) {
|
||||
alert("Thread deleted");
|
||||
window.location.href = "/threads";
|
||||
location.reload();
|
||||
}
|
||||
|
||||
} else if (e.target.id === "undelete_thread") {
|
||||
const response = await request("/api/threads/" + e.target.value + "/undelete");
|
||||
if (!response.deleted) {
|
||||
alert("Thread undeleted");
|
||||
location.reload();
|
||||
|
||||
}
|
||||
|
||||
} else if (e.target.id === "delete_message") {
|
||||
|
|
@ -95,17 +102,7 @@ document.addEventListener("click", async e => {
|
|||
alert("Message deleted");
|
||||
document.getElementById("message-delete-" + e.target.value).innerHTML = "<h3 style=\"display:inline;\">This message has been deleted</h3>";
|
||||
}
|
||||
} else if (e.target.id === "left_page") {
|
||||
e.preventDefault();
|
||||
|
||||
}else if (e.target.id === "right_page") {
|
||||
e.preventDefault();
|
||||
const response = await request(`/api/messages/${e.target.value}/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>";
|
||||
}
|
||||
}/*else if (e.target.id === "edit_thread") {
|
||||
} /*else if (e.target.id === "edit_thread") {
|
||||
window.location.href = "/threads/<%= thread.id }/edit";
|
||||
} */
|
||||
|
||||
|
|
|
|||
|
|
@ -37,10 +37,9 @@
|
|||
});
|
||||
|
||||
|
||||
if (response) {
|
||||
alert("Thread opened");
|
||||
if (response)
|
||||
window.location.href = "/threads/" + response.id;
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
|
|
|||
3
views/extra/footer.ejs
Normal file
3
views/extra/footer.ejs
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<div class="footer">
|
||||
<a href="https://github.com/Akif9748/akf-forum"> This website is powered by AKF-Forum </a>
|
||||
</div>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<br><br><br><br><br>
|
||||
<div class="footer">
|
||||
<p><a href="https://github.com/Akif9748/akf-forum"> This website is powered by AKF-Forum </a></p>
|
||||
</div>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
<head>
|
||||
<link rel="stylesheet" href="/css/old_style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title><%= title || "Akf-forum" %> </title>
|
||||
<meta name="description" content="Akf-forum!">
|
||||
<meta name="author" content="Akif9748">
|
||||
<link rel="icon" type="image/x-icon" href="/images/favicon.jpg">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
</head>
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
|
||||
<% if (user?.admin){ %>
|
||||
<div class="admin">
|
||||
<a class="admin" href="/admin"><p>You are admin, and you can go your page!</p></a>
|
||||
</div>
|
||||
<hr>
|
||||
|
||||
<% } %>
|
||||
|
||||
<a href="/"><img class="logo" src="/images/logo.jpg" alt="AKF-FORUM"></a>
|
||||
|
||||
<div class="navbar" id="navbar">
|
||||
|
||||
<a href="/threads">THREADS</a>
|
||||
<a href="/users">USERS</a>
|
||||
<a href="/search">SEARCH</a>
|
||||
<a href="/threads/create/">CREATE THREAD</a>
|
||||
|
||||
<% if (user){ %>
|
||||
<div style="float: right;" class="user" id="user">
|
||||
<a href=<%=user.getLink() %>>
|
||||
<h1>
|
||||
<%= user.name %><img class="circle" src=<%=user.avatar %> alt=<%= user.name %>>
|
||||
</h1>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<% } else { %>
|
||||
<a style="float: right; background-color: #5F875F;" href="/register">REGISTER</a>
|
||||
<a id="login" style="float: right; background-color:#5F87AF; " href="/login">LOGIN</a>
|
||||
<script>
|
||||
document.getElementById("login").href += "?redirect="+window.location.pathname;
|
||||
</script>
|
||||
|
||||
|
||||
<% } %>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<hr>
|
||||
|
|
@ -4,9 +4,10 @@
|
|||
<html lang="en">
|
||||
|
||||
<%- include("extra/meta", {title: "Log in!" }) %>
|
||||
<link rel="stylesheet" href="/css/login.css" />
|
||||
|
||||
<body style="text-align: center;">
|
||||
<link rel="stylesheet" href="/css/login.css" />
|
||||
|
||||
<%- include("extra/navbar") %>
|
||||
|
||||
<h1 class="title">Login</h1>
|
||||
|
|
|
|||
|
|
@ -3,9 +3,10 @@
|
|||
|
||||
<%- include("extra/meta", {title: "Register!" }) %>
|
||||
|
||||
<link rel="stylesheet" href="/css/login.css" />
|
||||
|
||||
<body style="text-align: center;">
|
||||
<link rel="stylesheet" href="/css/login.css" />
|
||||
|
||||
<%- include("extra/navbar") %>
|
||||
|
||||
<h1 class="title">Register</h1>
|
||||
|
|
|
|||
126
views/thread.ejs
126
views/thread.ejs
|
|
@ -1,69 +1,93 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<%- include("extra/old_header", { title: thread.title }) %>
|
||||
|
||||
<body>
|
||||
|
||||
<%- include("extra/old_navbar", {user}) %>
|
||||
<%- include("extra/meta", {title: "Thread list!" }) %>
|
||||
|
||||
|
||||
<h1 style="font-size: 35px;">
|
||||
<%= thread.title %>
|
||||
</h1>
|
||||
<body style="text-align: center;">
|
||||
<%- include("extra/navbar") %>
|
||||
|
||||
<h2 style="display:inline;">By <a href=<%="/users/" + thread.author.id %>> <%= thread.author.name %></a>
|
||||
<img class="circle" src=<%=thread.author.avatar %> alt=<%= thread.author.name %>>
|
||||
</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>
|
||||
<% } else if (thread.deleted) { %>
|
||||
<h3 style="display:inline;">This thread has been deleted</h3>
|
||||
<% }; %>
|
||||
|
||||
<hr>
|
||||
<link rel="stylesheet" href="/css/thread.css" />
|
||||
|
||||
|
||||
|
||||
<div id="messages" value="<%= thread.id %>">
|
||||
<% if (!user){ %>
|
||||
<h1>Guests cant view messages!</h1>
|
||||
<% }%>
|
||||
</div>
|
||||
<h1 style="font-size: 35px;color: #4d18e6;" >
|
||||
<%= thread.title %>
|
||||
</h1>
|
||||
|
||||
<hr>
|
||||
<h2 style="display:inline;">By <a href=<%="/users/" + thread.author.id %>> <%= thread.author.name %></a>
|
||||
<img class="circle" src=<%=thread.author.avatar %> alt=<%= thread.author.name %>>
|
||||
</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>
|
||||
<% } 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>
|
||||
|
||||
<% }; %>
|
||||
|
||||
|
||||
<form id="send">
|
||||
<textarea rows="4" cols="133" name="content"></textarea>
|
||||
<input name="threadID" type="hidden" value="<%= thread.id %>"></input>
|
||||
<hr>
|
||||
|
||||
<br>
|
||||
<% if (user){ %>
|
||||
<button type="submit">Send!</button>
|
||||
<%} else {%>
|
||||
<button disabled>Login for send</button>
|
||||
<% }%>
|
||||
|
||||
</form>
|
||||
<div id="messages" value="<%= thread.id %>">
|
||||
<% if (!user){ %>
|
||||
<h1>Guests cant view messages!</h1>
|
||||
<% }%>
|
||||
|
||||
<% if (user){ %>
|
||||
<script type="module" src="/js/thread.js"></script>
|
||||
<!--EXAMPLE MESSAGE-->
|
||||
<div class="message" id="message-3">
|
||||
|
||||
<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">
|
||||
<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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
<!--EXAMPLE MESSAGE END-->
|
||||
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
|
||||
<form id="send">
|
||||
<textarea rows="4" cols="133" name="content"></textarea>
|
||||
<input name="threadID" type="hidden" value="<%= thread.id %>"></input>
|
||||
|
||||
<br>
|
||||
<% if (user){ %>
|
||||
<button type="submit">Send!</button>
|
||||
<%} else {%>
|
||||
<button disabled>Login for send</button>
|
||||
<% }%>
|
||||
<script>
|
||||
document.getElementById("message-<%= scroll %>").scrollIntoView();
|
||||
</script>
|
||||
|
||||
<!-- <div style="float: right;">
|
||||
<h3 id="page_count" style="display:inline;">1</h3>
|
||||
<button id="left_page" style=" display:inline;float: right;" type="submit">PREV</button>
|
||||
|
||||
<button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button>
|
||||
</div>-->
|
||||
|
||||
<%- include("extra/old_footer") %>
|
||||
</body>
|
||||
</form>
|
||||
|
||||
<% if (user){ %>
|
||||
<script type="module" src="/js/thread.js"></script>
|
||||
<% }%>
|
||||
<script>
|
||||
document.getElementById("message-<%= scroll %>").scrollIntoView();
|
||||
</script>
|
||||
|
||||
<!-- BURAYA Bİ İLERİ BİR GERİ SAYFA BUTONU GELMEZ Mİ BE-->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in a new issue