'How to store and update variable in ejs, access it on different routes

I am absolute beginner concerning javascript, express, node, ejs, etc, please go easy on me. :D

I am creating a website, which is a gallery of my projects. You can see a grid of them, and can check out live version by just clicking on the gif. Each project(two minigames), when clicked, goes to different route (/squareTap, /guessColor). Now i want to implement different language into the website. I added bootstrap dropdown, using which you can pick desired language. It works for main page, changes text nicely. But when you go to any project, this information gets lost... And i need it to make game know which language should it display epilepsy warning in, and accordingly change game descriptions.

This is how the website is structured: run with "node app.js"; each ejs file has its corresponding js and css files

//app.js
require('dotenv').config();
const express = require('express'),
    app = express(),
    bodyParser = require('body-parser'),
    https = require('https'),
    http = require('http'),
    fs = require('fs');

var setToEnglish = false;
// app.locals.setToEnglish = false;

app.use(bodyParser.urlencoded({extended: true}));
app.use(express.static(__dirname + '/views'));
app.use('/node_modules', express.static(__dirname + '/node_modules/'));
app.use('/sounds', express.static(__dirname + '/sounds/'));
app.use('/images', express.static(__dirname + '/images/'));
app.set('view engine', 'ejs');

const options = {
    key: fs.readFileSync('key.pem'),
    cert: fs.readFileSync('cert.pem')
};

app.get("/", function(req, res){
    res.render("main", { setToEnglish : setToEnglish});
});

app.get("/squareTap", function(req, res){
    res.render("squareTap", { setToEnglish : setToEnglish});
});

app.get("/guessColor", function(req, res){
    res.render("guessColor", { setToEnglish : setToEnglish});
});

https.createServer(options, app)
.listen(process.env.HTTPS_PORT, function () {
    console.log('Serving the https');
});

http.createServer(function (req, res) {
    res.writeHead(301, { 'Location': 'https://www.' + process.env.DOMAIN});
    res.end();
}).listen(process.env.HTTP_PORT);

I tried ejs global variable(if thats how its called). Basically I created a variable setToEnglish in app.js, passing it to each view(ejs files), couldnt figure out how to pass it to js file, so i did a function declaration inside ejs file, and executed those in js each time user changes language by clicking on dropdown option.

<script>
        function setGlobalToEnglish() {
            <% setToEnglish=true %>;
        }
        function setGlobalToPolish() {
            <% setToEnglish=false %>;
        }  
</script>

It didnt work, it did change the variable but only in the scope of current file. When user clicked the project he still received unchanged, default value.

I read some about res.locals, app.locals, and tried a bit but couldnt make it work. Js and ejs files did not recognize anything.

This is my goal: I need some way of knowing what language user has set, it should change according to what user clicked, be accessible to the views files(inside their js would be great). First thing games will do is to check the language and accordingly edit text.

Please help

Edit 1: I have declared setToEnglish as the global variable(inside app.js), first - by deleting var part. Then I tried to console.log(setToEnglish); inside main.js, got undefined error, then in main.ejs, inside <script></script>, also got undefined error. Then I changed declaration of variable to this form global.setToEnglish = false, and tried again. Getting undefined error in all cases.

Edit 2: Could not figure it out, so I changed the approach. I got rid of the language change dropdown, and added if statement to each of my views, which wont do exactly what I wanted, but close enough. It detects preferred language of the user by checking the settings of his browser, and accordingly swaps text on the website.

let preferredLanguage = window.navigator.language;
if(preferredLanguage.includes('en')) { 
  //changing text to english 
} else if(preferredLanguage.includes('pl')) {
  //changing text to polish
} ...


Solution 1:[1]

Some references could be taken from this other answer.

So this will definitely help. The main concept is we can set functions/variables globally in our app if we add it into global Express instance in your app (inside your app locals).

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 hittingonme