summaryrefslogtreecommitdiff
path: root/site/index.html
diff options
context:
space:
mode:
authorstuebinm2021-04-08 17:44:53 +0200
committerstuebinm2021-04-08 17:53:10 +0200
commit3890d8ac88b2fdfa7b54d433e8e2edf2164be6f0 (patch)
tree375aafba67ee4c7a314bd55d17f89275bd691698 /site/index.html
parent7e38d7f84463342dd428e7400777fdc675a8fbce (diff)
add translation logic, locales for en and de
This adds a basic "replace fixed keys"-approach to translating the UI of surveys. So far this works great, but for complex things it may fail for some languages — for now I'll just try to take care not to add any output that puts things in the middle of sentences, which I think should work for a simple survey thing. The default language is still english, which is important as the language is declared withing a survey config — i.e. if loading it fails, it cannot be applied, and the "enter passphrase" dialog can also not change based on locales. This could possibly be fixed by adding an unencrypted "header" to the encrypted configs, but for now I'm not sure if that makes a lot of sense — it may be easier to just guess based on the browser's settings, and otherwise fall back to some specified default language. The "thanks for your answers"-page also has no translation so far.
Diffstat (limited to '')
-rw-r--r--site/index.html31
1 files changed, 17 insertions, 14 deletions
diff --git a/site/index.html b/site/index.html
index 5771e94..bceb936 100644
--- a/site/index.html
+++ b/site/index.html
@@ -1,4 +1,4 @@
-<html>
+<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
@@ -10,6 +10,7 @@
<script type="module">
import init, { age_encrypt, age_decrypt } from "./rage_wasm.js";
+ import _, { setLang } from "./i18n.js";
/// the basic idea here is to have functions which construct parts
/// of the DOM that renders the survey to a user. These functions
@@ -122,6 +123,8 @@
// makes a survey from a given json config object
function mkSurvey (survey) {
document.title = survey.title;
+ setLang(survey.lang);
+ document.getElementsByTagName("html")[0].lang = survey.lang;
// make the header with general information
let header = document.createElement("div");
appendChildren(header, [
@@ -146,7 +149,7 @@
});
let footer = mkElement("section");
- let submit = mkElement("button", "Submit");
+ let submit = mkElement("button", _("submit"));
let errormsg = mkElement("p", "", "error");
appendChildren(footer, [
mkElement("hr"),
@@ -182,17 +185,17 @@
console.log(response.text())
window.location.href = "thanks.html";
}
- errormsg.innerText = "POST request returned error code:\n"
+ errormsg.innerText = _("Error: post returned error") + "\n"
+ response.status + ": " + response.statusText;
errormsg.hidden = false;
}).catch(error => {
console.log(error);
- errormsg.innerText = "Error: The http POST request did not succeed.";
+ errormsg.innerText = _("Error: could not post");
errormsg.hidden = false;
});
} else {
- errormsg.innerText = "Cannot submit: not all required questions were filled in!";
+ errormsg.innerText = _("Error: answers invalid");
errormsg.hidden = false;
}
}
@@ -207,21 +210,21 @@
/// displays a passphrase prompt until the use enters a passphrase
/// which age can use for successful decryption
function askPassphrase (ciphertext, secondTry=false) {
- document.title = "Enter Passphrase";
+ document.title = _("Enter Passphrase");
let div = mkElement("div");
- let button = mkElement("button", "decrypt");
+ let button = mkElement("button", _("decrypt"));
let [passphrase,label] = mkOption(
"password",
- "please enter a passphrase to access the survey:"
+ _("please enter passphrase")
);
passphrase.value = "";
appendChildren(div, [
- mkElement("h1", "Passphrase"),
+ mkElement("h1", _("Passphrase")),
appendChildren(mkElement("p"),[label]),
passphrase,
button
].concat(
- secondTry ? [mkElement("p","passphrase was incorrect!","error")] : []
+ secondTry ? [mkElement("p",_("passphrase incorrect"),"error")] : []
));
root.appendChild(div);
button.onclick = () => {
@@ -247,7 +250,7 @@
mkElement("h1", "Error"),
mkElement("p", msg, "error"),
appendChildren(
- mkElement("p","attempted path: ","error"),
+ mkElement("p",_("attempted path:"),"error"),
[mkElement("tt", surveyUrl,"error")]
)
]);
@@ -275,7 +278,7 @@
console.log ("survey appears to be encrypted");
askPassphrase(bytearray);
} else {
- mkReadError ("Could not load this survey; it appears to be in a wrong or unknown format.");
+ mkReadError (_("Error: unknown format"));
}
}
/// if the survey was unencrypted, start it here. If it
@@ -287,14 +290,14 @@
}
// couldn't load survey json, show error message
} else {
- mkReadError ("Could not load this survey; are you sure that it exists?");
+ mkReadError (_("Error: survey doesn't exist"));
}
}
}
}
if (surveyUrl === "") {
- mkReadError ("There's nothing here. Maybe try appending something after the url?\n\nAlternatively, check to see if you copied the whole url.");
+ mkReadError (_("Error: nothing here"));
} else {
main ()
}