<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Country name in Japanese"
             description="Are you sure you know how to pronouce your country's name or other country names in Japanese. To me, it's very difficult. So, I created this gadget to practice. Will you practice with me? You can configure to answer quiz with kana, kanji, or English mode. Enjoy!"
             author="タオ　チューン"
             author_affiliation="www.hoctiengnhat.blogspot.com"
             author_email="dachimoto@gmail.com"
             screenshot="http://lh5.ggpht.com/_WtIQNw9hvGI/STjGEQSjBlI/AAAAAAAADUw/0cwu6GND7p8/s800/CountryNameInJa.JPG"
             thumbnail="http://lh5.ggpht.com/_WtIQNw9hvGI/STjGEQSjBlI/AAAAAAAADUw/0cwu6GND7p8/s800/CountryNameInJa.JPG" 
             height="300" 
             width="300"  
             > 

<Require feature="idi"/>
<Require feature="locked-domain" />
<Require feature="dynamic-height"/>
<Require feature="analytics"/>
</ModulePrefs>
<UserPref name="Src" display_name="Source" default_value="Kana" datatype="enum">
    <EnumValue value="Kana"/>
    <EnumValue value="Kanji"/>
    <EnumValue value="English"/>
</UserPref>
<UserPref name="Dest" display_name="Destination" default_value="English" datatype="enum">
    <EnumValue value="Kana"/>
    <EnumValue value="Kanji"/>
    <EnumValue value="English"/>
</UserPref>
<Content type="html"><![CDATA[
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://languagexyz.appspot.com/Docs/TrackClick.js" type="text/javascript"></script>
<script>
   var iRandomNumber = -1;    
   var iRandom = new Array();
   var data = null;
</script>       
<div id="tablediv" style="overflow: auto;">
<!--//background-image: url(http://lh3.ggpht.com/_WtIQNw9hvGI/STi8IuKICEI/AAAAAAAADUg/J_J5rV3orDM/s144/TheWorld.JPG)-->
<img src="http://www.google.com/ig/images/spinner.gif" />
</div>
<br/>
<style type="text/css">
td.goin { background-color: green; color: blue; }
td.goout { background-color: #FFFFFF; color: #000000; }
</style>  
<div id="ad" onclick="trackclick();">

</div>
<script type="text/javascript">
var adCtl = _gel('ad');
if (clickCount > 2){
   adCtl.style.display = "none";
}
else{
   adCtl.style.display = "block";  
}
</script>
<script>
  _IG_Analytics("UA-6049274-3", "/CountryNameInJa");
</script>
<div id="meaningDiv"></div>
<script>
var gadgetHelper = null;
_IG_RegisterOnloadHandler(loadVisualizationAPI);
function loadVisualizationAPI() { 
  google.load("visualization", "1");
  google.setOnLoadCallback(sendQuery);
}

function sendQuery() {
// Replace data source URL on next line with your data source URL
//gadgetHelper = new google.visualization.GadgetHelper();
// var query = new google.visualization.Query('http://spreadsheets.google.com/tq?key=pwK3vnJuANg-ID6o58S_HSA&range=A1:E3&gid=0&pub=1');
for (i=0;i<10;i++){
  iRandom[i] = Math.round(Math.random()*182);
  //alert(iRandom[i]);
}
iRandomNumber = Math.round(Math.random()*9);
var query = new google.visualization.Query('http://spreadsheets.google.com/tq?key=pwK3vnJuANg-OyzYyWpwfQw&range=A1:D182&gid=0&pub=1');
var strSQL = 'select A,B,C,D where A = 0 ';
for (i=0;i<10;i++){
  strSQL += ' OR A = ' + iRandom[i].toString();
}
query.setQuery(strSQL);
query.send(handleQueryResponse); // Send the query with a callback function
}
 

function handleQueryResponse(response) {
  // if (!gadgetHelper.validateResponse(response)) {
// return; // Default error handling was done, just leave.
// }

if (response.isError()) {
return;
}
data = response.getDataTable();
var html = []; // start the HTML output stringhtml.push('');
/*** Process all Rows in the specified range*/
var prefs = new _IG_Prefs(__MODULE_ID__);
var Src = prefs.getString("Src");
var Dest = prefs.getString("Dest");  
var SrcName = "";

if (Src == "Kana"){
 SrcName = data.getFormattedValue(iRandomNumber, 2);
}
else if (Src == "Kanji"){
 SrcName = data.getFormattedValue(iRandomNumber, 1);
}
else if (Src == "English"){
 SrcName = data.getFormattedValue(iRandomNumber, 3);
}
//html.push('<br/><br/>');
html.push('<span style="color:red; font-size:30pt; font-weight:bold;">');
html.push(SrcName);
html.push('</span>');
//html.push('<a href="#" onclick="sendQuery()">&#x65B0;&#x8A00;&#x8449;</a><br/>');
//html.push('<table width="100%" border="0">');
//html.push('<tr>');
//html.push('<td valign="top" width="100px">');
//html.push('<img src="http://lh3.ggpht.com/_WtIQNw9hvGI/STi8IuKICEI/AAAAAAAADUg/J_J5rV3orDM/s144/TheWorld.JPG" width="100px"></img>');
//html.push('</td>');
//html.push('<td width="100%">');
html.push('<table width="100%" border="0" background="http://lh3.ggpht.com/_WtIQNw9hvGI/STi8IuKICEI/AAAAAAAADUg/J_J5rV3orDM/s144/TheWorld.JPG">');
var m = 0;
var DestName = "";
while (m<10){
html.push('<tr>');
var strTmp = "";
if (Dest == "Kana"){
  DestName = data.getFormattedValue(m,2);
}
else if (Dest == "Kanji"){
  DestName = data.getFormattedValue(m, 1);
}
else if (Dest == "English"){
  DestName = data.getFormattedValue(m, 3);
}
strTmp = DestName;
html.push('<td onmouseover="className=\'goin\';" onmouseout="className=\'goout\';" onClick="CheckAnswer(' + m + ',' + iRandomNumber + ')" width="50%" id='+m+'><input name="multichoices" onClick="CheckAnswer(' + m + ',' + iRandomNumber + ')" type="radio" value="' + iRandom[m] + '">' + strTmp + '</input></td>');
  
if (Dest == "Kana"){
  DestName = data.getFormattedValue(m+1,2);
}
else if (Dest == "Kanji"){
  DestName = data.getFormattedValue(m+1, 1);
}
else if (Dest == "English"){
  DestName = data.getFormattedValue(m+1, 3);
}
strTmp = DestName;
html.push('<td onmouseover="className=\'goin\';" onmouseout="className=\'goout\';" onClick="CheckAnswer(' + (m+1) + ',' + iRandomNumber + ')" width="50%" id='+(m+1)+'><input name="multichoices" onClick="CheckAnswer(' + (m+1) + ',' + iRandomNumber + ')" type="radio" value="' + (m+1) + '">' + strTmp + '</input></td>');
html.push('</tr>');
m = m + 2;
}
html.push('</table>');
//html.push('</td>');
//html.push('</tr>');
//html.push('</table>');
//html.push('<a href="http://www.hoctiengnhat.blogspot.com" target="_blank">&#x65E5;&#x672C;&#x8A9E;&#x3092;&#x52C9;&#x5F37;&#x3057;&#x307E;&#x3057;&#x3087;&#x3046;</a>');
html.push('\n');
html.push('<font style="background:yellow">Correct</font>');
html.push(' <font style="background:red">Wrong</font><br/>');
html.push('<a href="#" onclick="sendQuery()"><strong><font size="2" color ="blue">New country</font></strong></a>');
html.push(' <a href="#" onclick="CheckAnswer(' + iRandomNumber + ',' + iRandomNumber + ')"><strong><font size="2" color="blue">Answer</font></strong></a>');
html.push(' <a href="http://languages.services.officelive.com" target="_blank"><strong><font size="2" color ="blue">More gadgets...</font></strong></a>');
var tableDiv = _gel('tablediv');
tableDiv.innerHTML = html.join('');
var meaningDiv = _gel('meaningDiv');
meaningDiv.innerHTML = "";

  _IG_AdjustIFrameHeight();
}

function escapeHtml(text) {
  if (text == null) {
    return '';
  }
  return _hesc(text);
} 

function CheckAnswer(iChecked, iAnswer){
var element;
element = _gel(iChecked);
var meaningDiv = _gel('meaningDiv');
if (iChecked==iAnswer){
//alert('Correct!');
element.style.backgroundColor = 'yellow';
}
else{
//alert('Wrong. Try again!');
element.style.backgroundColor = 'red';
}
//alert(data.getFormattedValue(iChecked, 3));
meaningDiv.innerHTML = "<strong>Selected country: <i>" + data.getFormattedValue(iChecked, 3) + "</i></strong><br/>" +
                      "<strong>Kanji: </strong><i>" + data.getFormattedValue(iChecked, 1) + "</i><br/>" +
                      "<strong>Kana: </strong><i>" + data.getFormattedValue(iChecked, 2) + "</i>";
  _IG_AdjustIFrameHeight();
}  
</script>
]]>
</Content>
</Module>










































