[WIP] Threads page is converting to new theme
This commit is contained in:
parent
7aa459e402
commit
0e659a8aa4
34
README.md
34
README.md
|
|
@ -33,7 +33,9 @@ And, you can learn about API in `util/APIDOCS.md`.
|
||||||
## Roadmap
|
## Roadmap
|
||||||
### TO-DO:
|
### TO-DO:
|
||||||
- If thread deleted, not show its messages in API.
|
- 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
|
### Frontend
|
||||||
### User
|
### User
|
||||||
| To do | Is done? | Priority |
|
| To do | Is done? | Priority |
|
||||||
|
|
@ -56,7 +58,7 @@ And, you can learn about API in `util/APIDOCS.md`.
|
||||||
| Send | 🟢 | HIGH |
|
| Send | 🟢 | HIGH |
|
||||||
| Delete | 🟢 | HIGH |
|
| Delete | 🟢 | HIGH |
|
||||||
| Regex for scripts | 🔴 | HIGH |
|
| Regex for scripts | 🔴 | HIGH |
|
||||||
| Undelete | 🔴 | MEDIUM |
|
| Undelete | 🟡 | MEDIUM |
|
||||||
| React | 🟢 | MEDIUM |
|
| React | 🟢 | MEDIUM |
|
||||||
| Edit | 🔴 | MEDIUM |
|
| Edit | 🔴 | MEDIUM |
|
||||||
|
|
||||||
|
|
@ -66,7 +68,7 @@ And, you can learn about API in `util/APIDOCS.md`.
|
||||||
| Ratelimit | 🟢 | HIGH |
|
| Ratelimit | 🟢 | HIGH |
|
||||||
| Create | 🟢 | HIGH |
|
| Create | 🟢 | HIGH |
|
||||||
| Delete | 🟢 | HIGH |
|
| Delete | 🟢 | HIGH |
|
||||||
| Undelete | 🔴 | MEDIUM |
|
| Undelete | 🟢 | MEDIUM |
|
||||||
| Edit | 🔴 | MEDIUM |
|
| Edit | 🔴 | MEDIUM |
|
||||||
|
|
||||||
### API
|
### API
|
||||||
|
|
@ -83,21 +85,15 @@ And, you can learn about API in `util/APIDOCS.md`.
|
||||||
### Other
|
### Other
|
||||||
| To do | Is done? | Priority |
|
| To do | Is done? | Priority |
|
||||||
| ----- | -------- | -------- |
|
| ----- | -------- | -------- |
|
||||||
| Footer | 🟢 | LOW |
|
| Footer | 🔴 | LOW |
|
||||||
| auto-scroll | 🟢 | LOW |
|
| auto-scroll | 🟢 | LOW |
|
||||||
| Multi-theme support | 🟡 | LOW |
|
| Multi-theme support, black theme | 🟡 | LOW |
|
||||||
| Search | 🟡 | MEDIUM |
|
| Search | 🔴 | MEDIUM |
|
||||||
| Better view, page support, support message limit correct | 🔴 | MEDIUM |
|
| Page support, support message limit correct | 🔴 | MEDIUM |
|
||||||
| Sending message etc. will use fetch API | 🟢 | HIGH |
|
| from form to AJAX | 🟢 | HIGH |
|
||||||
|
|
||||||
### New Theme
|
## Major Version History
|
||||||
- [x] Login
|
- V3: New Theme
|
||||||
- [x] Register
|
- V2: Backend fix, mongoose is fixed. Really big fix.
|
||||||
- [x] Main page
|
- V1: Mongoose added.
|
||||||
- [x] Error
|
- V0: Birth with quick.db
|
||||||
- [x] Users
|
|
||||||
- [x] Threads
|
|
||||||
- [x] Create Thread
|
|
||||||
- [ ] Thread
|
|
||||||
- [ ] User
|
|
||||||
- [ ] Admin
|
|
||||||
|
|
@ -79,13 +79,20 @@ document.getElementById("send").addEventListener("submit", async e => {
|
||||||
* Button Listener
|
* Button Listener
|
||||||
*/
|
*/
|
||||||
document.addEventListener("click", async e => {
|
document.addEventListener("click", async e => {
|
||||||
let page = 1;
|
|
||||||
// e.preventDefault();
|
// e.preventDefault();
|
||||||
if (e.target.id === "delete_thread") {
|
if (e.target.id === "delete_thread") {
|
||||||
const response = await request("/api/threads/" + e.target.value + "/delete");
|
const response = await request("/api/threads/" + e.target.value + "/delete");
|
||||||
if (response.deleted) {
|
if (response.deleted) {
|
||||||
alert("Thread 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") {
|
} else if (e.target.id === "delete_message") {
|
||||||
|
|
@ -95,17 +102,7 @@ document.addEventListener("click", async e => {
|
||||||
alert("Message 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-" + e.target.value).innerHTML = "<h3 style=\"display:inline;\">This message has been deleted</h3>";
|
||||||
}
|
}
|
||||||
} else if (e.target.id === "left_page") {
|
} /*else if (e.target.id === "edit_thread") {
|
||||||
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") {
|
|
||||||
window.location.href = "/threads/<%= thread.id }/edit";
|
window.location.href = "/threads/<%= thread.id }/edit";
|
||||||
} */
|
} */
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -37,10 +37,9 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
if (response) {
|
if (response)
|
||||||
alert("Thread opened");
|
|
||||||
window.location.href = "/threads/" + response.id;
|
window.location.href = "/threads/" + response.id;
|
||||||
}
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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">
|
<html lang="en">
|
||||||
|
|
||||||
<%- include("extra/meta", {title: "Log in!" }) %>
|
<%- include("extra/meta", {title: "Log in!" }) %>
|
||||||
<link rel="stylesheet" href="/css/login.css" />
|
|
||||||
|
|
||||||
<body style="text-align: center;">
|
<body style="text-align: center;">
|
||||||
|
<link rel="stylesheet" href="/css/login.css" />
|
||||||
|
|
||||||
<%- include("extra/navbar") %>
|
<%- include("extra/navbar") %>
|
||||||
|
|
||||||
<h1 class="title">Login</h1>
|
<h1 class="title">Login</h1>
|
||||||
|
|
|
||||||
|
|
@ -3,9 +3,10 @@
|
||||||
|
|
||||||
<%- include("extra/meta", {title: "Register!" }) %>
|
<%- include("extra/meta", {title: "Register!" }) %>
|
||||||
|
|
||||||
<link rel="stylesheet" href="/css/login.css" />
|
|
||||||
|
|
||||||
<body style="text-align: center;">
|
<body style="text-align: center;">
|
||||||
|
<link rel="stylesheet" href="/css/login.css" />
|
||||||
|
|
||||||
<%- include("extra/navbar") %>
|
<%- include("extra/navbar") %>
|
||||||
|
|
||||||
<h1 class="title">Register</h1>
|
<h1 class="title">Register</h1>
|
||||||
|
|
|
||||||
126
views/thread.ejs
126
views/thread.ejs
|
|
@ -1,69 +1,93 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<%- include("extra/old_header", { title: thread.title }) %>
|
<%- include("extra/meta", {title: "Thread list!" }) %>
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<%- include("extra/old_navbar", {user}) %>
|
|
||||||
|
|
||||||
|
|
||||||
<h1 style="font-size: 35px;">
|
<body style="text-align: center;">
|
||||||
<%= thread.title %>
|
<%- include("extra/navbar") %>
|
||||||
</h1>
|
|
||||||
|
|
||||||
<h2 style="display:inline;">By <a href=<%="/users/" + thread.author.id %>> <%= thread.author.name %></a>
|
<link rel="stylesheet" href="/css/thread.css" />
|
||||||
<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>
|
|
||||||
|
|
||||||
|
|
||||||
<div id="messages" value="<%= thread.id %>">
|
<h1 style="font-size: 35px;color: #4d18e6;" >
|
||||||
<% if (!user){ %>
|
<%= thread.title %>
|
||||||
<h1>Guests cant view messages!</h1>
|
</h1>
|
||||||
<% }%>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<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">
|
<hr>
|
||||||
<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>
|
|
||||||
<% }%>
|
|
||||||
|
|
||||||
</form>
|
<div id="messages" value="<%= thread.id %>">
|
||||||
|
<% if (!user){ %>
|
||||||
|
<h1>Guests cant view messages!</h1>
|
||||||
|
<% }%>
|
||||||
|
|
||||||
<% if (user){ %>
|
<!--EXAMPLE MESSAGE-->
|
||||||
<script type="module" src="/js/thread.js"></script>
|
<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;">
|
</form>
|
||||||
<h3 id="page_count" style="display:inline;">1</h3>
|
|
||||||
<button id="left_page" style=" display:inline;float: right;" type="submit">PREV</button>
|
<% if (user){ %>
|
||||||
|
<script type="module" src="/js/thread.js"></script>
|
||||||
<button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button>
|
<% }%>
|
||||||
</div>-->
|
<script>
|
||||||
|
document.getElementById("message-<%= scroll %>").scrollIntoView();
|
||||||
<%- include("extra/old_footer") %>
|
</script>
|
||||||
</body>
|
|
||||||
|
<!-- BURAYA Bİ İLERİ BİR GERİ SAYFA BUTONU GELMEZ Mİ BE-->
|
||||||
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Loading…
Reference in New Issue