Add mainmenu

server/api/server-info.js

@@ -9,18 +9,25 @@ const authModes = [
 	"password",
 ];
 
-function getBGMain () {
+function getBase64fromPath (pathstring) {
-	let bgMain = global.config.source.bgmain;
+	if (typeof pathstring === "string" && pathstring !== "") {
-	if (typeof bgMain === "string") {
+		if (!path.isAbsolute(pathstring))
-		if (!path.isAbsolute(bgMain))
+			pathstring = path.join(__dirname, "..", pathstring);
-			bgMain = path.join(__dirname, "..", bgMain);
+		const mimetype = mime.lookup(pathstring);
-		const mimetype = mime.lookup(bgMain);
+		const base64content = fs.readFileSync(pathstring, { encoding: 'base64' });
-		const base64content = fs.readFileSync(bgMain, { encoding: 'base64' });
 		return `data:${mimetype};base64,${base64content}`;
 	}
 	return null;
 }
 
+function getBGMain () {
+	return getBase64fromPath(global.config.source.bgmain);
+}
+
+function getFaviconMain () {
+	return getBase64fromPath(global.config.source.favicon);
+}
+
 module.exports = {
 	name: global.config.server.info.name,
 	tag: global.config.server.info.tag,
@@ -28,5 +35,6 @@ module.exports = {
 	secureMode: global.config.server.secureMode ?? false,
 	extSource: {
 		bgmain: getBGMain(),
+		favicon: getFaviconMain(),
 	}
 };

server/api/setup-token.js

@@ -20,5 +20,5 @@ module.exports = async function (con, req, cb) {
 	const user = User.getByToken(req.token);
 	if (user === null) return invalidData();
 	global.authed.set(con, user);
-	ok(user.getUserForAPI(true));
+	return ok(user.getUserForAPI(true));
 };

server/config.json

@@ -24,7 +24,8 @@
 		"apiType": "kobold"
 	},
 	"source": {
-		"bgmain": "/home/fullgream/Загрузки/21380429c504a974479d31c96a9c3c3f.jpg"
+		"bgmain": "/home/fullgream/Downloads/21380429c504a974479d31c96a9c3c3f.jpg",
+		"favicon": "/home/fullgream/Documents/website-server/root/website-core/static/favicon.png"
 	},
 	"rootuser": {
 		"login": "admin",

server/frontend/public/css/connect/main.css

@@ -111,6 +111,19 @@
 	padding: 5px;
 }
 
+.mainmenu-window {
+	background-color: rgba(33,37,41,0.75);
+	backdrop-filter: blur(5px);
+	border-radius : 15px;
+	width: calc(90vw);
+	height: calc(80vh);
+	
+	margin-left: calc(5%);
+	margin-top: calc(5%);
+	
+	padding: 5px;
+}
+
 /* $accordion-color:green; */
 /* $accordion-padding-y:1.3rem; */
 /* $accordion-padding-x:2.5rem; */

server/frontend/public/js/connect/api.js

@@ -88,25 +88,29 @@ class ApiHTML {
 		this.api = api;
 	}
 	
-	async renderMainMenu (user, bgUrl = null) {
+	async renderMainMenu (user, bgUrl = null, favicon = null) {
 		bgUrl = bgUrl ?? "assets/hello/1.png";
+		favicon = favicon ?? "favicon.png";
 		
 		document.body.style.backgroundImage = `url(${
 			JSON.stringify(bgUrl)
 		})`;
 		document.body.style.backgroundSize = `${screen.width}px ${screen.height}px`;
+		$.find('link[rel="icon"]')[0].href = favicon;
 		
 		document.getElementById("server.area").innerHTML = '';
-		//$(document.getElementById("server.area")).append(ServerAuth.authForm);
+		$(document.getElementById("server.area")).append(ServerAuth.mainMenuForm);
 	}
 	
-	async renderAuth (authMode, bgUrl = null) {
+	async renderAuth (authMode, bgUrl = null, favicon = null) {
 		bgUrl = bgUrl ?? "assets/hello/1.png";
+		favicon = favicon ?? "favicon.png";
 		
 		document.body.style.backgroundImage = `url(${
 			JSON.stringify(bgUrl)
 		})`;
 		document.body.style.backgroundSize = `${screen.width}px ${screen.height}px`;
+		$.find('link[rel="icon"]')[0].href = favicon;
 		
 		document.getElementById("server.area").innerHTML = '';
 		$(document.getElementById("server.area")).append(ServerAuth.authForm);

server/frontend/public/js/connect/auth.js

@@ -91,3 +91,21 @@ ServerAuth.authForm.innerHTML = `
 `;
 
 // Main menu form
+ServerAuth.mainMenuForm = document.createElement("div");
+["mainmenu-window"].forEach(c =>
+	ServerAuth.mainMenuForm.classList.add(c));
+ServerAuth.mainMenuForm.innerHTML = `
+<div id="games-panel" hidden>
+	<div id="games-content">
+		<center><h2>Games</h2></center><hr/>
+	</div>
+</div>
+
+<div id="main-panel" >
+	<div id="main-content">
+		<center><h2>Your Profile</h2></center><hr/>
+	</div>
+</div>
+
+<div id="mainmenu-load" hidden><center>Loading...</center></div>
+`;

server/frontend/public/js/connect/main.js

@@ -68,9 +68,9 @@ socket.run()
 		const isAuthed = await socket.methods.authed();
 		
 		if (!user || !isAuthed)
-			await socket.html.renderAuth(data.authMode, data.extSource?.bgmain ?? null);
+			await socket.html.renderAuth(data.authMode, data.extSource?.bgmain ?? null, data.extSource?.favicon ?? null);
 		else
-			await socket.html.renderMainMenu(user, data.extSource?.bgmain ?? null);
+			await socket.html.renderMainMenu(user, data.extSource?.bgmain ?? null, data.extSource?.favicon ?? null);
 	})
 	.catch(err => {
 		console.error(err);