From 388835b85f157fe8e48b7ba903884d6c9a15fa62 Mon Sep 17 00:00:00 2001
From: Akif9748 <akif9748@gmail.com>
Date: Mon, 10 Oct 2022 00:04:25 +0300
Subject: [PATCH] Enchanted theme support!

---
 README.md                                     |  7 ++++--
 config.json.example                           |  6 ++++-
 index.js                                      | 11 ++++++++--
 lib.js                                        |  1 -
 models/User.js                                |  6 ++++-
 public/css/themes/{default.css => white.css}  |  0
 routes/api/routes/users.js                    |  3 +--
 {views => themes/default}/admin.ejs           |  0
 {views => themes/default}/avatar_upload.ejs   |  0
 {views => themes/default}/categories.ejs      |  0
 {views => themes/default}/config.ejs          |  0
 {views => themes/default}/create_category.ejs |  0
 {views => themes/default}/create_thread.ejs   |  0
 {views => themes/default}/error.ejs           |  0
 {views => themes/default}/extra/footer.ejs    |  5 +++--
 {views => themes/default}/extra/meta.ejs      |  4 ++--
 {views => themes/default}/extra/navbar.ejs    |  0
 {views => themes/default}/index.ejs           |  0
 themes/default/index.js                       | 22 +++++++++++++++++++
 {views => themes/default}/login.ejs           |  0
 {views => themes/default}/messages.ejs        |  0
 {views => themes/default}/register.ejs        |  0
 {views => themes/default}/search.ejs          |  0
 {views => themes/default}/setup.ejs           |  3 +--
 {views => themes/default}/thread.ejs          |  0
 {views => themes/default}/threads.ejs         |  0
 {views => themes/default}/user.ejs            |  0
 {views => themes/default}/users.ejs           |  0
 themes/index.js                               |  6 +++++
 29 files changed, 59 insertions(+), 15 deletions(-)
 rename public/css/themes/{default.css => white.css} (100%)
 rename {views => themes/default}/admin.ejs (100%)
 rename {views => themes/default}/avatar_upload.ejs (100%)
 rename {views => themes/default}/categories.ejs (100%)
 rename {views => themes/default}/config.ejs (100%)
 rename {views => themes/default}/create_category.ejs (100%)
 rename {views => themes/default}/create_thread.ejs (100%)
 rename {views => themes/default}/error.ejs (100%)
 rename {views => themes/default}/extra/footer.ejs (79%)
 rename {views => themes/default}/extra/meta.ejs (78%)
 rename {views => themes/default}/extra/navbar.ejs (100%)
 rename {views => themes/default}/index.ejs (100%)
 create mode 100644 themes/default/index.js
 rename {views => themes/default}/login.ejs (100%)
 rename {views => themes/default}/messages.ejs (100%)
 rename {views => themes/default}/register.ejs (100%)
 rename {views => themes/default}/search.ejs (100%)
 rename {views => themes/default}/setup.ejs (92%)
 rename {views => themes/default}/thread.ejs (100%)
 rename {views => themes/default}/threads.ejs (100%)
 rename {views => themes/default}/user.ejs (100%)
 rename {views => themes/default}/users.ejs (100%)
 create mode 100644 themes/index.js

diff --git a/README.md b/README.md
index ec2efd3..61dbf3a 100644
--- a/README.md
+++ b/README.md
@@ -54,16 +54,19 @@ Akf-forum has got an API for AJAX (fetch), other clients etc. And, you can learn
 - Add a feature list to README.md
 - delete admin???
 - change category name
-- theme support++, directly edit html!
+- theme support++, directly edit html! patch user support!
+- enchanted theme: not take all of the public! "/css
+
 ### front-end
 - better usermenu for user profile
 - old contents / titles add to forum interface
 - categories page is need a update, thread count in category (?) 
 - add ban button to user profile.?
 - who liked a message for web.
-- edit config from web admin panel.
+- give admin button
 
 ## Major Version History
+- V5: Enchanted theme support
 - V4: Caching
 - V3: New Theme
 - V2: Backend fix, mongoose is fixed. Really big fix.
diff --git a/config.json.example b/config.json.example
index 2bf0dc7..b419ed6 100644
--- a/config.json.example
+++ b/config.json.example
@@ -1,5 +1,9 @@
 {
-    "def_theme": "default",
+    "def_theme": {
+        "name": "white",
+        "color": "black",
+        "language": "en"
+    },
     "forum_name": "akf",
     "description": "Akf-forum!",
     "limits": {
diff --git a/index.js b/index.js
index d5e88c2..5bb8d3f 100644
--- a/index.js
+++ b/index.js
@@ -30,8 +30,15 @@ app.use(express.static("public", { maxAge: 86400 * 1000 }), express.json(), expr
         req.user = req.session.userID ? await UserModel.findOneAndUpdate({ id: req.session.userID }, {
             lastSeen: Date.now(), $addToSet: { ips: req.clientIp }
         }) : null;
-        res.reply = (page, options = {}, status = 200) => res.status(status)
-            .render(page, { user: req.user, theme: req.user?.theme || def_theme, forum_name, description, ...options });
+
+        const theme = require(`./themes/${req.user?.theme?.name || def_theme.name}`);
+        res.reply = (page, data = {}, status = 200) =>
+            theme.render(page, { user: req.user, ...data }, {
+                color: req.user?.theme?.color || def_theme.color,
+                lang: req.user?.theme?.language || def_theme.language,
+                forum_name,
+                description
+            }, res.status(status));
 
         res.error = (type, error) => res.reply("error", { type, error }, type);
 
diff --git a/lib.js b/lib.js
index 6c5d1c3..b57e8fa 100644
--- a/lib.js
+++ b/lib.js
@@ -5,7 +5,6 @@ require("dotenv").config();
 module.exports = {
     threadEnum: ["OPEN", "APPROVAL", "DELETED"],
     userEnum: ["ACTIVE", "APPROVAL", "DELETED", "BANNED"],
-    themes: ["default", "black"],
     RL(windowMs = 60_000, max = 1) {
         return RL({
             windowMs, max, standardHeaders: true, legacyHeaders: false,
diff --git a/models/User.js b/models/User.js
index b429320..a12222e 100644
--- a/models/User.js
+++ b/models/User.js
@@ -11,7 +11,11 @@ const schema = new mongoose.Schema({
     edited: { type: Boolean, default: false },
     about: { type: String, default: "", maxlength: limits.desp },
     admin: { type: Boolean, default: false },
-    theme: { type: String, default: def_theme },
+    theme: {
+        name: { type: String, default: def_theme.name },
+        color: { type: String, default: def_theme.color },
+        language: { type: String, default: def_theme.language }
+    },
     lastSeen: { type: Date, default: Date.now, select: false },
     hideLastSeen: { type: Boolean, default: false },
     ips: { type: [String], default: [], select: false },
diff --git a/public/css/themes/default.css b/public/css/themes/white.css
similarity index 100%
rename from public/css/themes/default.css
rename to public/css/themes/white.css
diff --git a/routes/api/routes/users.js b/routes/api/routes/users.js
index fcc9132..a68a7c3 100644
--- a/routes/api/routes/users.js
+++ b/routes/api/routes/users.js
@@ -1,7 +1,6 @@
 const { UserModel, BanModel } = require("../../../models");
 const { Router } = require("express");
 const multer = require("multer");
-const { themes } = require("../../../lib");
 
 const app = Router();
 
@@ -52,7 +51,7 @@ app.patch("/:id", async (req, res) => {
         if (about.length > desp) return res.error(400, `About must be under ${desp} characters`);
         member.about = about;
     }
-    if (theme || themes.includes(theme)) member.theme = theme;
+    // if (theme || themes.includes(theme)) member.theme = theme;
 
     if (typeof admin === "boolean" || ["false", "true"].includes(admin)) member.admin = admin;
     if (deleted === false) member.deleted = false;
diff --git a/views/admin.ejs b/themes/default/admin.ejs
similarity index 100%
rename from views/admin.ejs
rename to themes/default/admin.ejs
diff --git a/views/avatar_upload.ejs b/themes/default/avatar_upload.ejs
similarity index 100%
rename from views/avatar_upload.ejs
rename to themes/default/avatar_upload.ejs
diff --git a/views/categories.ejs b/themes/default/categories.ejs
similarity index 100%
rename from views/categories.ejs
rename to themes/default/categories.ejs
diff --git a/views/config.ejs b/themes/default/config.ejs
similarity index 100%
rename from views/config.ejs
rename to themes/default/config.ejs
diff --git a/views/create_category.ejs b/themes/default/create_category.ejs
similarity index 100%
rename from views/create_category.ejs
rename to themes/default/create_category.ejs
diff --git a/views/create_thread.ejs b/themes/default/create_thread.ejs
similarity index 100%
rename from views/create_thread.ejs
rename to themes/default/create_thread.ejs
diff --git a/views/error.ejs b/themes/default/error.ejs
similarity index 100%
rename from views/error.ejs
rename to themes/default/error.ejs
diff --git a/views/extra/footer.ejs b/themes/default/extra/footer.ejs
similarity index 79%
rename from views/extra/footer.ejs
rename to themes/default/extra/footer.ejs
index a2de9b6..b363a4c 100644
--- a/views/extra/footer.ejs
+++ b/themes/default/extra/footer.ejs
@@ -1,12 +1,13 @@
 <div class="footer">
   <% if (user){ %>
-  <a onclick="invert()" class="btn-primary" style="color:white;"><%=(user.theme === "default" ? "black" : "default" ) + " theme!" %></a>
+  <a onclick="invert()" class="btn-primary" style="color:white;"><%=(user.theme.color === "default" ? "black" : "default" ) + " theme!" %></a>
   <script>
     async function invert() {
+      return alert("disabled!")
       await fetch('/api/users/<%= user.id %>', {
         method: 'PATCH',
         body: JSON.stringify({
-          theme: "<%= user.theme === `default` ? `black` : `default` %>"
+          theme: {color:"<%= user.theme.color === `default` ? `black` : `default` %>"}
         }),
         headers: {
           "Content-Type": "application/json"
diff --git a/views/extra/meta.ejs b/themes/default/extra/meta.ejs
similarity index 78%
rename from views/extra/meta.ejs
rename to themes/default/extra/meta.ejs
index a40b07d..1fd8893 100644
--- a/views/extra/meta.ejs
+++ b/themes/default/extra/meta.ejs
@@ -4,9 +4,9 @@
   <title><%= title || forum_name +"-forum" %></title>
   <meta name="description" content="<%= description %>">
   <link rel="icon" type="image/x-icon" href="/favicon.ico">
-  <link rel="stylesheet" href="/css/themes/<%= theme %>.css" />
+  <link rel="stylesheet" href="/css/themes/<%= color %>.css" />
   <link rel="stylesheet" href="/css/common.css" />
-  <% if (theme === "black") { %>
+  <% if (color === "black") { %>
   <meta name="theme-color" content="#000000" />
   <% } %>
 </head>
\ No newline at end of file
diff --git a/views/extra/navbar.ejs b/themes/default/extra/navbar.ejs
similarity index 100%
rename from views/extra/navbar.ejs
rename to themes/default/extra/navbar.ejs
diff --git a/views/index.ejs b/themes/default/index.ejs
similarity index 100%
rename from views/index.ejs
rename to themes/default/index.ejs
diff --git a/themes/default/index.js b/themes/default/index.js
new file mode 100644
index 0000000..127e2ac
--- /dev/null
+++ b/themes/default/index.js
@@ -0,0 +1,22 @@
+const path = require('path');
+module.exports = {
+    name: "default",
+    colors: ["black", "white"],
+    languages: ["en"],
+    getFilePath(page) {
+        return path.resolve(__dirname, page)  ;// path of the file for ejs rendering
+    },
+    /**
+     * Renderer function for theme
+     * @param {String} file a page of forum 
+     * @param {{ user: Object }} data informations about page 
+     * @param {{ color: String, forum_name:String, description:String }} options Extra options
+     * @param {Object} render request object
+     */
+    render(file, data, options, req) {
+       // const { color, language, forum_name, description } = options; // General informations, meta, forum name, user language and color
+       // const { user } = data; // specific informations about page, user (req.user || null), and more
+
+        return req.render(this.getFilePath(file), { ...options, ...data });
+    }
+}
\ No newline at end of file
diff --git a/views/login.ejs b/themes/default/login.ejs
similarity index 100%
rename from views/login.ejs
rename to themes/default/login.ejs
diff --git a/views/messages.ejs b/themes/default/messages.ejs
similarity index 100%
rename from views/messages.ejs
rename to themes/default/messages.ejs
diff --git a/views/register.ejs b/themes/default/register.ejs
similarity index 100%
rename from views/register.ejs
rename to themes/default/register.ejs
diff --git a/views/search.ejs b/themes/default/search.ejs
similarity index 100%
rename from views/search.ejs
rename to themes/default/search.ejs
diff --git a/views/setup.ejs b/themes/default/setup.ejs
similarity index 92%
rename from views/setup.ejs
rename to themes/default/setup.ejs
index ea08904..c93410a 100644
--- a/views/setup.ejs
+++ b/themes/default/setup.ejs
@@ -10,8 +10,7 @@
   <h1 style="color: var(--main);">Setup</h1>
   <h2 style="color: var(--second);">There is default settings for akf-forum, you not need to edit them, but you can! And, the first registered user will be admin.</h2>
   <form method="POST">
-    Default theme:
-    <input type="text" name="def_theme" value="default" required>
+
     Forum name:
     <input type="text" name="forum_name" value="akf" required>
     Forum description:
diff --git a/views/thread.ejs b/themes/default/thread.ejs
similarity index 100%
rename from views/thread.ejs
rename to themes/default/thread.ejs
diff --git a/views/threads.ejs b/themes/default/threads.ejs
similarity index 100%
rename from views/threads.ejs
rename to themes/default/threads.ejs
diff --git a/views/user.ejs b/themes/default/user.ejs
similarity index 100%
rename from views/user.ejs
rename to themes/default/user.ejs
diff --git a/views/users.ejs b/themes/default/users.ejs
similarity index 100%
rename from views/users.ejs
rename to themes/default/users.ejs
diff --git a/themes/index.js b/themes/index.js
new file mode 100644
index 0000000..ffb00bb
--- /dev/null
+++ b/themes/index.js
@@ -0,0 +1,6 @@
+const fs = require("fs");
+
+for (const theme of fs.readdirSync("./themes")) {
+    if (theme === "index.js") continue;
+    module.exports[theme] = require(`./${theme}`);
+}
\ No newline at end of file