]>
git.immae.eu Git - perso/Immae/Projets/Cryptomonnaies/BIP39.git/blob - src/js/translate.js
1 // An extremely basic translation library
5 // Set some html to be translated. Do this using the 'data-translate' attribute:
7 // <div data-translate>Test</div>
8 // <div data-translate-html><em>keep em tag</em></div>
9 // <input data-translate-placeholder placeholder="Example text">
11 // Obtain all the phrases to be translated via js debug console:
13 // Translate.phrasesAsJson();
15 // Use that template to translate the phrases into another language.
16 // Leave the key the same. Change the value to the new language.
18 // Create a js file to load the new phrases. In this example for Spanish,
19 // es.js will contain the following code:
21 // Translate.loadForeignPhrases("es", {
22 // "Test": "Test in Spanish",
23 // "<em>keep em tag</em>": "<em>keep em tag in Spanish</em>",
24 // "Example text": "Example text in Spanish"
27 // In your UI put a listener for clicking on the Spanish button:
29 // mySpanishButton.addEventListener("click", function() {
30 // Translate.setLanguage("es");
32 // myEnglishButton.addEventListener("click", function() {
33 // Translate.setLanguage("en");
36 Translate
= new (function() {
38 var defaultLanguage
= "en";
41 allPhrases
[defaultLanguage
] = {};
46 selector: "[data-translate]",
48 return this.textContent
.trim().replace(/\s+/g, " ");
50 setPhrase: function(p
) {
56 selector: "[data-translate-html]",
58 return this.innerHTML
.trim().replace(/\s+/g, " ");
60 setPhrase: function(p
) {
66 selector: "[data-translate-placeholder]",
68 return this.getAttribute("placeholder").trim().replace(/\s+/g, " ");
70 setPhrase: function(p
) {
71 this.setAttribute("placeholder", p
);
75 // Get elements to be translated
76 var allEls
= getEls(text
)
78 .concat(getEls(placeholder
));
80 // Provides access to phrases from a non-default language.
81 // See phrases_en.js for example usage.
82 this.loadForeignPhrases = function(language
, phrases
) {
83 allPhrases
[language
] = phrases
;
86 // Displays a different language, eg "en" or "fr"
87 this.setLanguage = function(language
) {
88 for (var i
=0; i
<allEls
.length
; i
++) {
91 if (!(language
in allPhrases
)) {
92 console
.log(language
+ " not in allPhrases");
95 if (!(key
in allPhrases
[language
])) {
96 console
.log(language
+ " does not contain phrase: " + key
);
99 var phrase
= allPhrases
[language
][key
];
100 el
.setPhrase(phrase
);
104 // Converts the phrases to a key-pair json file.
105 // This is a good way to export phrases for use in translation tools.
106 this.phrasesAsJson = function(language
) {
108 for (var i
=0; i
<allEls
.length
; i
++) {
115 for (var i
=0; i
<keys
.length
; i
++) {
118 if (language
in allPhrases
&& key
in allPhrases
[language
]) {
119 translated
= allPhrases
[language
][key
];
121 output
[key
] = translated
;
123 return JSON
.stringify(output
, null, 2);
126 function getEls(nodeType
) {
127 var nodes
= document
.querySelectorAll(nodeType
.selector
);
129 for (var i
=0; i
<nodes
.length
; i
++) {
131 node
.getKey
= nodeType
.getKey
;
132 node
.setPhrase
= nodeType
.setPhrase
;
133 node
.key
= node
.getKey();
134 allPhrases
[defaultLanguage
][node
.key
] = node
.key
;