JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://unpkg.com/i18next/i18next.js"></script>
<div style="height: 350px">
<span>Enter a language code:</span>
<input value="en-US" onkeyup="handleLanguageChange(this.value)"/>
<hr />
<div>
<span>Optional choose a i18next json version:</span>
<select onchange="handleVersionChange(this.value)">
<option selected value="v3">json v3</option>
<option value="v2">json v2</option>
<option value="v1">json v1</option>
</select>
</div>
<hr />
<div>
<h4>Language</h4>
<p id="languageName"></p>
<h4>Suffixes</h4>
<p id="suffixes"></p>
<h4>Sampling counts</h4>
<ul id="probes"></ul>
<hr />
<h3>Try out counts to get needed suffix</h3>
<input placeholder="enter a number" onkeyup="handleTryout(this.value)"/><span id="result" style="margin-left: 20px"></span>
</div>
</div>
JavaScript
// import i18next from 'i18next';
i18next.init();
let version = 'v3';
const handleVersionChange = (v) => {console.warn(v)
version = v;
updateInfo();
}
window.handleVersionChange = handleVersionChange;
let lng = 'en-US';
const handleLanguageChange = (l) => {
lng = l;
updateInfo();
}
window.handleLanguageChange = handleLanguageChange;
const updateInfo = () => {
detectName(lng);
detectSuffixes(lng, version);
probe(lng, version);
}
const detectName = (l) => {
const code = i18next.services.languageUtils.getLanguagePartFromCode(l);
const found = names[code];
const fullName = found ? found.name : 'unknown';
const nativeName = found ? found.nativeName: 'unknown';
setText('languageName', `${code} -> ${fullName} (native: ${nativeName})`);
}
const detectSuffixes = (lng, version) => {
const rule = i18next.services.pluralResolver.getRule(lng)
let suffixes = !rule ? 'unknown' : rule.numbers.length === 2 ? 'key, key_plural' : rule.numbers.reduce(function(red, n, i) {
if (version === 'v3') {
if (rule.numbers.length === 1) return 'key_0';
var res = red + 'key_' + i;
if (i < rule.numbers.length - 1) res = res + ', ';
return res;
} else if (version === 'v2') {
if (rule.numbers.length === 1) return 'key';
var res = red + 'key_' + rule.numbers[i];
if (i < rule.numbers.length - 1) res = res + ', ';
return res;
} else {
var res = red;
var nr = rule.numbers[i];
if (nr === 1) {
res = res + 'key';
} else {
res = res + 'key_plural_' + rule.numbers[i];
}
if (i < rule.numbers.length - 1) res = res + ', ';
return res;
}
}, '');
setText('suffixes', suffixes || 'unknown');
}
const probe = (lng, version) => {
const res = {};
function getSuffix(count) {
...