Add a GET parameter to change language

srv.js

@@ -14,9 +14,16 @@ app.set('view engine', 'pug');
 app.use(express.static('./static'));
 
 app.use(function(req, res, next) {
-  let locale = req.headers['accept-language'] || '';
+  let locale = req.query.lang || req.headers['accept-language'] || '';
   req.i18n = new i18n();
-  req.i18n.setLocale(locale.indexOf('en') !== -1 && locale.indexOf('en') < locale.indexOf('fr') ? 'en' : 'fr');
+  if (locale.indexOf('en') !== -1
+      && locale.indexOf('fr') !== -1)
+    req.i18n.setLocale(locale.indexOf('en') < locale.indexOf('fr') ? 'en' : 'fr');
+  else if (locale.indexOf('en') !== -1
+	   && locale.indexOf('fr') === -1)
+    req.i18n.setLocale('en');
+  else
+    req.i18n.setLocale('fr');
   next();
 });
 

static/canvas.js

@@ -18,6 +18,14 @@ let width = canvas.width;
 let height = canvas.height;
 let fontSize = 44;
 
+let params = {};
+if (window.location.search) {
+  let splitParams = window.location.search.split('?')[1].split('&');
+  for (let i in splitParams) {
+    params[splitParams[i].split('=')[0]] = decodeURIComponent(splitParams[i].split('=')[1]);
+  }
+}
+
 let get = function(url, cb) {
   let xmlHttp = new XMLHttpRequest();
   xmlHttp.onreadystatechange = function() {
@@ -40,7 +48,7 @@ let getImage = function(id, cb) {
 }
 
 let language = function() {
-  return navigator.language.indexOf('en') !== -1 ? 'en' : 'fr';
+  return (params.lang || navigator.language).indexOf('en') !== -1 ? 'en' : 'fr';
 }
 
 let _ = function(str) {
@@ -144,12 +152,6 @@ window.addEventListener('load', function() {
   document.querySelector('nav > a[href="' + hash + '"]').click();
 
   // Update inputs depending on URL params
-  if (window.location.search) {
-    let splitParams = window.location.search.split('?')[1].split('&');
-    let params = {};
-    for (let i in splitParams) {
-      params[splitParams[i].split('=')[0]] = decodeURIComponent(splitParams[i].split('=')[1]);
-    }
   if (params['bgColor'])
     document.querySelector('.colorpicker input[name="bgColor"][value="' + params['bgColor'] + '"]').checked = true;
   if (params['fgColor'])
@@ -162,7 +164,6 @@ window.addEventListener('load', function() {
     document.querySelector('input[name="icon"][value="' + params['icon'] + '"]').checked = true;
   if (params['signature'])
     document.getElementById('signature').value = params['signature'];
-  }
 
   // Add event listeners to inputs
   let inputs = document.querySelectorAll('.colorpicker input[type="radio"], #step3 input[type="radio"], #step4 input[type="radio"]');