]>
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 placeholder">
10 // <span data-translate-title title="Example title"></span>
12 // Obtain all the phrases to be translated via js debug console:
14 // Translate.phrasesAsJson();
16 // Use that template to translate the phrases into another language.
17 // Leave the key the same. Change the value to the new language.
19 // Create a js file to load the new phrases. In this example for Spanish,
20 // es.js will contain the following code:
22 // Translate.loadForeignPhrases("es", {
23 // "Test": "Test in Spanish",
24 // "<em>keep em tag</em>": "<em>keep em tag in Spanish</em>",
25 // "Example placeholder": "Example placeholder in Spanish"
26 // "Example title": "Example title in Spanish"
29 // In your UI put a listener for clicking on the Spanish button:
31 // mySpanishButton.addEventListener("click", function() {
32 // Translate.setLanguage("es");
34 // myEnglishButton.addEventListener("click", function() {
35 // Translate.setLanguage("en");
38 Translate
= new (function() {
40 var defaultLanguage
= "en";
43 allPhrases
[defaultLanguage
] = {};
48 selector: "[data-translate]",
50 return this.textContent
.trim().replace(/\s+/g, " ");
52 setPhrase: function(p
) {
58 selector: "[data-translate-html]",
60 return this.innerHTML
.trim().replace(/\s+/g, " ");
62 setPhrase: function(p
) {
68 selector: "[data-translate-placeholder]",
70 return this.getAttribute("placeholder").trim().replace(/\s+/g, " ");
72 setPhrase: function(p
) {
73 this.setAttribute("placeholder", p
);
78 selector: "[data-translate-title]",
80 return this.getAttribute("title").trim().replace(/\s+/g, " ");
82 setPhrase: function(p
) {
83 this.setAttribute("title", p
);
87 // Get elements to be translated
88 var allEls
= getEls(text
)
90 .concat(getEls(placeholder
))
91 .concat(getEls(title
));
93 // Provides access to phrases from a non-default language.
94 // See phrases_en.js for example usage.
95 this.loadForeignPhrases = function(language
, phrases
) {
96 allPhrases
[language
] = phrases
;
99 // Displays a different language, eg "en" or "fr"
100 this.setLanguage = function(language
) {
101 for (var i
=0; i
<allEls
.length
; i
++) {
104 if (!(language
in allPhrases
)) {
105 console
.log(language
+ " not in allPhrases");
108 if (!(key
in allPhrases
[language
])) {
109 console
.log(language
+ " does not contain phrase: " + key
);
112 var phrase
= allPhrases
[language
][key
];
113 el
.setPhrase(phrase
);
117 // Converts the phrases to a key-pair json file.
118 // This is a good way to export phrases for use in translation tools.
119 this.phrasesAsJson = function(language
) {
121 for (var i
=0; i
<allEls
.length
; i
++) {
128 for (var i
=0; i
<keys
.length
; i
++) {
131 if (language
in allPhrases
&& key
in allPhrases
[language
]) {
132 translated
= allPhrases
[language
][key
];
134 output
[key
] = translated
;
136 return JSON
.stringify(output
, null, 2);
139 function getEls(nodeType
) {
140 var nodes
= document
.querySelectorAll(nodeType
.selector
);
142 for (var i
=0; i
<nodes
.length
; i
++) {
144 node
.getKey
= nodeType
.getKey
;
145 node
.setPhrase
= nodeType
.setPhrase
;
146 node
.key
= node
.getKey();
147 allPhrases
[defaultLanguage
][node
.key
] = node
.key
;