Translations minor refactoring

This commit is contained in:
Georgy Litvinov 2021-07-06 12:44:17 +02:00
parent 346ca096f9
commit f9a017cc9f

View file

@ -1,13 +1,3 @@
var pageTranslations = new Map();
var overridenTranslations = new Map();
var startSep = '\u25a4';
var endSep = '\u25a5';
var intSep = '\u25a6';
var resultSep = '\u200b\uFEFF\u200b\uFEFF\u200b';
var resultSepChars = '\u200b\uFEFF';
class PropAddr { class PropAddr {
constructor(node, number, args) { constructor(node, number, args) {
this.node = node; this.node = node;
@ -25,11 +15,23 @@ class PropInfo {
} }
} }
function onlineTranslation() {
var pageTranslations = new Map();
var overridenTranslations = new Map();
var startSep = '\u25a4';
var endSep = '\u25a5';
var intSep = '\u25a6';
var resultSep = '\u200b\uFEFF\u200b\uFEFF\u200b';
var resultSepChars = '\u200b\uFEFF';
translationsParsing();
createTranslationsInterface();
function saveTranslations() { function saveTranslations() {
var storage = window.localStorage; var storage = window.localStorage;
var serializedTranslations = JSON.stringify(Array.from(overridenTranslations.entries())); var serializedTranslations = JSON.stringify(Array.from(overridenTranslations.entries()));
storage.setItem("overridenTranslations", serializedTranslations); storage.setItem("overridenTranslations", serializedTranslations);
} }
function readTranslations() { function readTranslations() {
var storage = window.localStorage; var storage = window.localStorage;
var serializedTranslations = storage.getItem("overridenTranslations"); var serializedTranslations = storage.getItem("overridenTranslations");
@ -39,20 +41,20 @@ function readTranslations() {
} }
function createTranslationsInterface() { function createTranslationsInterface() {
var devPanel = document.getElementById("developerPanel");
if (devPanel !== null) {
var container = document.createElement("div"); var container = document.createElement("div");
container.setAttribute("id", "translationsContainer"); container.setAttribute("id", "translationsContainer");
container.setAttribute("style", "font-size:0.8em !important;width: 440px; resize: horizontal; overflow: auto; padding: 10px; position: absolute;background-color:#f7dd8a;border:1px dotted;z-index:10000"); container.setAttribute("style", "font-size:0.8em !important;width: 440px; resize: horizontal; \
//document.body.appendChild(container); overflow: auto; padding: 10px; position: absolute;background-color:#f7dd8a;border:1px dotted;z-index:10000");
var devPanel = document.getElementById("developerPanel");
devPanel.parentNode.insertBefore(container, devPanel.nextSibling); devPanel.parentNode.insertBefore(container, devPanel.nextSibling);
createTranslationControls(container); createTranslationControls(container);
createTableFromPageTranslations(container); createTableFromPageTranslations(container);
//$(document.getElementById("translationsContainer")).draggable(); }
} }
function createTranslationControls(container) { function createTranslationControls(container) {
var controls = document.createElement("div") var controls = document.createElement("div");
controls.setAttribute("id", "translationControls"); controls.setAttribute("id", "translationControls");
controls.setAttribute("style", "margin-bottom:8px;") controls.setAttribute("style", "margin-bottom:8px;")
container.appendChild(controls); container.appendChild(controls);
@ -60,19 +62,19 @@ function createTranslationControls(container){
var cleanButton = document.createElement("button"); var cleanButton = document.createElement("button");
cleanButton.textContent = "Clean All"; cleanButton.textContent = "Clean All";
cleanButton.setAttribute("onclick", "cleanTranslations()"); cleanButton.setAttribute("onclick", "cleanTranslations()");
cleanButton.setAttribute("style","margin-right:10px;") cleanButton.setAttribute("style", "margin-right:10px;");
controls.appendChild(cleanButton); controls.appendChild(cleanButton);
var exportAllButton = document.createElement("button"); var exportAllButton = document.createElement("button");
exportAllButton.textContent = "Export All"; exportAllButton.textContent = "Export All";
exportAllButton.setAttribute("onclick", "exportAll()"); exportAllButton.setAttribute("onclick", "exportAll()");
exportAllButton.setAttribute("style","margin-right:10px;") exportAllButton.setAttribute("style", "margin-right:10px;");
controls.appendChild(exportAllButton); controls.appendChild(exportAllButton);
var exportFileInput = document.createElement("input"); var exportFileInput = document.createElement("input");
var exportFileButton = document.createElement("button"); var exportFileButton = document.createElement("button");
exportFileButton.setAttribute("style","margin-right:10px;") exportFileButton.setAttribute("style", "margin-right:10px;");
exportFileInput.type = "file"; exportFileInput.type = "file";
exportFileInput.setAttribute("id", "exportFile"); exportFileInput.setAttribute("id", "exportFile");
exportFileInput.setAttribute("style", "display:none;"); exportFileInput.setAttribute("style", "display:none;");
@ -100,7 +102,6 @@ function createTranslationControls(container){
controls.appendChild(importFileButton); controls.appendChild(importFileButton);
controls.appendChild(importFileInput); controls.appendChild(importFileInput);
importFileInput.addEventListener("change", onImportFileUpload); importFileInput.addEventListener("change", onImportFileUpload);
} }
function cleanTranslations() { function cleanTranslations() {
@ -122,11 +123,11 @@ function onImportFileUpload(e) {
for (var i = 0; i < lines.length; i++) { for (var i = 0; i < lines.length; i++) {
if (!isCommentLine(lines[i])) { if (!isCommentLine(lines[i])) {
if (followLine) { if (followLine) {
followLine = goesToNextLine(lines[i]); followLine = isNextLineFollow(lines[i]);
var lineValue = lines[i].replace(/\\$/, ""); var lineValue = lines[i].replace(/\\$/, "");
overridenTranslations.set(lineKey, overridenTranslations.get(lineKey) + lineValue); overridenTranslations.set(lineKey, overridenTranslations.get(lineKey) + lineValue);
} else { } else {
followLine = goesToNextLine(lines[i]); followLine = isNextLineFollow(lines[i]);
lineKey = getLineKey(lines[i]); lineKey = getLineKey(lines[i]);
if (lineKey.trim() != "") { if (lineKey.trim() != "") {
let lineValue = getLineValue(lines[i]); let lineValue = getLineValue(lines[i]);
@ -147,7 +148,7 @@ function onExportFileUpload(e) {
const numFiles = fileList.length; const numFiles = fileList.length;
if (numFiles > 0) { if (numFiles > 0) {
const file = fileList[0]; const file = fileList[0];
var fileName = e.target.value.split(/(\\|\/)/g).pop() var fileName = e.target.value.split(/(\\|\/)/g).pop();
var reader = new FileReader(); var reader = new FileReader();
reader.onload = function(progressEvent) { reader.onload = function(progressEvent) {
var lines = this.result.split(/\r\n|\n\r|\n|\r/); var lines = this.result.split(/\r\n|\n\r|\n|\r/);
@ -157,7 +158,7 @@ function onExportFileUpload(e) {
for (var i = 0; i < lines.length; i++) { for (var i = 0; i < lines.length; i++) {
if (!isCommentLine(lines[i])) { if (!isCommentLine(lines[i])) {
if (followLine) { if (followLine) {
followLine = goesToNextLine(lines[i]); followLine = isNextLineFollow(lines[i]);
if (keyLineHasChanged) { if (keyLineHasChanged) {
//clean line as it's upper content has changed //clean line as it's upper content has changed
lines[i] = ""; lines[i] = "";
@ -168,7 +169,7 @@ function onExportFileUpload(e) {
// skip line // skip line
} else { } else {
keyLineHasChanged = false; keyLineHasChanged = false;
followLine = goesToNextLine(lines[i]); followLine = isNextLineFollow(lines[i]);
lineKey = getLineKey(lines[i]); lineKey = getLineKey(lines[i]);
if (overridenTranslations.has(lineKey)) { if (overridenTranslations.has(lineKey)) {
var value = overridenTranslations.get(lineKey); var value = overridenTranslations.get(lineKey);
@ -182,12 +183,11 @@ function onExportFileUpload(e) {
} }
reader.readAsText(file); reader.readAsText(file);
} }
//const selectedFile = document.getElementById('exportFile').files[0];
} }
function exportAll() { function exportAll() {
var date = new Date; var date = new Date;
var fileName = "export_" + date.toLocaleString() + "_all.properties" var fileName = "export_" + date.toLocaleString() + "_all.properties";
var lines = []; var lines = [];
for (let [key, value] of overridenTranslations) { for (let [key, value] of overridenTranslations) {
lines.push(key + " = " + value); lines.push(key + " = " + value);
@ -217,7 +217,7 @@ function getLineValue(line) {
return value; return value;
} }
function goesToNextLine(line) { function isNextLineFollow(line) {
return line.match(/\\(\\\\)*$/) != null; return line.match(/\\(\\\\)*$/) != null;
} }
@ -235,7 +235,7 @@ function createTableFromPageTranslations(container) {
var tr = document.createElement("tr"); var tr = document.createElement("tr");
table.appendChild(tr); table.appendChild(tr);
var td1 = document.createElement("td"); var td1 = document.createElement("td");
td1.setAttribute("style", " width:1%;white-space:nowrap;") td1.setAttribute("style", " width:1%;white-space:nowrap;");
var keyText = document.createTextNode(key); var keyText = document.createTextNode(key);
var td2 = document.createElement("td"); var td2 = document.createElement("td");
var rawText = document.createElement("input"); var rawText = document.createElement("input");
@ -279,14 +279,14 @@ function onTranslationChange(input) {
} }
} }
saveTranslations(); saveTranslations();
if (jsHasChanged(key)) { if (isJSHasChanged(key)) {
location.reload(); location.reload();
} }
updateTranslationOnPage(key, value); updateTranslationOnPage(key, value);
} }
} }
function jsHasChanged(key) { function isJSHasChanged(key) {
var result = false; var result = false;
if (pageTranslations.has(key)) { if (pageTranslations.has(key)) {
var addresses = pageTranslations.get(key).addresses; var addresses = pageTranslations.get(key).addresses;
@ -312,7 +312,7 @@ function updateTranslationOnPage(key, value) {
const regEx = new RegExp("^(?:[^" + resultSepChars + "]*" + regexStr + "){" + number + "}"); const regEx = new RegExp("^(?:[^" + resultSepChars + "]*" + regexStr + "){" + number + "}");
var newString = content.replace(regEx, var newString = content.replace(regEx,
function(x) { function(x) {
return x.replace(RegExp(regexStr + "$"), resultSep + formattedValue + resultSep) return x.replace(RegExp(regexStr + "$"), resultSep + formattedValue + resultSep);
}); });
node.textContent = newString; node.textContent = newString;
} }
@ -320,7 +320,7 @@ function updateTranslationOnPage(key, value) {
function formatTranslation(value, args) { function formatTranslation(value, args) {
for (let i = 0; i < args.length; i++) { for (let i = 0; i < args.length; i++) {
value = value.replaceAll("{" + i + "}", args[i]) value = value.replaceAll("{" + i + "}", args[i]);
} }
return value; return value;
} }
@ -402,7 +402,6 @@ function removePropInfoFromPage() {
var content = node.textContent; var content = node.textContent;
var regexStr = startSep + "[^" + endSep + "]*" + intSep + "([^" + endSep + intSep + "]*)" + endSep; var regexStr = startSep + "[^" + endSep + "]*" + intSep + "([^" + endSep + intSep + "]*)" + endSep;
const regEx = new RegExp(regexStr, "g"); const regEx = new RegExp(regexStr, "g");
//console.log(regexStr);
var newString = content.replaceAll(regEx, resultSep + "$1" + resultSep); var newString = content.replaceAll(regEx, resultSep + "$1" + resultSep);
node.textContent = newString; node.textContent = newString;
} }
@ -414,7 +413,7 @@ function addPropsFromTextNode(node) {
var i = 0; var i = 0;
while (textString.indexOf(startSep) >= 0) { while (textString.indexOf(startSep) >= 0) {
textString = textString.substring(textString.indexOf(startSep) + startSep.length); textString = textString.substring(textString.indexOf(startSep) + startSep.length);
var prop = textString.substring(0, textString.indexOf(endSep)) var prop = textString.substring(0, textString.indexOf(endSep));
var address = new PropAddr(node, i, []); var address = new PropAddr(node, i, []);
addProp(prop, address); addProp(prop, address);
i++; i++;
@ -423,7 +422,7 @@ function addPropsFromTextNode(node) {
function addPropsFromAttribute(node) { function addPropsFromAttribute(node) {
var attrString = node.textContent; var attrString = node.textContent;
var i = 0 var i = 0;
while (attrString.indexOf(startSep) >= 0) { while (attrString.indexOf(startSep) >= 0) {
attrString = attrString.substring(attrString.indexOf(startSep) + startSep.length); attrString = attrString.substring(attrString.indexOf(startSep) + startSep.length);
var prop = attrString.substring(0, attrString.indexOf(endSep)); var prop = attrString.substring(0, attrString.indexOf(endSep));
@ -435,13 +434,13 @@ function addPropsFromAttribute(node) {
function addProp(prop, address) { function addProp(prop, address) {
var key = prop.substring(0, prop.indexOf(intSep)); var key = prop.substring(0, prop.indexOf(intSep));
prop = prop.substring(prop.indexOf(intSep) + intSep.length) prop = prop.substring(prop.indexOf(intSep) + intSep.length);
var rawText = prop.substring(0, prop.indexOf(intSep)); var rawText = prop.substring(0, prop.indexOf(intSep));
prop = prop.substring(prop.indexOf(intSep) + intSep.length) prop = prop.substring(prop.indexOf(intSep) + intSep.length);
var textArgs = []; var textArgs = [];
var i = 0; var i = 0;
while (prop.indexOf(intSep) >= 0) { while (prop.indexOf(intSep) >= 0) {
var textArg = prop.substring(0, prop.indexOf(intSep)) var textArg = prop.substring(0, prop.indexOf(intSep));
prop = prop.substring(prop.indexOf(intSep) + intSep.length); prop = prop.substring(prop.indexOf(intSep) + intSep.length);
textArgs.push(textArg); textArgs.push(textArg);
i++; i++;
@ -451,21 +450,20 @@ function addProp(prop, address) {
var propInfo = null; var propInfo = null;
if (pageTranslations.has(key)) { if (pageTranslations.has(key)) {
propInfo = pageTranslations.get(key); propInfo = pageTranslations.get(key);
//TODO: CHECK ADDRESS BEFORE ADDING ANOTHER ONE
propInfo.addresses.push(address); propInfo.addresses.push(address);
} else { } else {
propInfo = new PropInfo(rawText, formText, address); propInfo = new PropInfo(rawText, formText, address);
pageTranslations.set(key, propInfo) pageTranslations.set(key, propInfo);
} }
return propInfo; return propInfo;
} }
}
window.addEventListener('load', function() { window.addEventListener('load', function() {
setTimeout(function() { setTimeout(function() {
var developerSetting = document.getElementById("developer_i18n_onlineTranslation"); var developerSetting = document.getElementById("developer_i18n_onlineTranslation");
if (developerSetting !== null && developerSetting.checked) { if (developerSetting !== null && developerSetting.checked) {
translationsParsing(); onlineTranslation();
createTranslationsInterface();
} }
}, 1000); }, 1000);
}) })