gulp to minify, remove static file serving -- using nginx instead

.gitignore

@@ -1,3 +1,3 @@
 node_modules/
 configs/*.json
-static/img/*
+uploads/img/*

dist/css/style.css

@@ -0,0 +1 @@
+body{font-family:arial,helvetica,sans-serif;font-size:10pt;background:#eef2ff;flex:1;display:flex;flex-direction:column;min-height:100vh;margin:0}.code{border-left:10px solid #b7c5d9;display:block;padding-left:5px;font-family:monospace;margin:.5em 0}.pages a{text-decoration:none}object{object-fit:contain}.board-header{display:flex;flex-direction:column;align-items:center}.catalog-tile-button{width:100%;line-height:30px;float:left;background:#b7c5d9;text-decoration:none;color:#000}.catalog-tile-content{padding:5px}.catalog-tile{margin:2px;text-align:center;max-height:300px;width:250px;overflow:hidden;overflow-y:auto;border:2px solid #b7c5d9;box-sizing:border-box}.no-m-p{margin:0;padding:0}.catalog-thumb{box-shadow:0 0 3px #000;min-width:64px;min-height:64px;object-fit:cover}.catalog{display:flex;align-items:flex-start;justify-content:space-evenly;flex-flow:row wrap}.spoiler{background:#000}.spoiler:hover{color:#fff}.mode{background-color:red;color:#fff;font-weight:700;text-align:center}.reports{background:#fca!important;border-color:#c97!important;border-width:1px 0;border-style:solid none}.redtext{color:maroon}.greentext{color:green}blockquote a{color:#d00}blockquote{word-break:break-all;white-space:pre-wrap}span{margin-right:5px}section{display:flex;flex-direction:column;align-items:flex-start}input,textarea{font-family:arial,helvetica,sans-serif;font-size:10pt;border-radius:3px;max-width:100%;border:none;margin:2px;padding:5px}.form-wrapper{align-items:center;margin:10px 0}.actions{background:#d6daf0;border-color:#b7c5d9;border-width:0 1px 1px 0;border-style:none solid solid none;max-width:100%;display:flex;flex-direction:column;margin:2px 0;padding:2px}.action-wrapper{display:flex;flex-direction:column;align-items:flex-start}.actions label{margin:2px 0}.toggle-label:hover{box-shadow:inset 0 0 100px 100px rgba(255,255,255,.25)}.toggle-label{background:#d6daf0;padding:10px;border-radius:3px;text-align:center;border:1px solid #d3d3d3;max-width:100%;box-sizing:border-box}.toggle{display:none}.toggle:checked+.form-post{display:flex}.form-post{display:flex;flex-direction:column;max-width:100%;margin-top:10px}.togglable{display:none}.user-id{text-shadow:#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px;color:#fff;padding:0 2px}.post-check{position:relative;top:3px;margin:-3px 1px!important}.post-files{float:left;margin-right:10px}.post-data{margin-top:-10px;padding-top:10px}.post-file{display:inline-flex;flex-direction:column;margin:0 4px;padding:2px 0}.post-file-info{text-align:center;margin:2px;margin-top:0;max-width:128px;word-break:break-all}.post-file-src{margin:0 auto}input textarea{padding:8px}.container{padding:10px}.board-title{color:#af0a0f;font:bolder 28px Tahoma;letter-spacing:-2px;text-align:center;margin:0}.no-decoration{text-decoration:none;color:#fff}.banner-check{display:flex;align-items:center}.board-banner{margin:10px;max-width:100%}.board-description{text-align:center;margin:0}.ban,.post-container{box-sizing:border-box;margin:2px 0;padding:2px;background:#d6daf0;border-color:#b7c5d9;border-width:0 1px 1px 0;border-style:none solid solid none;max-width:100%}.post-container:target{background-color:#d6bad0!important;border-color:#ba9dbf}.post-container.op{background:0 0;border:none;width:100%}.post-subject{color:#0f0c5d;font-weight:700}.post-capcode{font-weight:700;color:red}.post-name{color:#117743;font-weight:700}.catalog-tile-content .post-info,.post-container.op .post-info{background:0 0}.post-info{margin:-2px;padding:2px;padding-left:1px}.post-info *{margin-bottom:0;margin-top:-2px}.navbar{border-bottom:1px solid #d3d3d3}.nav-item{line-height:50px;text-decoration:none;float:left;background:#d6daf0;padding-left:10px;padding-right:10px;border-right:1px solid #d3d3d3}.right{float:right}.nav-item:hover{box-shadow:inset 0 0 100px 100px rgba(255,255,255,.25)}.footer{border-top:1px solid #d3d3d3;text-align:center;flex-shrink:0;margin-top:auto;line-height:50px}table,td,th{border-bottom:1px solid #d3d3d3;border-collapse:collapse}.boards-table{margin:0 auto}th{background:#d6daf0}td,th{padding:5px}hr{color:#d3d3d3}@media only screen and (max-width:800px){input{height:30px}.form-post{width:100%}.form-login{width:100%}blockquote{margin:1em}.post-check{top:2px;margin-left:2px!important;height:8px}.post-container{width:100%;border:none}.catalog-tile{overflow-y:hidden}.boards-table{width:100%}.post-info{background-color:#b7c5d9}}

gulp/dist/css/style.css

@@ -0,0 +1 @@
+body{font-family:arial,helvetica,sans-serif;font-size:10pt;background:#eef2ff;flex:1;display:flex;flex-direction:column;min-height:100vh;margin:0}.code{border-left:10px solid #b7c5d9;display:block;padding-left:5px;font-family:monospace;margin:.5em 0}.pages a{text-decoration:none}object{object-fit:scale-down}.board-header{display:flex;flex-direction:column;align-items:center}.catalog-tile-button{width:100%;line-height:30px;float:left;background:#b7c5d9;text-decoration:none;color:#000}.catalog-tile-content{padding:5px}.catalog-tile{margin:2px;text-align:center;max-height:300px;width:250px;overflow:hidden;overflow-y:auto;border:2px solid #b7c5d9;box-sizing:border-box}.no-m-p{margin:0;padding:0}.catalog-thumb{box-shadow:0 0 3px #000;min-width:64px;min-height:64px;object-fit:cover}.catalog{display:flex;align-items:flex-start;justify-content:space-evenly;flex-flow:row wrap}.spoiler{background:#000}.spoiler:hover{color:#fff}.mode{background-color:red;color:#fff;font-weight:700;text-align:center}.reports{background:#fca!important;border-color:#c97!important;border-width:1px 0;border-style:solid none}.redtext{color:maroon}.greentext{color:green}blockquote a{color:#d00}blockquote{word-break:break-all;white-space:pre-wrap}span{margin-right:5px}section{display:flex;flex-direction:column;align-items:flex-start}input,textarea{font-family:arial,helvetica,sans-serif;font-size:10pt;border-radius:3px;max-width:100%;border:none;margin:2px;padding:5px}.form-wrapper{align-items:center;margin:10px 0}.actions{background:#d6daf0;border-color:#b7c5d9;border-width:0 1px 1px 0;border-style:none solid solid none;max-width:100%;display:flex;flex-direction:column;margin:2px 0;padding:2px}.action-wrapper{display:flex;flex-direction:column;align-items:flex-start}.actions label{margin:2px 0}.toggle-label:hover{box-shadow:inset 0 0 100px 100px rgba(255,255,255,.25)}.toggle-label{background:#d6daf0;padding:10px;border-radius:3px;text-align:center;border:1px solid #d3d3d3;max-width:100%;box-sizing:border-box}.toggle{display:none}.toggle:checked+.form-post{display:flex}.form-post{display:flex;flex-direction:column;max-width:100%;margin-top:10px}.togglable{display:none}.user-id{text-shadow:#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px,#000 0 0 1px;color:#fff;padding:0 2px}.post-check{position:relative;top:3px;margin:-3px 1px!important}.post-files{float:left;margin-right:10px}.post-data{margin-top:-10px;padding-top:10px}.post-file{display:inline-flex;flex-direction:column;margin:0 4px;padding:2px 0}.post-file-info{text-align:center;margin:2px;margin-top:0;max-width:128px;word-break:break-all}.post-file-src{margin:0 auto}input textarea{padding:8px}.container{padding:10px}.board-title{color:#af0a0f;font:bolder 28px Tahoma;letter-spacing:-2px;text-align:center;margin:0}.no-decoration{text-decoration:none;color:#fff}.banner-check{display:flex;align-items:center}.board-banner{margin:10px;max-width:100%}.board-description{text-align:center;margin:0}.ban,.post-container{box-sizing:border-box;margin:2px 0;padding:2px;background:#d6daf0;border-color:#b7c5d9;border-width:0 1px 1px 0;border-style:none solid solid none;max-width:100%}.post-container:target{background-color:#d6bad0!important;border-color:#ba9dbf}.post-container.op{background:0 0;border:none;width:100%}.post-subject{color:#0f0c5d;font-weight:700}.post-capcode{font-weight:700;color:red}.post-name{color:#117743;font-weight:700}.catalog-tile-content .post-info,.post-container.op .post-info{background:0 0}.post-info{margin:-2px;padding:2px;padding-left:1px}.post-info *{margin-bottom:0;margin-top:-2px}.navbar{border-bottom:1px solid #d3d3d3}.nav-item{line-height:50px;text-decoration:none;float:left;background:#d6daf0;padding-left:10px;padding-right:10px;border-right:1px solid #d3d3d3}.right{float:right}.nav-item:hover{box-shadow:inset 0 0 100px 100px rgba(255,255,255,.25)}.footer{border-top:1px solid #d3d3d3;text-align:center;flex-shrink:0;margin-top:auto;line-height:50px}table,td,th{border-bottom:1px solid #d3d3d3;border-collapse:collapse}.boards-table{margin:0 auto}th{background:#d6daf0}td,th{padding:5px}hr{color:#d3d3d3}@media only screen and (max-width:800px){input{height:30px}.form-post{width:100%}.form-login{width:100%}blockquote{margin:1em}.post-check{top:2px;margin-left:2px!important;height:8px}.post-container{width:100%;border:none}.catalog-tile{overflow-y:hidden}.boards-table{width:100%}.post-info{background-color:#b7c5d9}}

gulp/res/css/style.css

@@ -22,7 +22,7 @@ body {
 }
 
 object {
-	object-fit: scale-down;
+	object-fit: contain;
 }
 
 .board-header {

gulpfile.js

@@ -0,0 +1,50 @@
+'use strict';
+const gulp = require('gulp')
+	, less = require('gulp-less')
+	, uglify = require('gulp-uglify-es').default
+	, cleanCSS = require('gulp-clean-css')
+	, del = require('del');
+
+const paths = {
+	styles: {
+		src: 'gulp/res/css/*.css',
+		dest: 'dist/css/'
+	},
+	images: {
+		src: 'gulp/res/img/*',
+		dest: 'uploads/img/'
+	},
+	scripts: {
+		src: 'gulp/res/js/*.js',
+		dest: 'dist/js/'
+	}
+};
+
+function clean() {
+	return del([ 'dist' ]);
+}
+
+function styles() {
+	return gulp.src(paths.styles.src)
+		.pipe(less())
+		.pipe(cleanCSS())
+		.pipe(gulp.dest(paths.styles.dest));
+}
+
+function scripts() {
+	return gulp.src(paths.scripts.src)
+		.pipe(uglify())
+		.pipe(gulp.dest(paths.scripts.dest));
+}
+
+function images() { //basically the favicon and spoiler image
+  return gulp.src(paths.images.src)
+    .pipe(gulp.dest(paths.images.dest));
+}
+
+
+const build = gulp.parallel(styles, scripts, images);
+
+module.exports.clean = clean;
+module.exports.default = build;
+

helpers/uploadDirectory.js

@@ -1,6 +1,6 @@
 'use strict';
 
 const path = require('path');
-const directory = path.join(__dirname+'/../static/img/')
+const directory = path.join(__dirname+'/../uploads/img/')
 
 module.exports = directory;

package.json

@@ -22,7 +22,14 @@
     "sanitize-html": "^1.20.0",
     "uuid": "^3.3.2"
   },
-  "devDependencies": {},
+  "devDependencies": {
+    "del": "^4.1.0",
+    "gulp": "^4.0.0",
+    "gulp-clean-css": "^4.0.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-less": "^4.0.1",
+    "gulp-uglify-es": "^1.0.4"
+  },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "start": "node server.js",

server.js

@@ -55,15 +55,11 @@ const express  = require('express')
 	app.set('views', path.join(__dirname, 'views/pages'));
 	app.enable('view cache');
 
-	// static files
-	app.use('/css', express.static(__dirname + '/static/css'));
-	app.use('/js', express.static(__dirname + '/static/js'));
-	app.use('/img', express.static(__dirname + '/static/img'));
-
 	// routes
 	app.use('/forms', require(__dirname+'/controllers/forms.js'))
 	app.use('/', require(__dirname+'/controllers/pages.js'))
 
+	//404 catchall
 	app.get('*', (req, res) => {
 		res.status(404).render('404')
 	})

views/includes/boardheader.pug

@@ -1,5 +1,5 @@
 section.board-header
-	if board.banners
+	if board.banners.length > 0
 		object.board-banner(data=`/img/${board.banners[Math.floor(Math.random()*board.banners.length)]}` width='300' height='100')
 	a.no-decoration(href=`/${board._id}`)
 		h1.board-title /#{board._id}/ - #{board.name}

views/includes/head.pug

@@ -1,3 +1,4 @@
 meta(charset='utf-8')
 meta(name='viewport', content='width=device-width, initial-scale=1')
 link(rel='stylesheet' href='/css/style.css')
+link(rel='shortcut icon' href='/img/favicon.ico' type='image/x-icon')

views/mixins/post.pug

@@ -32,7 +32,7 @@ mixin post(post, truncate, manage=false, globalmanage=false)
 									if post.spoiler
 										object(data='/img/spoiler.png' width='128' height='128')
 									else
-										object(data=`/img/thumb-${file.filename.split('.')[0]}.png` width='128' height='')
+										object(data=`/img/thumb-${file.filename.split('.')[0]}.png`)
 			if post.message
 				if truncate
 					-

views/pages/message.pug

@@ -5,14 +5,13 @@ block head
 
 block content
 	h1 #{title}
-	if messages
-		ul
-			if message
-				li #{message}
-			if messages
-				each msg in messages
-					li #{msg}
-			if errors
-				each error in errors
-					li #{error}
+	ul
+		if message
+			li #{message}
+		if messages
+			each msg in messages
+				li #{msg}
+		if errors
+			each error in errors
+				li #{error}
 	p You will be redirected shortly. If you are not redirected automatically, you can #[a(href=redirect) click here].

wipe.js

@@ -77,10 +77,10 @@ const Mongo = require(__dirname+'/db/db.js')
 			}
 		}
 	});
-	await readdir('static/img/').then(async files => {
+	await readdir('uploads/img/').then(async files => {
 		await Promise.all(files.map(async file => {
 			if (file != 'spoiler.png')
-				unlink(path.join('static/img/', file));
+				unlink(path.join('uploads/img/', file));
 		}))
 	});
 	console.log('creating admin account: admin:changeme');