Add language selector, refactoring, fixes

app.js

@@ -24,29 +24,42 @@ app.use(bodyParser.urlencoded({ extended: false }));
 app.use(cookieParser());
 app.use(basePath, express.static(path.join(__dirname, 'public')));
 
-app.use('/', index);
+// handle language
+var baseRoute = basePath + ':lang(' + Object.keys(strings).join('|') + ')?';
+app.use(baseRoute, function(req, res, next) {
+	res.locals.lang = req.params.lang || 'zh-cn';
+	res.locals.langs = Object.fromEntries(Object.keys(strings).map(function(lang) {
+		return [lang, new Intl.DisplayNames([lang], { type: 'language' }).of(lang)];
+	}));
+	res.locals.strings = strings[res.locals.lang];
+	res.locals.base_path = basePath;
+	next();
+});
+app.use(baseRoute, index);
+
+// apis
 app.use(basePath + 'api', apis);
 
+// service worker
+app.get(basePath + 'sw.js', function(req, res, next) {
+	res.sendFile(path.join(__dirname, 'public/javascripts/sw.js'));
+});
+
 // catch 404 and forward to error handler
 app.use(function(req, res, next) {
-  var err = new Error('Not Found');
-  err.status = 404;
-  next(err);
+	var err = new Error('Not Found');
+	err.status = 404;
+	next(err);
 });
 
 // error handler
 app.use(function(err, req, res, next) {
-  // set locals, only providing error in development
-  res.locals.message = err.message;
-  res.locals.error = req.app.get('env') === 'development' ? err : {};
-
-  // render the error page
-  res.status(err.status || 500);
-  var lang = (req.url.match(new RegExp('^' + basePath + '([^/]+)')) || [,])[1];
-  if (!(lang in strings)) {
-    lang = 'zh-cn';
-  }
-  res.render('error', { lang: lang, strings: strings[lang], base_path: basePath });
+	// set locals, only providing error in development
+	res.locals.error = req.app.get('env') === 'development' ? err : {};
+
+	// render the error page
+	res.status(err.status || 500);
+	res.render('error');
 });
 
 module.exports = app;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "naiveboom",
-  "version": "2.2.0",
+  "version": "2.2.1",
   "license": "MIT License",
   "private": true,
   "scripts": {
@@ -16,7 +16,7 @@
     "random-string-gen": "^1.1.4",
     "redis": "^4.7.1",
     "serve-favicon": "~2.4.5",
-    "ultimate-express": "^2.1.1",
+    "ultimate-express": "github:CL-Jeremy/ultimate-express#fix-multi-param-issues",
     "util": "^0.12.5"
   }
 }

public/javascripts/sw.js

@@ -7,7 +7,7 @@ self.addEventListener('install', function() {
 });
 
 self.addEventListener('fetch', function(event) {
-    event.respondWith(
+	event.respondWith(
 		caches.match(event.request).then(function(res) {
 			return res || fetch(event.request);
 		})

public/javascripts/view.js

@@ -6,7 +6,7 @@ function cacheDataURLFrom(text, toCache) {
 	var urlMap = {};
 	var attachmentCount = 0;
 	var test = /\[(.*?)\]\((data:.*?)\)/g;
-	var newText = text.replace(test, function (_, label, dataURL) {
+	var newText = text.replace(test, function(_, label, dataURL) {
 		fileName = encodeURIComponent(label.split(/[\\/]/).pop());
 		var fakeURL = cleanURL + '/' + ++attachmentCount +'/' + fileName;
 		urlMap[fakeURL] = dataURL;
@@ -52,7 +52,7 @@ app = new Vue({
 		},
 	},
 	mounted: function() {
-		navigator.serviceWorker.register(basePath + 'sw.js').then(function () {
+		navigator.serviceWorker.register(basePath + 'sw.js').then(function() {
 			return navigator.serviceWorker.ready;
 		}).then(function() {
 			return axios.post(basePath + 'api/get-msg', {

routes/index.js

@@ -1,41 +1,20 @@
 var express = require('ultimate-express');
-var path = require('path');
+var url = require('url');
 var router = express.Router();
-var conf = require('../config.js');
-var strings = require('../strings.js');
-
-var basePath = conf.base_path || '/';
-var baseRoute = basePath + ':lang('
-				+ Object.keys(strings).join('|') + ')?';
+var guidRegex = require('../config.js').reg_guid;
 
 /* GET home page. */
-router.get(baseRoute, function(req, res, next) {
-	/** @type {keyof typeof strings} */
-	var lang = req.params.lang || 'zh-cn';
-	res.render('index', {
-		lang: lang,
-		strings: strings[lang],
-		base_path: basePath,
-	});
-});
-
-/* GET service worker. */
-router.get(basePath + 'sw.js', function(req, res, next) {
-	res.sendFile(path.join(__dirname, '../public/javascripts/sw.js'));
+router.get('/', function (req, res, next) {
+	var origUrl = url.parse(req.originalUrl);
+	if (!/\/$/.exec(origUrl.pathname)) {
+		return res.redirect(301, origUrl.pathname + '/' + (origUrl.search || ''));
+	}
+	res.render('index');
 });
 
-var guidSubRoute = '/:guid('
-				+ conf.reg_guid.source.replace(/\$$/, '') + ')';
 /* GET view page */
-router.get(baseRoute + guidSubRoute, function (req, res, next) {
-	/** @type {keyof typeof strings} */
-	var lang = req.params.lang || 'zh-cn';
-	res.render('look', {
-		lang: lang,
-		strings: strings[lang],
-		base_path: basePath,
-		guid: req.params.guid,
-	});
+router.get('/:guid(' + guidRegex.source.replace(/\$$/, '') + ')', function(req, res, next) {
+	res.render('look', { guid: req.params.guid });
 });
 
 module.exports = router;

run.js

@@ -1,14 +1,14 @@
 var spawn = require('child_process').spawn;
 free = spawn('npm', ['start']);
 
-free.stdout.on('data', function (data) {
+free.stdout.on('data', function(data) {
 console.log('standard output:\n' + data);
 });
 
-free.stderr.on('data', function (data) {
+free.stderr.on('data', function(data) {
 console.log('standard error output:\n' + data);
 });
 
-free.on('exit', function (code, signal) {
-console.log('child process eixt ,exit:' + code);
-});
+free.on('exit', function(code, signal) {
+console.log('child process exited, exit:' + code);
+});

views/layout.pug

@@ -15,7 +15,15 @@ html(lang= lang)
   body
     <div class='navbar navbar-expand-lg fixed-top navbar-light bg-light'>
           <div class='container'>
-            <a href='!{base_path}!{lang}' class='navbar-brand'>naiveBoom</a>
+            div.nav-item.dropdown.d-flex
+              a.navbar-brand.mr-0(href=base_path+lang) naiveBoom
+              a.nav-link.dropdown-toggle#brandDropdown(href data-toggle='dropdown' aria-haspopup='true' aria-expanded='false') &#x1F310;
+              div.dropdown-menu(aria-labelledby='brandDropdown')
+                each v, k in langs
+                  if (v == lang)
+                    span.dropdown-item= v
+                  else
+                    a.dropdown-item(href=base_path+k)= v
             <button class='navbar-toggler' type='button' data-toggle='collapse' data-target='#navbarResponsive' aria-controls='navbarResponsive' aria-expanded='false' aria-label='Toggle navigation' style=''>
               <span class='navbar-toggler-icon'></span>
             </button>