Mirrors/thelounge
2
0
Fork 0
mirror of https://github.com/thelounge/thelounge synced 2024-11-22 20:13:07 +00:00
Code Issues Projects Releases Packages Wiki Activity

Change index.html to be rendered using handlebars

Browse source
This commit is contained in:
Alistair McKinlay 2017-04-20 11:17:25 +01:00
parent 8658f15751
commit cc85b2143c
6 changed files with 85 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
client/index.html
View file

@ -9,7 +9,7 @@
<link rel="preload" as="script" href="js/bundle.js">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/style.css">
<link id="theme" rel="stylesheet" href="<%= theme %>">
<link id="theme" rel="stylesheet" href="{{ theme }}">
<style id="user-specified-css"></style>
<title>The Lounge</title>
@ -25,7 +25,7 @@
<meta name="theme-color" content="#455164">
</head>
<body class="signed-out <%= public ? "public" : "" %>">
<body class="signed-out {{ternary public 'public' '' }}">
<div id="wrap">
<div id="viewport">
@ -122,12 +122,17 @@
<div class="row">
<div class="col-sm-12">
<h1 class="title">
<%= public ? "The Lounge - " : "" %>
{{ternary public "The Lounge " " " }}
Connect
<%= !displayNetwork && lockNetwork ? "to " + defaults.name : "" %>
{{#unless displayNetwork}}
{{#if lockNetwork}}
to {{defaults.name}}
{{/if}}
{{/unless}}
</h1>
</div>
<div <%= typeof(displayNetwork) !== "undefined" && !displayNetwork ? 'style="display: none;"' : ''%>>
{{#unless displayNetwork}}
<div>
<div class="col-sm-12">
<h2>Network settings</h2>
</div>
@ -135,17 +140,17 @@
<label for="connect:name">Name</label>
</div>
<div class="col-sm-9">
<input class="input" id="connect:name" name="name" value="<%= defaults.name %>">
<input class="input" id="connect:name" name="name" value="{{defaults.name}}">
</div>
<div class="col-sm-3">
<label for="connect:host">Server</label>
</div>
<div class="col-sm-6 col-xs-8">
<input class="input" id="connect:host" name="host" value="<%= defaults.host %>" aria-label="Server address" <%= typeof(lockNetwork) !== "undefined" && lockNetwork ? "disabled" : "" %>>
<input class="input" id="connect:host" name="host" value="{{defaults.host}}" aria-label="Server address" {{ternary lockNetwork "disabled" ""}}>
</div>
<div class="col-sm-3 col-xs-4">
<div class="port">
<input class="input" type="number" min="1" max="65535" name="port" value="<%= defaults.port %>" aria-label="Server port" <%= typeof(lockNetwork) !== "undefined" && lockNetwork ? "disabled" : "" %>>
<input class="input" type="number" min="1" max="65535" name="port" value="{{defaults.port}}" aria-label="Server port" {{ternary lockNetwork "disabled" ""}}>
</div>
</div>
<div class="clearfix"></div>
@ -153,16 +158,17 @@
<label for="connect:password">Password</label>
</div>
<div class="col-sm-9">
<input class="input" id="connect:password" type="password" name="password" value="<%= defaults.password %>">
<input class="input" id="connect:password" type="password" name="password" value="{{defaults.password}}">
</div>
<div class="col-sm-9 col-sm-offset-3">
<label class="tls">
<input type="checkbox" name="tls" <%= defaults.tls ? "checked" : "" %> <%= typeof(lockNetwork) !== "undefined" && lockNetwork ? "disabled" : "" %>>
<input type="checkbox" name="tls" {{ternary defaults.tls "checked" ""}} {{ternary lockNetwork "disabled" ""}}>
Enable TLS/SSL
</label>
</div>
<div class="clearfix"></div>
</div>
{{/unless}}
<div class="col-sm-12">
<h2>User preferences</h2>
</div>
@ -170,27 +176,27 @@
<label for="connect:nick">Nick</label>
</div>
<div class="col-sm-9">
<input class="input nick" id="connect:nick" name="nick" value="<%= defaults.nick %>">
<input class="input nick" id="connect:nick" name="nick" value="{{defaults.nick}}">
</div>
<% if (!useHexIp) { %>
{{#unless useHexIp}}
<div class="col-sm-3">
<label for="connect:username">Username</label>
</div>
<div class="col-sm-9">
<input class="input username" id="connect:username" name="username" value="<%= defaults.username %>">
<input class="input username" id="connect:username" name="username" value="{{defaults.username}}">
</div>
<% } %>
{{/unless}}
<div class="col-sm-3">
<label for="connect:realname">Real name</label>
</div>
<div class="col-sm-9">
<input class="input" id="connect:realname" name="realname" value="<%= defaults.realname %>">
<input class="input" id="connect:realname" name="realname" value="{{defaults.realname}}">
</div>
<div class="col-sm-3">
<label for="connect:channels">Channels</label>
</div>
<div class="col-sm-9">
<input class="input" id="connect:channels" name="join" value="<%= defaults.join %>">
<input class="input" id="connect:channels" name="join" value="{{defaults.join}}">
</div>
<div class="col-sm-9 col-sm-offset-3">
<button type="submit" class="btn">Connect</button>
@ -261,14 +267,14 @@
<div class="col-sm-12">
<label for="theme-select" class="sr-only">Theme</label>
<select id="theme-select" name="theme" class="input">
<% themes.forEach(function(themeName) { %>
<option value="<%= themeName %>">
<%= themeName.charAt(0).toUpperCase() + themeName.slice(1) %>
{{#each themes}}
<option value="{{this}}">
{{firstLetterUppercase this}}
</option>
<% }) %>
{{/each}}
</select>
</div>
<% if (typeof prefetch === "undefined" || prefetch !== false) { %>
{{#unless prefetch}}
<div class="col-sm-12">
<h2>Links and URLs</h2>
</div>
@ -284,7 +290,7 @@
Auto-expand links
</label>
</div>
<% } %>
{{/unless}}
<div class="col-sm-12">
<h2>Notifications</h2>
</div>
@ -328,7 +334,8 @@
</label>
</div>
<% if (!public && !ldap.enable) { %>
{{#unless public}}
{{#unless ldap.enable}}
<div id="change-password">
<form action="" method="post">
<div class="col-sm-12">
@ -352,7 +359,8 @@
</div>
</form>
</div>
<% } %>
{{/unless}}
{{/unless}}
<div class="col-sm-12">
<h2>Custom Stylesheet</h2>
</div>
@ -809,13 +817,13 @@
<h2>About The Lounge</h2>
<p class="about">
<% if (gitCommit) { %>
{{#if gitCommit}}
The Lounge is running from source
(<a href="https://github.com/thelounge/lounge/tree/<%= gitCommit %>" target="_blank" rel="noopener"><code><%= gitCommit %></code></a>).<br>
<% } else { %>
The Lounge is in version <strong><%= version %></strong>
(<a href="https://github.com/thelounge/lounge/releases/tag/v<%= version %>" target="_blank" rel="noopener">See release notes</a>).<br>
<% } %>
(<a href="https://github.com/thelounge/lounge/tree/{{ gitCommit }}" target="_blank" rel="noopener"><code>{{ gitCommit }}</code></a>).<br>
{{else}}
The Lounge is in version <strong>{{version}}</strong>
(<a href="https://github.com/thelounge/lounge/releases/tag/v{{ version }}" target="_blank" rel="noopener">See release notes</a>).<br>
{{/if}}
<a href="https://thelounge.github.io/" target="_blank" rel="noopener">Website</a><br>
<a href="https://thelounge.github.io/docs/" target="_blank" rel="noopener">Documentation</a><br>

5
client/js/libs/handlebars/firstLetterUppercase.js Normal file
View file

@ -0,0 +1,5 @@
"use strict";
module.exports = function(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
};

18
client/js/libs/handlebars/index.js Normal file
View file

@ -0,0 +1,18 @@
"use strict";
module.exports = {
colorClass: require("./colorClass"),
diff: require("./diff"),
equal: require("./equal"),
firstLetterUppercase: require("./firstLetterUppercase"),
localedate: require("./localedate"),
localetime: require("./localetime"),
modes: require("./modes"),
parse: require("./parse"),
roundBadgeNumber: require("./roundBadgeNumber"),
slugify: require("./slugify"),
ternary: require("./ternary"),
tojson: require("./tojson"),
tz: require("./tz"),
users: require("./users"),
};

5
client/js/libs/handlebars/ternary.js Normal file
View file

@ -0,0 +1,5 @@
"use strict";
module.exports = function(test, yes, no) {
return test ? yes : no;
};

1
package.json
View file

@ -46,6 +46,7 @@
"commander": "2.9.0",
"event-stream": "3.3.4",
"express": "4.15.2",
"express-handlebars": "^3.0.0",
"fs-extra": "2.1.2",
"irc-framework": "2.6.1",
"ldapjs": "1.0.1",

40
src/server.js
View file

@ -5,7 +5,9 @@ var pkg = require("../package.json");
var Client = require("./client");
var ClientManager = require("./clientManager");
var express = require("express");
var expressHandlebars = require("express-handlebars");
var fs = require("fs");
var path = require("path");
var io = require("socket.io");
var dns = require("dns");
var Helper = require("./helper");
@ -29,7 +31,10 @@ module.exports = function() {
var app = express()
.use(allRequests)
.use(index)
.use(express.static("client"));
.use(express.static("client"))
.engine("html", expressHandlebars({extname: ".html", helpers: require("../client/js/libs/handlebars")}))
.set("view engine", "html")
.set("views", path.join(__dirname, "..", "client"));
var config = Helper.config;
var server = null;
@ -125,28 +130,19 @@ function index(req, res, next) {
return next();
}
return fs.readFile("client/index.html", "utf-8", function(err, file) {
if (err) {
throw err;
}
var data = _.merge(
pkg,
Helper.config
);
data.gitCommit = Helper.getGitCommit();
data.themes = fs.readdirSync("client/themes/").filter(function(themeFile) {
return themeFile.endsWith(".css");
}).map(function(css) {
return css.slice(0, -4);
});
var template = _.template(file);
res.setHeader("Content-Security-Policy", "default-src *; connect-src 'self' ws: wss:; style-src * 'unsafe-inline'; script-src 'self'; child-src 'self'; object-src 'none'; form-action 'none';");
res.setHeader("Referrer-Policy", "no-referrer");
res.setHeader("Content-Type", "text/html");
res.writeHead(200);
res.end(template(data));
var data = _.merge(
pkg,
Helper.config
);
data.gitCommit = Helper.getGitCommit();
data.themes = fs.readdirSync("client/themes/").filter(function(themeFile) {
return themeFile.endsWith(".css");
}).map(function(css) {
return css.slice(0, -4);
});
res.setHeader("Content-Security-Policy", "default-src *; connect-src 'self' ws: wss:; style-src * 'unsafe-inline'; script-src 'self'; child-src 'self'; object-src 'none'; form-action 'none';");
res.setHeader("Referrer-Policy", "no-referrer");
res.render("index", data);
}
function init(socket, client) {