po.js — супер простая утилита для i18n

Когда я разрабатываю системы на Zend Framework, то всегда использую gettext и Zend_Translate. Всё лаконично просто и обычно не возникает никаких проблем с переводом даже больших проектов. Для каждого языка генерируются свои файлы .po и .mo, переводы пляшут от дефолтного языка, ключи тоже на этом же языке. Переводчикам удобно передать эти файлы, которые они могут открыть в POEdit и удобно всё перевести. Так вот, на стороне сервера всё очень просто, но часто нужно переводить какие-то сообщения «на лету» в JavaScript, а он не понимает ваши .mo файлы. Но хотелось бы пользоваться именно ими, чтобы не разделять перевод одного проекта на 2 части (backend, frontend). И я начал искать. В Интернете существует достаточно большое количество таких решений, но все они почему-то обрастают зависимостями:

http://ift.tt/1oMfgws (Prototype)

angular-gettext.rocketeer.be/ (Angular)

http://ift.tt/1oMfjIy (jQuery)

А хотелось иметь именно «pure-js» решение. Ок, напишем своё.



Первым делом я искал, как же в JS прочитать PO-файлы. Можно парсить, но это лишняя нагрузка, поэтому я решил не насиловать JavaScript и отдавать ему уже готовый JSON. Поэтому первое, что нам предстоит сделать, -это сконвертировать PO в JSON. Советую воспользоваться этим конвертером.

Далее алгоритм простой, сохраняем себе на сервер JSON-файл, а передаем ссылку на него в pojs. Конечно, подключив перед этим po.min.js на страницу.

<script src="po.min.js"></script>
<script>
    pojs.init('/ru.json');
</script>

Если текущий язык дефолтный, то не нужно передавать ссылку на JSON.

Все переводы возвращаются после вызова функции с передачей в нее ключа. Если ключ не найден, то будет возвращен сам ключ.

pojs._('Hello world');

Также в po.js присутствует еще одна супер-мини фича, немного похожая на sprintf.

pojs._('My name is %s, and I am %s years old', ['Sasha', 24]);

Если JSON не закэширован, то он будет получен асинхронно, а это значит, что мы не сможем использовать pojs._() сразу же после инициализации. Оберните код, где используются переводы:

pojs.ready(function() {
    pojs._('Hello world');
});

Стоит отметить какие-то плюсы po.js, иначе не было бы смысла всё это делать:

1. Нано-размер: ~0.7KB

2. Не нуждается в сторонних зависимостях, таких как jQuery, Prototype, Angular …

3. JSON кэшируется в localStorage. Поэтому будьте осторожны, если у вас очень большие файлы переводов. Сбросить кэш можно просто добавив "?1" к ссылке на JSON-файл (да, вот такой old school)

po.js на GitHub

This entry passed through the Full-Text RSS service — if this is your content and you're reading it on someone else's site, please read the FAQ at http://ift.tt/jcXqJW.