I have no deep idea about the OM translation logic. I know only how to get
the values. I think Maxim can help to get inside out idea.
While that is like that I have succeed in th hack. Now the translation
works fine in this manner. There is a global variable called lang. That is
initialized via query params. Also there are array like ru, en, sp, etc.
which contains text in different languages. All these code lies in
translate.js.
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" :
decodeURIComponent(results[1].replace(/\+/g, " "));
}
var lang=getParameterByName('lang');
var ru =
{
// Tooltips for buttons
"Common tools": "Общие
инструменты",
"Zoom in": "Увеличить",
"Zoom out": "Уменьшить",
"Show coordinates": "Показывать
координаты",
"Clear all": "Очистить все",
"Clear traces": "Очистить следы",
"Show information about selected element": "Информация об
элементе",
"Ruler-and-compass constructions": "Построения
циркулем и линейкой",
"Single point": "Точка",
"Line through two points": "Прямая,
проходящая через две точки",
"Line segment connecting two points": "Отрезок,
соединяющий две точки",
"Circle with radius equals to the given segment": "Окружность с
заданным радиусом",
"Circle with given center": "Окружность с
заданным центром",
"Free hand drawing": "Рисование",
"Insert picture": "Вставить
картинку",
"Change whiteboard background": "Изменить обои",
"Curve": "Кривая линяя",
"Polyline": "Ломаная линия",
"Rectangle": "Прямоугольник",
"Circle": "Окружность",
"Text box": "Текст",
"Highlight board area": "Выделить участок
доски",
"Draw an arrow": "Стрелка",
"Highlight a point at whiteboard": "Отметить точку
на доске",
// Controls at the info dialog
"Click to select other element": "Нажмите для
выбора следующего элемента",
"Hide": "Скрыть",
"Click to hide element": "Нажмите, чтобы
скрыть элемент",
"Trace": "След",
"Color": "Цвет",
"Click to select color": "Нажмите для
выбора цвета",
"JSON code for drawing": "JSON-код для
рисунка",
// Element Labels in the info dialog
"ClipArt does not exist": "Картинка
отсутствует",
"ClipArt from [{$label}]": "Картинка,
источник {$label}",
"Point does not exist": "Точка не
сушествует",
"Point: [{$x},{$y}]": "Точка
[{$x},{$y}]",
"Line does not exist": "Линия не
существует",
"Line [{$fromx},{$fromy}] - [{$tox},{$toy}]": "Линия от
[{$fromx},{$fromy}] до [{$tox},{$toy}]",
"Circle does not exist": "Окружность не
существует",
"Circle [{$x},{$y}] -> {$r}": "Окружность
[{$x},{$y}] -> {$r}",
"Curve does not exists": "Кривая не
существует",
"Rectangle does not exist": "Прямоугольник не
существует",
"Text does not exist": "Текст не
существует",
"Text [{$label}]": "Текст
[{$label}]",
"Underline does not exists": "Выделение не
существует",
"Underline": "Выделение",
"Arrow does not exists": "Стрелка не
существует",
"Arrow": "Стрелка",
"Pointer does not exists": "Указатель не
существует",
"Pointer [{$x},{$y}]": "Указатель
на [{$x},{$y}]",
// Messages
"This browser doesn''t support graphics. Please use another web
browser.":
"Ваш браузер не поддерживает графику. Пожалуйста, используйте
другой браузер"
};
in whiteboard.js we have this getMsg implementation,
goog.getMsg = function(str, opt_values) {
console.log("--------------------------------------");
console.log(goog.LOCALE);
console.log(lang);
var translation = window[lang] || {};
console.log(translation);
console.log("######################################");
str = translation[str] || str;
var values = opt_values || {};
for (var key in values) {
var value = ('' + values[key]).replace(/\$/g, '$$$$');
str = str.replace(new RegExp('\\{\\$' + key + '\\}', 'gi'), value);
}
return str;
};
So we can pass lang via query params and do the dynamic language
translation well. I think this method is OK. WDYT?
Thanks!
On Sun, Sep 22, 2013 at 1:12 AM, Bogdanov Andrey <[email protected]> wrote:
> goog.LOCALE should be set before including of whiteboard.js script, but in
> compiled version "goog" variable is defined inside this script, so LOCALE
> couldn't be set.
> In the current committed versiion I didn't use goog.LOCALE and used
> independent variable current_LOCALE.
> Also I put goog.getMsg inside the script, but left transaltion strings
> outside - this allows to use different transllation files.
>
> Which translation approach is using in other parts of OM project? I think
> whitboard translation should be synchronized with them.
>
> Regards,
> Andrey
>
>
>
> Воскресенье, 22 сентября 2013, 0:58 +05:30 от Andun Sameera <
> [email protected]>:
>
> I did this kind of a hack. I put all this code in to the whiteboard.js.
> Just after the line of 299
> https://github.com/wicketstuff/core/blob/master/jdk-1.6-parent/whiteboard-parent/whiteboard/src/main/resources/org/wicketstuff/whiteboard/resource/whiteboard.js.
> When I did that I see the getMsg function executes each and every time
> which is referred. But the thing is the goog.LOCALE return en instead of
> ru. I put
>
> goog.LOCALE = 'ru';
>
> this code in to the wicket head. But I think it is not set when the getMsg
> is run. I am searching for place to put this initialization which will pick
> up by getMsg. Will this work ?
>
> Thanks!
>
> Inserted code ,
>
> var ru =
> {
> // Tooltips for buttons
> "Common tools": "Общие
> инструменты",
> "Zoom in": "Увеличить",
> "Zoom out": "Уменьшить",
> "Show coordinates": "Показывать
> координаты",
> "Clear all": "Очистить все",
> "Clear traces": "Очистить следы",
> "Show information about selected element": "Информация об
> элементе",
>
> "Ruler-and-compass constructions": "Построения
> циркулем и линейкой",
> "Single point": "Точка",
> "Line through two points": "Прямая,
> проходящая через две точки",
> "Line segment connecting two points": "Отрезок,
> соединяющий две точки",
> "Circle with radius equals to the given segment": "Окружность с
> заданным радиусом",
> "Circle with given center": "Окружность с
> заданным центром",
>
> "Free hand drawing": "Рисование",
> "Insert picture": "Вставить
> картинку",
> "Change whiteboard background": "Изменить обои",
> "Curve": "Кривая линяя",
> "Polyline": "Ломаная линия",
> "Rectangle": "Прямоугольник",
> "Circle": "Окружность",
> "Text box": "Текст",
> "Highlight board area": "Выделить
> участок доски",
> "Draw an arrow": "Стрелка",
> "Highlight a point at whiteboard": "Отметить точку
> на доске",
>
> // Controls at the info dialog
> "Click to select other element": "Нажмите для
> выбора следующего элемента",
> "Hide": "Скрыть",
> "Click to hide element": "Нажмите, чтобы
> скрыть элемент",
> "Trace": "След",
> "Color": "Цвет",
> "Click to select color": "Нажмите для
> выбора цвета",
> "JSON code for drawing": "JSON-код для
> рисунка",
>
> // Element Labels in the info dialog
> "ClipArt does not exist": "Картинка
> отсутствует",
> "ClipArt from [{$label}]": "Картинка,
> источник {$label}",
> "Point does not exist": "Точка не
> сушествует",
> "Point: [{$x},{$y}]": "Точка
> [{$x},{$y}]",
> "Line does not exist": "Линия не
> существует",
> "Line [{$fromx},{$fromy}] - [{$tox},{$toy}]": "Линия от
> [{$fromx},{$fromy}] до [{$tox},{$toy}]",
> "Circle does not exist": "Окружность не
> существует",
> "Circle [{$x},{$y}] -> {$r}": "Окружность
> [{$x},{$y}] -> {$r}",
> "Curve does not exists": "Кривая не
> существует",
> "Rectangle does not exist": "Прямоугольник
> не существует",
> "Text does not exist": "Текст не
> существует",
> "Text [{$label}]": "Текст
> [{$label}]",
> "Underline does not exists": "Выделение не
> существует",
> "Underline": "Выделение",
> "Arrow does not exists": "Стрелка не
> существует",
> "Arrow": "Стрелка",
> "Pointer does not exists": "Указатель не
> существует",
> "Pointer [{$x},{$y}]": "Указатель
> на [{$x},{$y}]",
>
> // Messages
> "This browser doesn''t support graphics. Please use another web
> browser.":
> "Ваш браузер не поддерживает графику. Пожалуйста, используйте
> другой браузер"
> };
>
> goog.getMsg = function(str, opt_values) {
>
> console.log("--------------------------------------");
> console.log(goog.LOCALE);
> var translation = window[goog.LOCALE] || {};
> console.log(translation);
> console.log("######################################");
> str = translation[str] || str;
> var values = opt_values || {};
> for (var key in values) {
> var value = ('' + values[key]).replace(/\$/g, '$$$$');
> str = str.replace(new RegExp('\\{\\$' + key + '\\}', 'gi'), value);
> }
> return str;
> };
>
>
> On Sun, Sep 22, 2013 at 12:48 AM, Bogdanov Andrey
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> > wrote:
>
> Hi Andun,
>
> Unfortunately I didn't find good solution for the issue. I made some hack
> which allows to fix it right now but I think it requires other approach.
> Now you could get the latest version from github and use the next code:
>
> <script>
> current_LOCALE = 'ru';
>
> </script>
> <script src="translate.js"></script>
> <script src="whiteboard.js"></script>
>
>
> It seems goog.getMsg approach works when locale set at "compilation"
> time, but didn't work when locale set in runtime after compilation.
> I will think on the problem and try to find better solution and will be
> gratefull if somebody has any suggestions.
>
> Regards,
> Andrey Bogdanov
>
>
> Суббота, 21 сентября 2013, 22:56 +05:30 от Andun Sameera <
> [email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> >:
>
> Hi Andrey,
>
> I tried to add your translate.js base logic to whiteboard. The thing is
> when I add the dependency to translate.js, it gives following error.
>
> ReferenceError: goog is not defined
> [Break On This Error]
>
> goog.provide('bay.whiteboard.translation');
>
> When I looked at your
> https://github.com/bay73/whiteboard/blob/master/src/index_t.htmlimplementation,
> I found that there is a special dependency to,
>
> <script src="../../closure-library/closure/goog/base.js"></script>
>
> solve the problem. AFAIK in the OM whiteboard code we cant add all these
> Closure dependencies. So what is the resolution to this issue?
>
> Quick help will be highly appropriated since I have to finish this before
> day after tomorrow!
>
> Thanks!
>
>
>
>
>
> On Wed, Sep 18, 2013 at 9:43 PM, Andun Sameera
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> > wrote:
>
> Here is another suggestion which came from Closure forum.
>
> "In Chrome apps and extensions, localization is done at runtime using
> chrome.i18n.getMessage() -- you pass it a message id and Chrome pulls the
> correct translation from the messages.json file for the user's current
> locale. http://developer.chrome.com/apps/i18n.html has all the details.
>
> I assume you're not writing a Chrome extension, but I bring it up because
> we added pass to the JS compiler, which is activated by the
> --replace_messages_with_
> chrome_i18n flag, to replace goog.getMsg() calls with
> chrome.i18n.getMessage() calls. You could probably hack together another
> compiler pass to do something similar, along the lines of what Ilia Mirkin
> suggested, if you were in the mood to hack on the Closure Compiler. I'm not
> sure if there are any good "How to write a new pass for the Closure
> Compiler" tutorials around, but hopefully you can find one or just follow
> the example of the existing ones."
>
> I am looking in to feasible solution! Comment needed to find a good
> approach!
>
> Thanks!
>
>
>
> On Fri, Sep 6, 2013 at 11:56 AM, Andun Sameera
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> > wrote:
>
> I got your point! We can add these kind of arrays to add many languages.
> But in OM we are using files to give the localized words like this. Using
> keys to load values,
>
> <input type="submit" value="" wicket:id="ajax-cancel-button"
> wicket:ommessage="title:157" />
>
> I think Maxim can give me a clue to load suitable values from those file
> to this javascript arrays(
> https://github.com/bay73/whiteboard/blob/master/src/translate.js)!
>
> Thanks!
>
>
> On Fri, Sep 6, 2013 at 11:43 AM, Bogdanov Andrey
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> > wrote:
>
> Yes, you are righ - documentation about this topic is very poor.
>
> Now I've made some translation to Russian - you could see translate.js
> script which I've commited to the https://github.com/bay73/whiteboard.git.
> This is simple dictionary - any language could be added there.
>
> Now I could set locale like this:
>
> <script>
> goog.LOCALE = 'ru';
> </script>
> <script src="translate.js"></script>
> <script src="whiteboard.js"></script>
>
> Regards,
> Andrey Bogdanov
>
>
> Пятница, 6 сентября 2013, 0:49 +05:30 от Andun Sameera
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> >:
>
> I tried to find some material related to localization. But finding help
> for Closure is a tough task. Cant we use a normal Javascript way to handle
> run-time change of languages?
>
>
> On Thu, Sep 5, 2013 at 6:19 PM, Bogdanov Andrey
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> > wrote:
>
> Hi Andun,
>
> I've push a version which allows to clear background.
> You could call board.setBackground() or board.setBackground('') - it
> will work
>
> Also I've surrounded all nessages with goog.getMsg call, so we could add
> internationalization.
>
> Regards,
> Andrey
>
>
>
>
> Среда, 4 сентября 2013, 22:51 +05:30 от Andun Sameera
> <[email protected]<https://e.mail.ru/sentmsg?mailto=mailto%[email protected]>
> >:
>
> I have re-factored the code and committed. Also I have added undo for
> DOC
> addition, page navigation. Also there is another small problem which Andrey
> can answer me. How can we go to a empty background from? I tired to set a
> "" as the url. But didn't work.
>
> Thanks!
>
>
>
>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
>
>
> --
> Андрей Богданов
>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
>
>
> --
> Андрей Богданов
>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
>
>
> --
> Андрей Богданов
>
--
Regards
Andun S.L. Gunawardana
Undergraduate
Department of Computer Science And Engineering
University of Moratuwa
Sri Lanka
Blog - http://www.insightforfuture.blogspot.com/
LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
Twitter -http://twitter.com/AndunSLG
