started language locale-isation

This commit is contained in:
Ben Kyd
2021-04-02 22:54:17 +01:00
parent 6f115b528b
commit 26702831b2
9 changed files with 178 additions and 18 deletions

View File

@@ -7,6 +7,12 @@ SEE BELOW FOR CONFIGURATION GUIDE
https://scrabble.hasbro.com/en-us/rules
https://www.zapsplat.com/?s=scrabble
https://www.scrabble3d.info/t2342f139-Default-rules.html
## Configuration Guide
## Acknowledgements
Inês Filipa Baiõa Antunes - Tranlations (Portuguese, Spanish)

View File

@@ -6,21 +6,33 @@
<link rel="stylesheet" href="./main.css">
<title>Scrabble online</title>
<title>Scrabble! online</title>
</head>
<body>
<form id="input-username">
<label for="input-text-username">Username: </label>
<input id="input-text-username" type="text">
<button type="submit">Submit</button>
</form>
<script src="locale.js"></script>
<div id="client-id">Awaiting ClientID</div>
<div id="connection-state"></div>
<div id="lang">
<a href="javascript:void(0);" onclick="switchLocale('en');">English (Britain)</a> |
<a href="javascript:void(0);" onclick="switchLocale('pt');" hreflang="pt" lang="pt">Português (Portugal)</a> |
<a href="javascript:void(0);" onclick="switchLocale('es');" hreflang="es" lang="es">Español (España)</a>
</div>
<p><p>
<div id="content">
<h1>scrabble</h1>
<input type="button" value="play singleplayer" onclick="playSingleplayer()">
<form id="input-username">
<label for="input-text-username"><script>document.write(localeString('username'))</script>: </label>
<input id="input-text-username" type="text">
<button type="submit">Submit</button>
</form>
<div id="connection-state"></div>
<p><p>
<input type="button" value="play singleplayer" onclick="playSingleplayer()">
</div>
<script src="index.js"></script>
</body>

View File

@@ -2,14 +2,13 @@ const UsernameForm = document.querySelector('#input-username');
const UsernameInput = document.querySelector('#input-text-username');
// TODO: ^ LOWECASE U
const ClientID = document.querySelector('#client-id');
const ConnectionState = document.querySelector('#connection-state');
UsernameForm.addEventListener('submit', onUsernameSubmit);
function playSingleplayer()
{
document.location.href += 'scrabble';
document.location.href += '/scrabble';
}
// User submits their desired username
@@ -52,7 +51,6 @@ async function onUsernameSubmit(e)
{
sessionStorage.setItem('user', JSON.stringify(body.login.user));
console.log(sessionStorage.user)
ClientID.innerHTML = `ClientID: ${JSON.parse(sessionStorage.user).uid}`;
document.location.href += 'game';
}
}

30
client/public/locale.js Normal file
View File

@@ -0,0 +1,30 @@
// stateful ennit
function localeString(code)
{
let strings = JSON.parse(localStorage.getItem('locale-strings'));
let whatstring = strings[code];
let locale = whatstring[localStorage.getItem('locale')];
return locale;
}
function switchLocale(locale)
{
localStorage.setItem('locale', locale);
location.reload();
}
async function loadLoacale()
{
const res = await fetch('/locales', {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
});
localStorage.setItem('locale-strings', await res.text());
}
loadLoacale();
if (localStorage.getItem('locale') == null)
localStorage.setItem('locale', 'en');

View File

@@ -18,6 +18,26 @@ body {
user-select: none;
}
#lang {
position: inherit;
text-align: right;
right: 100%;
top: 0;
font-size: 14px;
}
#content {
position: absolute;
top: 20%;
left: 50%;
transform: translateX(-50%);
text-align: center;
}
/* I DID NOT WRITE THIS */
/* I can't reference it because i don't know where i got it from */
/* BUT ITS IMPORTANT THAT YOU KNOW THAT I DID NOT WRITE THIS */
/* Responsive mobile & touch support */
@media screen and (max-width: 768px) {
body {

View File

@@ -2,6 +2,7 @@ const Logger = require('./src/logger.js');
const Server = require('./src/webserver.js');
const Router = require('./src/router.js');
const Socket = require('./src/socketserver.js');
const Locale = require('./src/locale.js');
require('dotenv').config()
@@ -10,6 +11,7 @@ async function main()
Logger.SetLevel(Logger.VERBOSE_LOGS);
Logger.init();
await Locale.init();
await Server.init();
await Socket.init();
await Router.init();

24
server/src/locale.js Normal file
View File

@@ -0,0 +1,24 @@
const FS = require('fs');
let locales = {};
function init()
{
locales = JSON.parse(FS.readFileSync('src/locale.json'));
}
function GetLocaleListJSON()
{
return JSON.stringify(locales);
}
function GetLocaleList()
{
return locales;
}
module.exports = {
init: init,
GetLocaleListJSON: GetLocaleListJSON,
GetLocaleList: GetLocaleList
}

60
server/src/locale.json Normal file
View File

@@ -0,0 +1,60 @@
{
"scrabble-name": {
"en": "Scrabble",
"es": "Scrabble",
"pt": "Scrabble"
},
"username": {
"en": "Username",
"es": "Nombre de usuario",
"pt": "Nome de usuàrio"
},
"button-singleplayer": {
"en": "Play singleplayer",
"es": "Jugar a un(a) jugador(a)",
"pt": "Jogar singleplayer"
},
"button-submit": {
"en": "Submit",
"es": "Enviar",
"pt": "Enviar"
},
"status-connected": {
"en": "Connected",
"es": "",
"pt": ""
},
"error-bold": {
"en": "ERROR",
"es": "ERRO",
"pt": "ERROR"
},
"error-no-username": {
"en": "Username not present",
"es": "",
"pt": ""
},
"error-invalid-username": {
"en": "Invalid username",
"es": "",
"pt": ""
},
"error-taken-username": {
"en": "Username taken",
"es": "",
"pt": ""
},
"error-too-many-clients": {
"en": "Too many clients",
"es": "",
"pt": ""
},
"en": "",
"es": "",
"pt": ""
}

View File

@@ -1,6 +1,7 @@
const Logger = require('./logger.js');
const Server = require('./webserver.js');
const Game = require('./game.js')
const locale = require('./locale.js');
const Error = require('./error.js')
const Express = require('express');
@@ -16,6 +17,7 @@ async function init()
Server.App.use(Express.static('../client/public'));
Server.App.post('/login', HandleLogin);
Server.App.get('/locales', HandleGetLocales);
Logger.info('ROTUER SETUP');
}
@@ -49,7 +51,7 @@ function HandleLogin(req, res, next)
if (!req.body.username)
{
err.addError(400, 'Bad Request', 'Username not present');
err.addError(400, 'Bad Request', 'error-no-username');
err.end(res);
return;
}
@@ -58,14 +60,14 @@ function HandleLogin(req, res, next)
if (!Game.Registrar.ValidUsername(username))
{
err.addError(403, 'Forbidden', 'Invalid username');
err.addError(403, 'Forbidden', 'error-invalid-username');
err.end(res);
return;
}
if (!Game.Registrar.CheckUsernameAvailability(username))
{
err.addError(403, 'Forbidden', 'Username taken');
err.addError(403, 'Forbidden', 'error-taken-username');
err.end(res);
return;
}
@@ -78,7 +80,7 @@ function HandleLogin(req, res, next)
// remote network
if (Game.Registrar.CountIPs(ip) > 10)
{
err.addError(429, 'Too Many Requests', 'Too many clients');
err.addError(429, 'Too Many Requests', 'error-too-many-clients');
err.end(res);
return;
}
@@ -87,7 +89,7 @@ function HandleLogin(req, res, next)
if (!user)
{
err.addError(500, 'Internal Server Error', 'User Connected');
err.addError(500, 'Internal Server Error', 'status-connected');
err.end(res);
return;
}
@@ -104,3 +106,9 @@ function HandleLogin(req, res, next)
// Continue to later middleware
next();
}
async function HandleGetLocales(req, res, next)
{
const err = new Error;
res.end(locale.GetLocaleListJSON());
}