Skip to content

Commit

Permalink
Browser detection improvements (#22)
Browse files Browse the repository at this point in the history
Improved detection of incompatible web browsers.
  • Loading branch information
kshetline authored May 23, 2022
1 parent 5b79e62 commit 7af5723
Show file tree
Hide file tree
Showing 7 changed files with 137 additions and 156 deletions.
11 changes: 11 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,17 @@
}
]
}
},
{
"files": ["*.es5.js"],
"env": {
"browser": true
},
"rules": {
"no-eval": "off",
"no-template-curly-in-string": "off",
"no-var": "off"
}
}
]
}
14 changes: 12 additions & 2 deletions angular.json
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,12 @@
"inlineStyleLanguage": "scss",
"assets": [
"src/favicon.ico",
"src/assets"
"src/assets",
{
"glob": "browser-check.min.js*",
"input": "./node_modules/@tubular/browser-check/dist/",
"output": "./assets/"
}
],
"styles": [
"node_modules/primeng/resources/themes/arya-blue/theme.css",
Expand Down Expand Up @@ -142,7 +147,12 @@
"inlineStyleLanguage": "scss",
"assets": [
"src/favicon.ico",
"src/assets"
"src/assets",
{
"glob": "browser-check.min.js*",
"input": "./node_modules/@tubular/browser-check/dist/",
"output": "./assets/"
}
],
"styles": [
"src/styles.scss"
Expand Down
17 changes: 15 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "prague-clock",
"version": "1.6.4",
"version": "1.6.6",
"scripts": {
"ng": "ng",
"start": "ng serve --configuration=development",
Expand Down Expand Up @@ -52,6 +52,7 @@
"@angular/cli": "~13.2.5",
"@angular/compiler-cli": "~13.2.0",
"@angular/localize": "^13.2.7",
"@tubular/browser-check": "^1.0.2",
"@types/jasmine": "~3.10.6",
"@types/node": "^12.20.50",
"@types/three": "^0.139.0",
Expand Down
60 changes: 60 additions & 0 deletions src/assets/home-page-lang.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
(() => {
const specificLocale = (/\?(.*)\blang=([^&]+)/.exec(window.location.href) || [])[2];
const urlLocale = (/\borloj\/([^/]+)/.exec(window.location.href) || [])[1];
let locales = [];

if (navigator.languages)
locales = navigator.languages;
else if (navigator.language)
locales = [navigator.language];

if (specificLocale)
locales = [specificLocale];
else if (urlLocale) {
let matched = false;

for (const locale of locales) {
if (locale.startsWith(urlLocale)) {
locales = [locale];
matched = true;
break;
}
}

if (!matched)
locales = [urlLocale];
}

for (const locale of locales) {
if (locale.startsWith('cs')) {
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.querySelector('title').innerText = 'Simulátor pražského orloje';
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.getElementById('loading').innerText = 'Načítání...';
break;
}
else if (locale.startsWith('de')) {
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.querySelector('title').innerText = 'Pražský Orloj - Simulator der Prager astronomischen Uhr';
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.getElementById('loading').innerText = 'Wird geladen...';
break;
}
else if (locale.startsWith('es')) {
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.querySelector('title').innerText = 'Pražský Orloj - Simulador de Reloj Astronómico de Praga';
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.getElementById('loading').innerText = 'Cargando...';
break;
}
else if (locale.startsWith('fr')) {
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.querySelector('title').innerText = 'Pražský Orloj - Simulateur d\'horloge astronomique de Prague';
/* cSpell:disable-next-line */ // noinspection SpellCheckingInspection
document.getElementById('loading').innerText = 'Chargement...';
break;
}
else if (locale.startsWith('en'))
break;
}
})();
43 changes: 21 additions & 22 deletions src/assets/incompatible.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,47 +3,46 @@
<head>
<meta charset="UTF-8">
<title>Pražský Orloj - Simulator incompatible with your web browser</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<base href="./">
<style>
body {
align-items: center;
background: rgb(212,150,76);
background: linear-gradient(90deg,
rgba(212, 150, 76, 0.33) 0%, rgba(176, 186, 177, 0.33) 8%, rgba(140, 168, 167, 0.33) 17%, rgba(71, 153, 174, 0.33) 25%,
rgba(24, 146, 178, 0.33) 33%, rgba(11, 138, 176, 0.33) 42%, rgba(18, 133, 174, 0.33) 50%, rgba(11, 138, 176, 0.33) 58%,
rgba(24, 146, 178, 0.33) 67%, rgba(71, 153, 174, 0.33) 75%, rgba(140, 168, 167, 0.33) 83%, rgba(176, 186, 177, 0.33) 92%,
rgba(212, 150, 76, 0.33) 100%);
color: #444;
display: flex;
flex-direction: column;
background: #0E3D64;
color: white;
font: 14px Arial, Helvetica, sans-serif;
margin: 1em;
width: calc(100vw - 2em);
}

.page {
background: none;
width: calc(min(800px, calc(100vw - 2em)));
a {
color: #6AF;
font: 14px Arial, Helvetica, sans-serif;
}
a:active, a:hover { color: #9DF; }
a:visited { color: #6AF; }
</style>
</head>
<body>
<script>
var msg = (/\bmsg=([^&]*)/.exec(location.search) || [])[1];

if (msg)
document.write('<p style="color: red">' + decodeURIComponent(msg) + '</p>');
document.write('<p style="color: #F9B">' + decodeURIComponent(msg) + '</p>');

if (location.href.includes('?'))
if (history.replaceState && location.href.indexOf('?') >= 0)
history.replaceState(undefined, undefined, location.href.replace(/\?.*$/, ''));
</script>
<div class="page">
<p>Your web browser does not have the capabilities needed to run the simulator.</p>
<div>
<p>Your web browser does not have the capabilities needed to run the simulator.
Please try again with a more up-to-date web browser.</p>
<!-- cspell:disable -->
<p>Váš webový prohlížeč nemá schopnosti potřebné ke spuštění simulátoru.</p>
<p>Ihr Webbrowser verfügt nicht über die zum Ausführen des Simulators erforderlichen Funktionen.</p>
<p>Su navegador web no tiene las capacidades necesarias para ejecutar el simulador.</p>
<p>Votre navigateur Web n'a pas les capacités nécessaires pour exécuter le simulateur.</p>
<p>Váš webový prohlížeč nemá schopnosti potřebné ke spuštění simulátoru.
Zkuste to prosím znovu s aktuálnějším webovým prohlížečem.</p>
<p>Ihr Webbrowser verfügt nicht über die zum Ausführen des Simulators erforderlichen Funktionen.
Bitte versuchen Sie es erneut mit einem aktuelleren Webbrowser.</p>
<p>Su navegador web no tiene las capacidades necesarias para ejecutar el simulador.
Vuelva a intentarlo con un navegador web más actualizado.</p>
<p>Votre navigateur Web n'a pas les capacités nécessaires pour exécuter le simulateur.
Veuillez réessayer avec un navigateur Web plus récent.</p>
<a href="https://orloj.eu">orloj.eu</a>
</div>
</body>
Expand Down
Loading

0 comments on commit 7af5723

Please sign in to comment.