Когда я разрабатываю системы на Zend Framework, то всегда использую gettext и Zend_Translate. Всё лаконично просто и обычно не возникает никаких проблем с переводом даже больших проектов. Для каждого языка генерируются свои файлы .po и .mo, переводы пляшут от дефолтного языка, ключи тоже на этом же языке. Переводчикам удобно передать эти файлы, которые они могут открыть в POEdit и удобно всё перевести. Так вот, на стороне сервера всё очень просто, но часто нужно переводить какие-то сообщения «на лету» в JavaScript, а он не понимает ваши .mo файлы. Но хотелось бы пользоваться именно ими, чтобы не разделять перевод одного проекта на 2 части (backend, frontend). И я начал искать. В Интернете существует достаточно большое количество таких решений, но все они почему-то обрастают зависимостями:
code.google.com/p/gettext-js/ (Prototype)
angular-gettext.rocketeer.be/ (Angular)
github.com/jakob-stoeck/jquery-gettext (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)
Автор: plutov
