how to call google.language.translate, multiple times on setOnLoadCallback

101 views
Skip to first unread message

kv

unread,
May 30, 2009, 11:23:12 AM5/30/09
to Google AJAX APIs
I am probably mistaken on the way to use jsapi, but does anybody has a
clue on how to call, (if possible) google.language.translate, multiple
times on setOnLoadCallback ?

for example :
<script type="text/javascript" src="http://www.google.com/jsapi"></
script>
<script type="text/javascript">
google.load("language", "1");

function translate_all(){

var an_array= ...some stuff in a multi-dimensionnal array, ie: Array
(0=>Array(0=>'the text',1=>'the src lang',2=>'the target lang'),
(1=>Array(0=>'the text',...

for(i=0;i<an_array.length;i++){
google.language.translate(an_array[i][0], an_array[i][1],
an_array[i][2],function(result) {
if (!result.error) {
document.write(result.translation); //for instance, or stored in a
string
}
});
}
}
google.setOnLoadCallback(translate_all);
</script>

Thanks a lot

Jeremy Geerdes

unread,
May 30, 2009, 5:04:43 PM5/30/09
to Google-AJAX...@googlegroups.com
If I was going to do this, I would do it something like this:

function translate_all(){
var an_array=[
{
text : "Text 1 to translate",
srcLang : "source_language1",
destLang : "dest_language1"
},
{
text : "Text 2 to translate",
destLang : "dest_language2"
}
];
var myClosure=function(a){
return function(result){
if(result.error){
alert('There was a problem translating "' + a.text + '"');
return
}
a.translation = result.translation;
var div = document.createElement('div');
div.appendChild(document.createTextNode(a.translation));
document.getElementsByTagName('body')[0].appendChild(div);
}
};
for(var i=0; i<an_array.length; i++){
var toTrans = an_array[i];
google.language.translate(toTrans.text, toTrans.srcLang || '',
toTrans.destLang, myClosure(toTrans))
}
}

A couple of things you'll notice about this code:

1. instead of using a multi-dimensional array, I used an array of
objects. It makes it a little easier to keep track of what's what.

2. I implemented a closure so you could keep track of what you're
doing when the translations come back. A closure is essentially a
function that returns a function which will remember where you were
and what you were doing when you created it, so it can pick up at that
point again.

3. Instead of using document.write, I used DOM methods to create a div
element, put the translated string inside it, and add that to the
document. This is essential because, after the onload event fires,
document.write will have unpredictable and almost-always disastrous
effects on your page.

4. When the translation returns, it will be assigned back to the
original object as a translation property, so you'll be able to access
an_array[0].translation.

And that's that. Hope it helps. If you have questions, feel free to
post again.

Jeremy R. Geerdes
Effective website design & development
Des Moines, IA

For more information or a project quote:
http://jgeerdes.home.mchsi.com
http://jgeerdes.blogspot.com
http://jgeerdes.wordpress.com
jgee...@mchsi.com

Unless otherwise noted, any price quotes contained within this
communication are given in US dollars.

If you're in the Des Moines, IA, area, check out Debra Heights
Wesleyan Church!

And check out my blog, Adventures in Web Development, at http://jgeerdes.blogspot.com
!

Kaveh Rassoulzadegan

unread,
May 31, 2009, 12:56:46 AM5/31/09
to Google-AJAX...@googlegroups.com
Dear Jeremy,

first of all, thank you a lot for your time.
Your explanations were very clear.
I saw today another page dealing with the closure, but finally thought it would be faster to solve that with few lines of php. Thanks for your closure implementation anyways.

Instead, I looped the very handy php's 'file_get_contents' function, changing only id, '&q', and '&langpair' from my array, in the urls sent by this function.

The front array is still multi, but I got your oo advice, thanks for that.
In this case, the array is multi because its human-readable clarity was not really an issue. It was the result of preg_matches on a sql query result set, with three capture groups.

It worked really fine but thank you again for writing this because it clarify a lot  language.translate for my possible future uses and may help a lot people wanting to use jsapi.

Don't worry, I hate document.write and this is yet another reason. I heavily use dom methods but between us, I am not that dom-clean(I use also innerhtml and stuff when I don't have time :)

Thank you again for your kind move.

Take care,
Kaveh Rassoulzadegan

Jeremy Geerdes a écrit :

No virus found in this incoming message. Checked by AVG - www.avg.com Version: 8.5.339 / Virus Database: 270.12.46/2143 - Release Date: 05/30/09 05:53:00

Alvin Wong

unread,
Jul 8, 2009, 11:01:35 PM7/8/09
to Google AJAX APIs
I used this in my forum with discuz.

<script type="text/javascript">
var translate=new Object();
translate.ready=false;
translate.queried=new Array();
translate.run=function(text,toLang,onTranslated){
if(toLang=="zh-hk"){
toLang="zh-tw";
}
if(this.ready){
google.language.translate(
text,
"",
toLang,
function(result){
if (result.translation){
onTranslated(result.translation,result);
}
}
);
}else{
return false;
}
};
translate.query=function(text,toLang,onTranslated){
if(toLang=="zh-hk"){
toLang="zh-tw";
}
if(this.ready){
this.run(text,toLang,onTranslated);
}else{
this.queried.push(new Array(text,toLang,onTranslated));
}
};
translate.processQuery=function(){
if(this.ready){
var cur;
while(this.queried.length>0){
cur=this.queried.shift();
this.run(cur[0],cur[1],cur[2]);
}
this.queried=new Array();
return true;
}else{
return false;
}
};
google.load("language", "1");
function translateInit(){
translate.ready=true;
translate.processQuery();
}
google.setOnLoadCallback(translateInit);
</script>

This is fully written by myself.
There is a translate object, where you can do translations like this:

<script type="text/javascript">
function translateForums(toLang){
<?php for($cat in $cats){ ?>
translate.query($('category_<?=$cat[fid]?
>_title').innerHTML,toLang,function(t,r){$('category_<?=$cat[fid]?
>_title').innerHTML=t;});
<php } ?>
}
</script>

<a href="javascript:;" onclick="translateForums('zh-tw');">Translate
to Traditional Chinese!</a>
Reply all
Reply to author
Forward
0 new messages