138 lines
3.6 KiB
JavaScript
138 lines
3.6 KiB
JavaScript
var re_num = /^[.\d]+$/;
|
|
|
|
var original_lines = {};
|
|
var translated_lines = {};
|
|
|
|
function hasLocalization() {
|
|
return window.localization && Object.keys(window.localization).length > 0;
|
|
}
|
|
|
|
function textNodesUnder(el) {
|
|
var n, a = [], walk = document.createTreeWalker(el, NodeFilter.SHOW_TEXT, null, false);
|
|
while ((n = walk.nextNode())) a.push(n);
|
|
return a;
|
|
}
|
|
|
|
function canBeTranslated(node, text) {
|
|
if (!text) return false;
|
|
if (!node.parentElement) return false;
|
|
var parentType = node.parentElement.nodeName;
|
|
if (parentType == 'SCRIPT' || parentType == 'STYLE' || parentType == 'TEXTAREA') return false;
|
|
if (re_num.test(text)) return false;
|
|
return true;
|
|
}
|
|
|
|
function getTranslation(text) {
|
|
if (!text) return undefined;
|
|
|
|
if (translated_lines[text] === undefined) {
|
|
original_lines[text] = 1;
|
|
}
|
|
|
|
var tl = localization[text];
|
|
if (tl !== undefined) {
|
|
translated_lines[tl] = 1;
|
|
}
|
|
|
|
return tl;
|
|
}
|
|
|
|
function processTextNode(node) {
|
|
var text = node.textContent.trim();
|
|
|
|
if (!canBeTranslated(node, text)) return;
|
|
|
|
var tl = getTranslation(text);
|
|
if (tl !== undefined) {
|
|
node.textContent = tl;
|
|
}
|
|
}
|
|
|
|
function processNode(node) {
|
|
if (node.nodeType == 3) {
|
|
processTextNode(node);
|
|
return;
|
|
}
|
|
|
|
if (node.title) {
|
|
let tl = getTranslation(node.title);
|
|
if (tl !== undefined) {
|
|
node.title = tl;
|
|
}
|
|
}
|
|
|
|
if (node.placeholder) {
|
|
let tl = getTranslation(node.placeholder);
|
|
if (tl !== undefined) {
|
|
node.placeholder = tl;
|
|
}
|
|
}
|
|
|
|
textNodesUnder(node).forEach(function(node) {
|
|
processTextNode(node);
|
|
});
|
|
}
|
|
|
|
function localizeWholePage() {
|
|
processNode(gradioApp());
|
|
|
|
function elem(comp) {
|
|
var elem_id = comp.props.elem_id ? comp.props.elem_id : "component-" + comp.id;
|
|
return gradioApp().getElementById(elem_id);
|
|
}
|
|
|
|
for (var comp of window.gradio_config.components) {
|
|
if (comp.props.webui_tooltip) {
|
|
let e = elem(comp);
|
|
|
|
let tl = e ? getTranslation(e.title) : undefined;
|
|
if (tl !== undefined) {
|
|
e.title = tl;
|
|
}
|
|
}
|
|
if (comp.props.placeholder) {
|
|
let e = elem(comp);
|
|
let textbox = e ? e.querySelector('[placeholder]') : null;
|
|
|
|
let tl = textbox ? getTranslation(textbox.placeholder) : undefined;
|
|
if (tl !== undefined) {
|
|
textbox.placeholder = tl;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
if (!hasLocalization()) {
|
|
return;
|
|
}
|
|
|
|
onUiUpdate(function(m) {
|
|
m.forEach(function(mutation) {
|
|
mutation.addedNodes.forEach(function(node) {
|
|
processNode(node);
|
|
});
|
|
});
|
|
});
|
|
|
|
localizeWholePage();
|
|
|
|
if (localization.rtl) { // if the language is from right to left,
|
|
(new MutationObserver((mutations, observer) => { // wait for the style to load
|
|
mutations.forEach(mutation => {
|
|
mutation.addedNodes.forEach(node => {
|
|
if (node.tagName === 'STYLE') {
|
|
observer.disconnect();
|
|
|
|
for (const x of node.sheet.rules) { // find all rtl media rules
|
|
if (Array.from(x.media || []).includes('rtl')) {
|
|
x.media.appendMedium('all'); // enable them
|
|
}
|
|
}
|
|
}
|
|
});
|
|
});
|
|
})).observe(gradioApp(), {childList: true});
|
|
}
|
|
});
|