|
@@ -32,7 +32,7 @@
|
|
|
|
|
|
|
|
|
|
|
|
- <form id="transliterate" action="/transliterate" method="POST">
|
|
|
+ <form id="transliterate" action="/trans" method="POST">
|
|
|
<fieldset>
|
|
|
<label for="text">Input text</label>
|
|
|
<textarea id="text" name="text"></textarea>
|
|
@@ -42,9 +42,19 @@
|
|
|
<option value="{{ k }}">{{ v["name"] }}</option>
|
|
|
{% endfor %}
|
|
|
</select>
|
|
|
+ </fieldset>
|
|
|
+ <fieldset>
|
|
|
+ <legend>Direction</legend>
|
|
|
<div>
|
|
|
- <label class="label-inline" for="r2s">Roman to Script</label>
|
|
|
- <input type="checkbox" id="r2s" name="r2s">
|
|
|
+ <label class="label-inline" for="s2r">Script to Roman</label>
|
|
|
+ <input
|
|
|
+ type="radio" id="opt_s2r" name="t_dir" value="s2r"
|
|
|
+ checked>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <label class="label-inline" for="r2s">Roman to script</label>
|
|
|
+ <input
|
|
|
+ type="radio" id="opt_r2s" name="t_dir" value="r2s">
|
|
|
</div>
|
|
|
</fieldset>
|
|
|
<fieldset>
|
|
@@ -64,6 +74,7 @@
|
|
|
<input type="radio" id="all" name="capitalize" value="all">
|
|
|
</div>
|
|
|
</fieldset>
|
|
|
+ <div id="options"></div>
|
|
|
<fieldset>
|
|
|
<input class="button-primary" type="submit" value="Transliterate!">
|
|
|
</fieldset>
|
|
@@ -77,26 +88,59 @@
|
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
- document.getElementById('transliterate').addEventListener('submit',(event)=>{
|
|
|
+ document.getElementById('lang').addEventListener('change',(event)=>{
|
|
|
+ let lang = document.getElementById("lang").value;
|
|
|
+
|
|
|
+ fetch('/options/' + lang)
|
|
|
+ .then(response=>response.json())
|
|
|
+ .then((data) => {
|
|
|
+ document.getElementById("options").replaceChildren();
|
|
|
+ data.forEach((opt)=>{
|
|
|
+ let fset = document.createElement("fieldset");
|
|
|
+ let label = document.createElement("label");
|
|
|
+ label.setAttribute("for", opt.id);
|
|
|
+ label.append(opt.label);
|
|
|
+
|
|
|
+ let input = document.createElement("input");
|
|
|
+ input.setAttribute("id", opt.id);
|
|
|
+ input.setAttribute("name", opt.id);
|
|
|
+ input.classList.add("option_i");
|
|
|
+ input.value = opt.default;
|
|
|
+
|
|
|
+ fset.append(label, input);
|
|
|
+ document.getElementById("options").append(fset);
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ event.preventDefault();
|
|
|
+ return false;
|
|
|
+ })
|
|
|
+ document.getElementById('lang').dispatchEvent(new Event('change'));
|
|
|
|
|
|
|
|
|
+ document.getElementById('transliterate').addEventListener('submit',(event)=>{
|
|
|
|
|
|
const data = new URLSearchParams();
|
|
|
|
|
|
+ let t_dir = Array.from(document.getElementsByName("t_dir")).find(r => r.checked).value;
|
|
|
+
|
|
|
let capitalize = Array.from(document.getElementsByName("capitalize")).find(r => r.checked).value;
|
|
|
|
|
|
|
|
|
data.append('text',document.getElementById('text').value)
|
|
|
data.append('lang',document.getElementById('lang').value)
|
|
|
-
|
|
|
- if (document.getElementById('r2s').checked){
|
|
|
- data.append('r2s','on')
|
|
|
- }
|
|
|
-
|
|
|
+ data.append('t_dir',t_dir)
|
|
|
data.append('capitalize',capitalize)
|
|
|
|
|
|
+ let options = {};
|
|
|
+ let option_inputs = document.getElementsByClassName("option_i");
|
|
|
+ for (i = 0; i < option_inputs.length; i++) {
|
|
|
+ let el = option_inputs[i];
|
|
|
+ options[el.getAttribute('id')] = el.value;
|
|
|
+ };
|
|
|
+ data.append('options', JSON.stringify(options));
|
|
|
|
|
|
- fetch('/transliterate', {
|
|
|
+ fetch('/trans', {
|
|
|
method: 'post',
|
|
|
body: data,
|
|
|
})
|
|
@@ -117,12 +161,6 @@
|
|
|
alert("Error:\n" + error)
|
|
|
});
|
|
|
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
event.preventDefault()
|
|
|
return false
|
|
|
|