Akif9748/akf-forum
Akif9748/akf-forum
1
1
Fork 0
mirror of https://github.com/Akif9748/akf-forum.git synced 2024-11-29 22:20:41 +03:00
Code Issues Projects Releases Packages Wiki Activity

BUMP! NEW THEME!

Browse source
This commit is contained in:
Akif9748 2022-08-26 16:27:29 +03:00
parent a857e68617
commit 7276d1c044
23 changed files with 422 additions and 103 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
README.md
View file

@ -19,8 +19,13 @@ Python is only for testing 😭
And, you can learn about API in `util/APIDOCS.md`. And, you can learn about API in `util/APIDOCS.md`.
## Credits ## Credits
* [Akif9748](https://github.com/Akif9748) - Project mainteiner, main developer * [Akif9748](https://github.com/Akif9748) - Project mainteiner, main developer, made **old** frontend
* [Camroku](https://github.com/Camroku) - Made stylesheets * [Tokmak](https://github.com/-) - Made **new** frontend
* [Camroku](https://github.com/Camroku) - Made **old** stylesheets
## Screenshot
![akf-forum](https://user-images.githubusercontent.com/70021050/160255959-ef216cba-1348-4d4b-9347-fe67e21348e7.png)
## Roadmap ## Roadmap
### User ### User
@ -60,7 +65,7 @@ And, you can learn about API in `util/APIDOCS.md`.
### API ### API
| To do | Is done? | Priority | | To do | Is done? | Priority |
| ----- | -------- | -------- | | ----- | -------- | -------- |
| RATELIMITS | 🟡 | MEDIUM | | RATELIMITS | 🟢 | MEDIUM |
| Other clients for forum via API | 🟢 | LOW | | Other clients for forum via API | 🟢 | LOW |
| Get message**s** | 🟢 | MEDIUM | | Get message**s** | 🟢 | MEDIUM |
| Send message | 🟢 | MEDIUM | | Send message | 🟢 | MEDIUM |
@ -74,10 +79,20 @@ And, you can learn about API in `util/APIDOCS.md`.
| ----- | -------- | -------- | | ----- | -------- | -------- |
| Footer | 🟢 | LOW | | Footer | 🟢 | LOW |
| auto-scroll | 🟢 | LOW | | auto-scroll | 🟢 | LOW |
| Multi-theme support | 🔴 | LOW | | Multi-theme support | 🟡 | LOW |
| Search | 🔴 | MEDIUM | | Search | 🟡 | MEDIUM |
| Better view, page support, support message limit correct | 🔴 | MEDIUM | | Better view, page support, support message limit correct | 🔴 | MEDIUM |
| Sending message etc. will use fetch API | 🟢 | HIGH | | Sending message etc. will use fetch API | 🟢 | HIGH |
## Screenshot ### New Theme
![akf-forum](https://user-images.githubusercontent.com/70021050/160255959-ef216cba-1348-4d4b-9347-fe67e21348e7.png) - [x] Users
- [x] Threads
- [ ] Login
- [ ] Register
- [ ] Thread
- [ ] User
- [ ] Main page
- [ ] Error
- [ ] ADMIN
- [ ] Create Thread

8
package.json
View file

@ -1,11 +1,10 @@
{ {
"name": "akf-forum", "name": "akf-forum",
"version": "2.9.2", "version": "2.9.2",
"description": "A forum script written in Node.js", "description": "A Node.js based forum software",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
"start": "node .", "start": "node ."
"reset": "node reset.js"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
@ -13,7 +12,8 @@
}, },
"author": "Akif9748", "author": "Akif9748",
"contributors": [ "contributors": [
"Camroku" "Camroku",
"Tokmak"
], ],
"license": "GPL-3.0-or-later", "license": "GPL-3.0-or-later",
"bugs": { "bugs": {

168
public/css/navbar.css Normal file
View file

@ -0,0 +1,168 @@
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
* {
box-sizing: border-box;
}
body {
margin: 0;
}
a {
text-decoration: none;
color: initial;
}
.header {
width: 100%;
padding: 20px;
display: flex;
justify-content: space-between;
align-self: center;
}
.logo {
padding: 10px;
font-size: 28px;
color: #4d18e6;
font-weight: 900;
}
.logo>span {
color: #606060;
}
.buttons {
padding: 0;
display: flex;
align-items: center;
}
.btn-primary {
color: #e8e8e8;
background-color: #4d18e6;
padding: 10px 20px 10px 20px;
border-radius: 4px;
font-weight: 700;
margin: 10px;
cursor: pointer;
border: 2px solid #4d18e6;
}
.btn-outline-primary {
color: #4d18e6;
padding: 10px 20px 10px 20px;
border-radius: 4px;
font-weight: 700;
margin: 10px;
cursor: pointer;
border: 2px solid #e2e2e2;
}
.menu {
width: 100%;
padding: 20px;
display: flex;
justify-content: space-around;
}
.btn-primary:hover {
color: #4d18e6;
background-color: rgba(0, 0, 0, 0);
border: 2px solid #4d18e6;
}
.menu-item {
padding: 10px;
font-weight: 700;
background-color: #606060;
color: #ffffff;
border-radius: 5px;
width: 100%;
text-align: center;
margin: 0px 10px 0px 0px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.active-menu {
background-color: #4d18e6;
}
body {
font-family: Poppins;
display: flex;
flex-direction: column;
height: 100%;
}
.btn-outline-primary:hover {
border: 2px solid #4d18e6;
}
.menu-item:hover {
background-color: #4d18e6;
}
.admin-bar {
font-size: 15px;
color: #ffffff;
background: #4d18e6;
text-align: center;
}
div.avatar {
padding-left: 10px;
}
.avatar>img {
width: 30px;
height: 30px;
border-radius: 50%;
margin: auto;
}
.box-username {
display: flex;
align-items: center;
font-size: 18px;
font-weight: 700;
color: #4d18e6;
}
@media (max-width: 992px) {
.header {
flex-direction: column;
align-items: center;
}
.menu {
flex-direction: column;
}
.menu-item {
margin: 0px 10px 10px 0px;
}
}
@media (max-width: 480px) {
.btn-outline-primary {
width: 100%;
text-align: center;
}
.buttons {
flex-direction: column;
width: 100%;
}
.btn-primary {
width: 100%;
text-align: center;
}
}

0
public/css/styles.css → public/css/old_style.css
View file

36
public/css/threads.css Normal file
View file

@ -0,0 +1,36 @@
.threads {
width: 100%;
padding: 20px;
}
.threads-box {
width: 100%;
padding: 8px;
box-shadow: 0 0 5px 0 #cbcbcb;
display: flex;
justify-content: space-between;
margin: 0px 0px 8px 0px;
cursor: pointer;
align-items: center;
}
.threads-box:hover {
background-color: #e2e2e2;
}
.thread-box-title {
padding: 10px;
font-size: 18px;
font-weight: 700;
}
.thread-box-title>span {
color: #ff0000;
}
@media (max-width: 480px) {
.threads-box {
flex-direction: column;
}
}

41
public/css/users.css Normal file
View file

@ -0,0 +1,41 @@
.users {
width: 100%;
padding: 20px;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 10px;
}
.user-box {
width: 100%;
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
box-shadow: 0 0 5px 0 #beb9b9;
}
.user-box-title {
padding: 10px;
margin: 8px;
font-weight: 500;
}
.user-box-title>span {
color: #ff0000;
}
.user-box-img {
width: 80px;
height: 80px;
}
@media (max-width: 992px) {
.users {
display: block;
}
.user-box {
margin-bottom: 10px;
}
}

2
routes/.js
View file

@ -3,6 +3,8 @@ const { Router } = require("express");
const app = Router(); const app = Router();
app.get("/", async (req, res) => { app.get("/", async (req, res) => {
const const
mem = process.memoryUsage().heapUsed / Math.pow(2, 20), mem = process.memoryUsage().heapUsed / Math.pow(2, 20),
users = await UserModel.count({deleted:false}), users = await UserModel.count({deleted:false}),

6
views/admin.ejs
View file

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Admin panel!" }) %> <%- include("extra/old_header", {title: "Admin panel!" }) %>
<body> <body>
<%- include("extra/navbar", {user}) %> <%- include("extra/old_navbar", {user}) %>
<h1>Welcome to the admin panel of the forum, <%= user.name %>!</h1> <h1>Welcome to the admin panel of the forum, <%= user.name %>!</h1>
@ -33,7 +33,7 @@
</script> </script>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>

6
views/createThread.ejs
View file

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Create Thread!" }) %> <%- include("extra/old_header", {title: "Create Thread!" }) %>
<body> <body>
<%- include("extra/navbar", {user}) %> <%- include("extra/old_navbar", {user}) %>
@ -45,7 +45,7 @@
</script> </script>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

2
views/error.ejs
View file

@ -31,7 +31,7 @@
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

8
views/extra/meta.ejs Normal file
View file

@ -0,0 +1,8 @@
<head>
<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">
</head>

54
views/extra/navbar.ejs
View file

@ -1,41 +1,47 @@
<link rel="stylesheet" href="/css/navbar.css" />
<% if (user?.admin){ %> <% if (user?.admin){ %>
<div class="admin"> <div class="admin-bar">
<a class="admin" href="/admin"><p>You are admin, and you can go your page!</p></a> <a href="/admin" class="admin-bar">You are admin, and you can go your page!</a>
</div> </div>
<hr>
<% } %> <% } %>
<a href="/"><img class="logo" src="/images/logo.jpg" alt="AKF-FORUM"></a> <div class="header">
<a class="logo" href="/">AKF <span>FORUM</span></a>
<div class="navbar" id="navbar"> <div class="buttons">
<a href="/threads">THREADS</a>
<a href="/users">USERS</a>
<a href="/search">SEARCH</a>
<a href="/threads/create/">CREATE THREAD</a>
<% if (user){ %> <% if (user){ %>
<div style="float: right;" class="user" id="user">
<a href=<%=user.getLink() %>> <a href="<%=user.getLink() %>" class="btn-outline-primary" >
<h1> <div class="box-username"><%= user.name %>
<%= user.name %><img class="circle" src=<%=user.avatar %> alt=<%= user.name %>> <div class="avatar"><img src="<%=user.avatar %>"></div>
</h1>
</a>
</div> </div>
</a>
<% } else { %> <% } 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> <a id="login" href="/login" class="btn-primary">Login</a>
<a href="/register" class="btn-outline-primary">Register</a>
<script> <script>
document.getElementById("login").href += "?redirect="+window.location.pathname; document.getElementById("login").href += "?redirect="+window.location.pathname;
</script> </script>
<% } %> <% } %>
</div> </div>
<hr> </div>
<div class="menu">
<a href="/threads" class="menu-item">Threads</a>
<a href="/users" class="menu-item">Users</a>
<a href="/search" class="menu-item">Search</a>
<a href="/threads/create/" class="menu-item">Create Thread</a>
<script>
const menuItems = document.getElementsByClassName("menu-item");
for (let i = 0; i < menuItems.length; i++)
if (menuItems[i].getAttribute("href") == window.location.pathname)
menuItems[i].classList.add("active-menu");
</script>
</div>

0
views/extra/footer.ejs → views/extra/old_footer.ejs
View file

2
views/extra/header.ejs → views/extra/old_header.ejs
View file

@ -1,5 +1,5 @@
<head> <head>
<link rel="stylesheet" href="/css/styles.css" /> <link rel="stylesheet" href="/css/old_style.css" />
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%= title || "Akf-forum" %> </title> <title><%= title || "Akf-forum" %> </title>

41
views/extra/old_navbar.ejs Normal file
View file

@ -0,0 +1,41 @@
<% 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>

6
views/index.ejs
View file

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Main page!" }) %> <%- include("extra/old_header", {title: "Main page!" }) %>
<body> <body>
<%- include("extra/navbar") %> <%- include("extra/old_navbar") %>
<% if (user) { %> <% if (user) { %>
<h1>Welcome, <a href=<%=user.getLink() %>> <%= user.name %></a> <h1>Welcome, <a href=<%=user.getLink() %>> <%= user.name %></a>
@ -46,7 +46,7 @@
</ul> </ul>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>

4
views/login.ejs
View file

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Login page!" }) %> <%- include("extra/old_header", {title: "Login page!" }) %>
<body> <body>
<!-- Navbar: --> <!-- Navbar: -->
@ -20,7 +20,7 @@
<input type="submit" value="Login"> <input type="submit" value="Login">
</form> </form>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

4
views/register.ejs
View file

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Register!" }) %> <%- include("extra/old_header", {title: "Register!" }) %>
<body> <body>
@ -30,7 +30,7 @@
<input type="submit" value="Register"> <input type="submit" value="Register">
</form> </form>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

6
views/thread.ejs
View file

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", { title: thread.title }) %> <%- include("extra/old_header", { title: thread.title }) %>
<body> <body>
<%- include("extra/navbar", {user}) %> <%- include("extra/old_navbar", {user}) %>
<h1 style="font-size: 35px;"> <h1 style="font-size: 35px;">
@ -63,7 +63,7 @@
<button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button> <button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button>
</div>--> </div>-->
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

31
views/threads.ejs
View file

@ -1,25 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/meta", {title: "Threads!" }) %>
<%- include("extra/header", {title: "Thread list" }) %>
<body> <body>
<link rel="stylesheet" href="/css/threads.css" />
<%- include("extra/navbar", {user}) %> <%- include("extra/navbar") %>
<div class="threads">
<h1>Threads:</h1>
<ul>
<% threads.forEach(thread=>{ %> <% threads.forEach(thread=>{ %>
<li> <a href="<%= thread.getLink() %>" class="">
<h1 style="display: inline;"> <a href=<%= thread.getLink() %> ><%= thread.title %></a></h1> <div class="threads-box">
<h3 style="display: inline;"> | By <%= thread.author.name %> <%= thread.deleted ? "(DELETED)" :"" %></h3> <div class="thread-box-title">
</li> <% if (thread.deleted) { %> <span>[DELETED]</span><% } %>
<%= thread.title %>
</div>
<div class="box-username">
<%= user.name %> <div class="avatar"><img src="<%=user.avatar %>"> </div>
</div>
</div>
</a>
<br>
<% }); %> <% }); %>
</ul>
</div>
<%- include("extra/footer") %>
</body> </body>
</html>

6
views/user.ejs
View file

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", { title: member.name }) %> <%- include("extra/old_header", { title: member.name }) %>
<body> <body>
<%- include("extra/navbar", { user }) %> <%- include("extra/old_navbar", { user }) %>
<ul> <ul>
@ -79,7 +79,7 @@
<h1>This user has been deleted!</h1> <h1>This user has been deleted!</h1>
<% }; %> <% }; %>
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>
</html> </html>

6
views/userEdit.ejs
View file

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "Edit user!" }) %> <%- include("extra/old_header", {title: "Edit user!" }) %>
<body> <body>
<%- include("extra/navbar", {user}) %> <%- include("extra/old_navbar", {user}) %>
<h1>This page's development is not completed yet.</h1> <h1>This page's development is not completed yet.</h1>
@ -22,7 +22,7 @@
<input type="submit" value="Register"> <input type="submit" value="Register">
</form> </form>
--> -->
<%- include("extra/footer") %> <%- include("extra/old_footer") %>
</body> </body>

27
views/users.ejs
View file

@ -1,27 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<%- include("extra/header", {title: "User list!" }) %> <%- include("extra/meta", {title: "User list!" }) %>
<body> <body>
<link rel="stylesheet" href="/css/users.css" />
<%- include("extra/navbar", {user}) %> <%- include("extra/navbar") %>
<div class="users">
<h1>USERS:</h1>
<ul>
<% users.forEach(user=>{ %> <% users.forEach(user=>{ %>
<li> <div class="user-box">
<h1><a href=<%= user.getLink() %> > <%= user.name %> <%= user.deleted ? "(DELETED)" :"" %></a> <img src="<%=user.avatar %>" class="user-box-img">
<img class="circle" src=<%=user.avatar %> alt=<%= user.name %>> <div class="user-box-title"> <a href="<%= user.getLink() %>">
</h1> <% if (user.deleted) { %> <span>[DELETED]</span><% } %>
</li> <%= user.name %></a></div>
</div>
<% }); %> <% }); %>
</ul>
</div>
<%- include("extra/footer") %>
</body> </body>
</html>