Quick localization test
by Admiral Potato
HTML
<h1 data-loc="animals.pageTitle"></h1>
<h2 data-loc="animals.headline"></h2>
<ul>
<li><a data-loc="animals.buttons.remove title">-</a></li>
<li><a data-loc="animals.buttons.add title">+</a></li>
<li><a data-loc="animals.buttons.approve title">*</a></li>
</ul>
<ul>
<li data-loc="animals.cat"></li>
<li data-loc="animals.dog"></li>
<li data-loc="animals.fish"></li>
</ul>
<p>
<span data-loc="animals.count"></span>
<span>3</span>
</p>
JavaScript
var localize = function(lang){
$('[data-loc]').each(function(index, item){
console.log(arguments);
var address = $(item).data('loc'),
split = address.split(' '),
destination = 'innerText';
if(split.length > 1){
address = split[0];
destination = split[1];
}
if(langs[lang].hasOwnProperty(address)){
item[destination] = langs[lang][address];
} else {
throw 'lang:'+ lang +' has no key: '+ address +'!';
}
});
};
var langs = {
"en": {
"animals.pageTitle": "Page about Animals",
"animals.headline": "Animals",
"animals.buttons.remove": "Remove",
"animals.buttons.add": "Add",
"animals.buttons.approve": "Approve",
"animals.cat": "Cat",
"animals.dog": "Dog",
"animals.fish": "Fish",
"animals.count": "Number of Animals",
},
"fr": {
"animals.pageTitle": "Le Page about Animals",
"animals.headline": "Le Animals",
"animals.buttons.remove": "Le Remove",
"animals.buttons.add": "Le Add",
"animals.buttons.approve": "Le Approve",
"animals.cat": "Le Cat",
"animals.dog": "Le Dog",
"animals.fish": "Le Fish",
"animals.count": "Le Number of Animals",
}
};
localize('fr');