Merge pull request #238 from Hornwitser/move-templates

Move EJS templates

CHANGELOG.md

@@ -10,6 +10,9 @@ Version 2.0.0
 - Factorio game and rcon port now defaults to a random port above 49151.
 - Removed unimplemented mods update command.
 - Fixed rcon password being generated with Math.random().
+- Added plugins directory to the views path.  This makes it possible for
+  plugins to render their own ejs views or pages in their own folders by
+  using paths of the format "pluginName/path/to/page-or-view".
 
 ### Breaking Changes
 
@@ -21,6 +24,8 @@ Version 2.0.0
   clusterioModel.
 - Instance names can no longer be invalid Windows file names.
 - Removed config management from the command line and the server manager.
+- Moved ejs templates into views folder and changed their extension to
+  .ejs.  Breaks playerManager.
 
 
 Version 1.2.1

master.js

@@ -42,7 +42,6 @@ const authenticate = require("lib/authenticate");
 const express = require("express");
 const compression = require('compression');
 const cookieParser = require('cookie-parser');
-const ejs = require("ejs");
 // Required for express post requests
 const bodyParser = require("body-parser");
 const fileUpload = require('express-fileupload');
@@ -59,9 +58,8 @@ app.use(fileUpload());
 app.use(compression());
 
 // dynamic HTML generations with EJS
-app.set('views', path.join(__dirname, 'static'));
-app.set('view engine', 'html');
-app.engine('html', ejs.renderFile);
+app.set('view engine', 'ejs');
+app.set('views', ['views', 'sharedPlugins']);
 
 // give ejs access to some interesting information
 app.use(function(req, res, next){

sharedPlugins/serverManager/masterPlugin.js

@@ -69,8 +69,8 @@ class masterPlugin {
 		let pages = [
 			{
 				addr: "/serverManager",
-				path: path.join(__dirname,"static/index.html"),
-				render: ejs
+				path: "serverManager/views/index",
+				render: true
 			},
 		]
 		pages.forEach(page => {
@@ -81,14 +81,10 @@ class masterPlugin {
 					} else {
 						var permissions = {};
 					}
-					page.render.renderFile(page.path, {
+					res.render(page.path, {
 						permissions,
 						serverManager: this,
 						req: req,
-					}, async (err, prom) => {
-						if(err) console.log(err);
-						let str = await prom;
-						res.send(str);
 					});
 				} else {
 					res.send(await fs.readFile(page.path));

sharedPlugins/serverManager/views/index.ejs

@@ -1,12 +1,12 @@
 <!doctype HTML>
 <head>
-	<%- include("./../../../static/head.html") %>
+	<%- include("head") %>
 	<link rel="stylesheet" type="text/css" href="/serverManager/serverManager.css">
 	<!-- <script defer type="module" src="/serverManager/index.js"></script> -->
 </head>
 
 <body>
-	<%- include("./../../../static/sidebar.html") %>
+	<%- include("sidebar") %>
 	<div id="body">
 		<div id="serverlistDisplayContainer" class="serverManagerMainContainer">
 			<%
@@ -33,6 +33,6 @@
 		</div>
 	</div>
 	<script>
-		<%- include("./index.js") %>
+		<%- include("serverManager/static/index.js") %>
 	</script>
 </body>

static/browserconfig.xml

@@ -1,2 +1,11 @@
 <?xml version="1.0" encoding="utf-8"?>
-<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>
+<browserconfig>
+	<msapplication>
+		<tile>
+			<square70x70logo src="/ms-icon-70x70.png"/>
+			<square150x150logo src="/ms-icon-150x150.png"/>
+			<square310x310logo src="/ms-icon-310x310.png"/>
+			<TileColor>#ffffff</TileColor>
+		</tile>
+	</msapplication>
+</browserconfig>

static/nodes.html

@@ -1,62 +0,0 @@
-<!doctype HTML>
-<head>
-	<%- include("head.html") %>
-	<!-- <script src="slaveDisplay.js"></script> -->
-</head>
-
-<body>
-	<%- include("nav.html") %>
-	<div id="body" class="container">
-            <div class="page-header mt-2 row" id="banner">
-                    <div class="col-lg-8 col-md-7 col-sm-6">
-                        <h2>Connected Nodes</h2>
-                    </div>
-            </div>
-			<div id="display">
-				<%
-                    let html = ""
-					for(let [id, slave] of locals.slaves){
-						html += `
-						<div id="${id}" class="slaveBox card mb-3">
-                            <div class="card-body">
-                                <h5 class="card-title"><a href='nodeDetails?instanceID=${id}'>
-                                    ${slave.instanceName}
-                                </a></h5>
-                            </div>
-                                <ul class="list-group list-group-flush">
-                                    <li class="list-group-item">ID: ${id}</li>
-                                    <li class="list-group-item">Last seen: ${moment(Number(slave.time)).format("DD.MM.YY, hh:mm")}</li>
-                                    <li class="list-group-item">Online players: ${slave.playerCount}</li>
-                                    <li class="list-group-item">IP: ${slave.publicIP}:${slave.serverPort}</li>
-                                    <li class="list-group-item">Host: ${slave.mac}</li>
-                                </ul>
-						`
-						for(let o in locals.masterPlugins){
-							let plug = locals.masterPlugins[o];
-							if(plug.main
-							&& plug.main.ui
-							&& typeof plug.main.ui.slaveListing == "object"
-							&& Array.isArray(plug.main.ui.slaveListing)){
-								let slaveListingEntries = plug.main.ui.slaveListing;
-								for(let i in slaveListingEntries){
-									let button = slaveListingEntries[i];
-									if(button.getHtml && typeof button.getHtml == "function"){
-										html += "<div class=\"plugin-link\">"
-										html += button.getHtml({slave});
-										html += "</div>"
-									}
-								}
-							}
-						}
-						html += `
-						</div>
-                    `
-					}
-				%>
-				<%- html %>
-			</div>
-    </div>
-<script>
-	$('.plugin-link a').addClass('btn btn-primary')
-</script>
-</body>

static/sidebar.html

@@ -1 +0,0 @@
-<%- include("nav.html") %>

views/index.ejs

@@ -1,11 +1,11 @@
 <!doctype HTML>
 <head>
-    <%- include("head.html") %>
+    <%- include("head") %>
     <script defer src="storage.js"></script>
 </head>
 
 <body>
-<%- include("nav.html") %>
+<%- include("nav") %>
 <div id="body" class="container">
     <div id="storage">
         <div class="page-header mt-2 row" id="banner">
@@ -46,4 +46,4 @@
 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
         integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
         crossorigin="anonymous"></script>
-</body>
+</body>

views/nav.ejs

@@ -10,28 +10,25 @@
     </div>
     <div class="nav-item mr-1">
         <a class="nav-link align-middle" href="/nodes">Slaves</a>
-    </div>
-    <%# Very ugly ejs code to hide the Players button if the playerManager plugin isn`t installed %>
-    <%
-    let sidebarPluginButtonsHtml = "";
-    for(let o in locals.masterPlugins){
+    </div><%
+for(let o in locals.masterPlugins) {
     let plug = locals.masterPlugins[o];
-    if(plug.main
-    && plug.main.ui
-    && typeof plug.main.ui.sidebar == "object"
-    && Array.isArray(plug.main.ui.sidebar)){
-    let sidebarEntries = plug.main.ui.sidebar;
-    for(let i in sidebarEntries){
-    let button = sidebarEntries[i];
-    if(button.getHtml && typeof button.getHtml == "function"){
-    sidebarPluginButtonsHtml += button.getHtml();
+    if (
+        plug.main
+        && plug.main.ui
+        && typeof plug.main.ui.sidebar == "object"
+        && Array.isArray(plug.main.ui.sidebar)
+    ) {
+        let sidebarEntries = plug.main.ui.sidebar;
+        for (let i in sidebarEntries) {
+            let button = sidebarEntries[i];
+            if (button.getHtml && typeof button.getHtml == "function") { %>
+        <%- button.getHtml() %><%
+            }
+        }
     }
-    }
-    }
-    }
-    %>
-    <%- sidebarPluginButtonsHtml %>
+} %>
     <div class="nav-item">
         <a class="nav-link align-middle" href="/settings">Settings</a>
     </div>
-</nav>
+</nav>

views/nodeDetails.ejs

@@ -1,13 +1,13 @@
 <!doctype HTML>
 <head>
-	<%- include("head.html") %>
+	<%- include("head") %>
 	<script src="lib/terminal.js"></script>
 	<script src="nodeDetails.js"></script>
 	<link rel="stylesheet" type="text/css" href="nodeDetails.css">
 </head>
 
 <body>
-	<%- include("nav.html") %>
+	<%- include("nav") %>
 	<div id="body" class="container">
 		<div id="hero">
 			<div id="display">
@@ -29,4 +29,4 @@
 			<!-- JS generates a div called .Terminal that appears here with the display and typing things -->
 		</div>
 	</div>
-</body>
+</body>

views/nodes.ejs

@@ -0,0 +1,54 @@
+<!doctype HTML>
+<head>
+	<%- include("head") %>
+	<!-- <script src="slaveDisplay.js"></script> -->
+</head>
+
+<body>
+	<%- include("nav") %>
+	<div id="body" class="container">
+		<div class="page-header mt-2 row" id="banner">
+			<div class="col-lg-8 col-md-7 col-sm-6">
+				<h2>Connected Nodes</h2>
+			</div>
+		</div>
+		<div id="display"><%
+for (let [id, slave] of locals.slaves) { %>
+			<div id="<%= id %>" class="slaveBox card mb-3">
+				<div class="card-body">
+					<h5 class="card-title"><a href='nodeDetails?instanceID=<%=id%>'>
+						<%= slave.instanceName %>
+					</a></h5>
+				</div>
+				<ul class="list-group list-group-flush">
+					<li class="list-group-item">ID: <%= id %></li>
+					<li class="list-group-item">Last seen: <%= moment(Number(slave.time)).format("DD.MM.YY, hh:mm") %></li>
+					<li class="list-group-item">Online players: <%= slave.playerCount %></li>
+					<li class="list-group-item">IP: <%= slave.publicIP %>:<%= slave.serverPort %></li>
+					<li class="list-group-item">Host: <%= slave.mac %></li>
+				</ul><%
+	for (let o in locals.masterPlugins) {
+		let plug = locals.masterPlugins[o];
+		if (
+			plug.main
+			&& plug.main.ui
+			&& typeof plug.main.ui.slaveListing == "object"
+			&& Array.isArray(plug.main.ui.slaveListing)
+		) {
+			let slaveListingEntries = plug.main.ui.slaveListing;
+			for (let i in slaveListingEntries) {
+				let button = slaveListingEntries[i];
+				if (button.getHtml && typeof button.getHtml == "function") { %>
+				<div class="plugin-link"><%- button.getHtml({slave}) %></div><%
+				}
+			}
+		}
+	} %>
+			</div><%
+} %>
+		</div>
+	</div>
+	<script>
+		$('.plugin-link a').addClass('btn btn-primary')
+	</script>
+</body>

views/settings.ejs

@@ -1,11 +1,11 @@
 <!doctype HTML>
 <head>
-	<%- include("head.html") %>
+	<%- include("head") %>
 	
 </head>
 
 <body>
-	<%- include("nav.html") %>
+	<%- include("nav") %>
 	<div id="body" class="container">
 		<div class="page-header mt-2 row" id="banner">
 			<div class="row">
@@ -16,4 +16,4 @@
 		</div>
 	</div>
 	<script src="settings.js"></script>
-</body>
+</body>

views/sidebar.ejs

@@ -0,0 +1 @@
+<%- include("nav") %>