var menu1="ㄅㄚ"+
"ㄅㄞ"+
"ㄅㄤ"+
"ㄅㄠ"+
"ㄅㄟ"+
"ㄅㄣ"+
"ㄅㄥ"+
"ㄅ一"+
"ㄅㄛ"+
"ㄅㄨ";
var menu2="ㄆㄚ"+
"ㄆㄞ"+
"ㄆㄢ"+
"ㄆㄤ"+
"ㄆㄠ"+
"ㄆㄟ"+
"ㄆㄣ"+
"ㄆㄥ"+
"ㄆ一"+
"ㄆㄛ"+
"ㄆㄡ"+ "ㄆㄨ";
var menu3="ㄇㄚ"+
"ㄇㄞ"+
"ㄇㄢ"+
"ㄇㄤ"+
"ㄇㄠ"+
"ㄇㄜ"+
"ㄇㄟ"+
"ㄇㄣ"+
"ㄇㄥ"+
"ㄇ一"+
"ㄇㄛ"+
"ㄇㄡ"+ "ㄇㄨ";
var menu4="ㄈㄚ"+
"ㄈㄢ"+
"ㄈㄤ"+
"ㄈㄟ"+
"ㄈㄣ"+
"ㄈㄥ"+
"ㄈㄛ"+
"ㄈㄡ"+ "ㄈㄨ";
var menu5="ㄉㄚ"+
"ㄉㄞ"+
"ㄉㄢ"+
"ㄉㄤ"+
"ㄉㄠ"+
"ㄉㄜ"+
"ㄉㄟ"+
"ㄉㄥ"+
"ㄉ一"+
"ㄉㄡ"+
"ㄉㄨ";
var menu6="ㄊㄚ"+
"ㄊㄞ"+
"ㄊㄢ"+
"ㄊㄤ"+
"ㄊㄠ"+
"ㄊㄜ"+
"ㄊㄥ"+
"ㄊ一"+
"ㄊㄡ"+
"ㄊㄨ";
var menu7="ㄋㄚ"+
"ㄋㄞ"+
"ㄋㄢ"+
"ㄋㄤ"+
"ㄋㄠ"+
"ㄋㄜ"+
"ㄋㄟ"+
"ㄋㄣ"+
"ㄋㄥ"+
"ㄋ一"+
"ㄋㄨ"+
"ㄋㄡ"+ "ㄋㄩ";
var menu8="ㄌㄚ"+
"ㄌㄞ"+
"ㄌㄢ"+
"ㄌㄤ"+
"ㄌㄠ"+
"ㄌㄜ"+
"ㄌㄟ"+
"ㄌㄥ"+
"ㄌ一"+
"ㄌㄡ"+ "ㄌㄨ"+
"ㄌㄩ";
var menu9="ㄍㄚ"+
"ㄍㄞ"+
"ㄍㄢ"+
"ㄍㄤ"+
"ㄍㄠ"+
"ㄍㄜ"+
"ㄍㄟ"+
"ㄍㄣ"+
"ㄍㄥ"+
"ㄍㄡ"+ "ㄍㄨ";
var menu10="ㄎㄚ"+
"ㄎㄞ"+
"ㄎㄢ"+
"ㄎㄤ"+
"ㄎㄠ"+
"ㄎㄜ"+
"ㄎㄣ"+
"ㄎㄥ"+
"ㄎㄡ"+ "ㄎㄨ";
var menu11="ㄏㄚ"+
"ㄏㄞ"+
"ㄏㄢ"+
"ㄏㄤ"+
"ㄏㄠ"+
"ㄏㄜ"+
"ㄏㄟ"+
"ㄏㄣ"+
"ㄏㄥ"+
"ㄏㄡ"+ "ㄏㄨ";
var menu12="ㄐ一"+
"ㄐㄩ";
var menu13="ㄑ一"+
"ㄑㄩ";
var menu14="ㄒ一"+
"ㄒㄩ";
var menu15="ㄓㄚ"+
"ㄓㄞ"+
"ㄓㄢ"+
"ㄓㄤ"+
"ㄓㄠ"+
"ㄓㄜ"+
"ㄓㄟ"+
"ㄓㄣ"+
"ㄓㄥ"+
"ㄓㄡ"+ "ㄓㄨ";
var menu16="ㄔㄚ"+
"ㄔㄞ"+
"ㄔㄢ"+
"ㄔㄤ"+
"ㄔㄠ"+
"ㄔㄜ"+
"ㄔㄣ"+
"ㄔㄥ"+
"ㄔㄡ"+ "ㄔㄨ";
var menu17="ㄕㄚ"+
"ㄕㄞ"+
"ㄕㄢ"+
"ㄕㄤ"+
"ㄕㄠ"+
"ㄕㄜ"+
"ㄕㄟ"+
"ㄕㄣ"+
"ㄕㄥ"+
"ㄕㄡ"+ "ㄕㄨ";
var menu18="ㄖㄢ"+
"ㄖㄤ"+
"ㄖㄠ"+
"ㄖㄜ"+
"ㄖㄣ"+
"ㄖㄥ"+
"ㄖㄡ"+ "ㄖㄨ";
var menu19="ㄗㄚ"+
"ㄗㄞ"+
"ㄗㄢ"+
"ㄗㄤ"+
"ㄗㄠ"+
"ㄗㄜ"+
"ㄗㄟ"+
"ㄗㄣ"+
"ㄗㄥ"+
"ㄗㄡ"+ "ㄗㄨ";
var menu20="ㄘㄚ"+
"ㄘㄞ"+
"ㄘㄢ"+
"ㄘㄤ"+
"ㄘㄠ"+
"ㄘㄜ"+
"ㄘㄣ"+
"ㄘㄥ"+
"ㄘㄡ"+ "ㄘㄨ";
var menu21="ㄙㄚ"+
"ㄙㄞ"+
"ㄙㄢ"+
"ㄙㄤ"+
"ㄙㄠ"+
"ㄙㄜ"+
"ㄙㄣ"+
"ㄙㄥ"+
"ㄙㄡ"+ "ㄙㄨ";
var menu22="一ㄚ"+
"一ㄞ"+
"一ㄢ"+
"一ㄤ"+
"一ㄠ"+
"一ㄝ"+
"一ㄣ"+
"一ㄥ"+
"一ㄡ";
var menu23="ㄨㄚ"+
"ㄨㄞ"+
"ㄨㄢ"+
"ㄨㄤ"+
"ㄨㄟ"+
"ㄨㄣ"+
"ㄨㄥ"+
"ㄨㄛ";
var menu24="ㄩㄥ"+
"ㄩㄢ"+
"ㄩㄝ"+
"ㄩㄣ";
var Zhuyin = {};
Zhuyin.step1 = function () {
var divBodyStep1 =document.getElementById("step2");
while (divBodyStep1.firstChild) { divBodyStep1.removeChild(divBodyStep1.firstChild); }
divBodyStep1.appendChild(document.createTextNode("Step 1. Map Zhuyin to Pinyin and Wade-Giles. Click on a Zhuyin symbol fom the above."));
var divBox= document.createElement("div");
divBox.id="divmenu";
divBox.className="indexBox";
divBox.style.visibility="hidden";
document.body.appendChild(divBox);
};
Zhuyin.drawIndex = function (menulist,index1,y) {
var divSymbol = document.getElementById("divmenu");
divSymbol.style.visibility="visible";
var oNode = document.getElementById(index1);
divSymbol.innerHTML=menulist;
divSymbol.onmouseover= function(){
Zhuyin.clearhide();
}
divSymbol.onmouseout= function(){
sethide= setTimeout("Zhuyin.hide()", 300);
}
var xp = 0;
while(oNode.tagName != "BODY") {
xp += oNode.offsetLeft;
oNode = oNode.offsetParent;
}
divSymbol.style.left = xp + "px";
divSymbol.style.top = y + "px";
};
Zhuyin.clearhide =function (){
if (window.sethide){ clearTimeout(sethide);}
}
Zhuyin.hide =function(){
var divBox = document.getElementById("divmenu");
divBox.style.visibility="hidden";
}
Zhuyin.position = function (e, divBox) {
var x = e.clientX;
var y = e.clientY;
if (document.documentElement && document.documentElement.scrollTop){
x = e.clientX + document.documentElement.scrollLeft;
y = e.clientY + document.documentElement.scrollTop;
}
else if (document.body)
{
x = e.clientX + document.body.scrollLeft;
y = e.clientY + document.body.scrollTop;
}
divBox.style.left = x + "px";
divBox.style.top = y + "px";
};
Zhuyin.req = function (zhuyin_unicode) {
var oHttp = zXmlHttp.createRequest();
//cancel any active requests
if (oHttp.readyState != 0) {
oHttp.abort();
}
var oData = {
agent: "cozywebsite",
code: zhuyin_unicode
};
oHttp.open("post", "/include/suggestzhuyin.php", true);
oHttp.onreadystatechange = function () {
if (oHttp.readyState == 4) {
var aResult = JSON.parse(oHttp.responseText);
Zhuyin.format(aResult['zhuyin'],aResult['pinyin'],aResult['wade']);
}
};
oHttp.send(JSON.stringify(oData));
setTimeout("Zhuyin.hide()", 250);
};
Zhuyin.getword = function (stext) {
alert(stext);
};
Zhuyin.format = function (zhuyin,pinyin,wade) {
var FragMenu1 = document.createDocumentFragment();
oMenuTitle = document.createElement("div");
oMenuTitle.className = "menuheader";
tZhuyin=document.createElement("div");
tPinyin = document.createElement("div");
tWade = document.createElement("div");
tZhuyin.className = "menutitle";
tPinyin.className = "menutitle";
tWade.className = "menutitle";
tZhuyin.appendChild(document.createTextNode("ZhuYin"));
tPinyin.appendChild(document.createTextNode("PinYin"));
tWade.appendChild(document.createTextNode("Wade"));
oMenuTitle.appendChild(tZhuyin);
oMenuTitle.appendChild(tPinyin);
oMenuTitle.appendChild(tWade);
FragMenu1.appendChild(oMenuTitle);
for (var i=0; i < zhuyin.length; i++) {
oDiv = document.createElement("div");
oDiv.className = "menurow";
sZhuyin = document.createElement("span");
sPinyin = document.createElement("span");
sWade = document.createElement("span");
sZhuyin.className = "menu_left";
sPinyin.className = "menu_middle";
sWade.className = "menu_right";
sZhuyin.innerHTML=zhuyin[i];
sPinyin.innerHTML=pinyin[i];
sWade.innerHTML=wade[i];
oDiv.appendChild(sZhuyin);
oDiv.appendChild(sPinyin);
oDiv.appendChild(sWade);
oDiv.onmouseover=this.showbackcolor;
oDiv.onmouseout=this.hidebackcolor;
oDiv.onclick=this.findwords;
FragMenu1.appendChild(oDiv);
}
var divBodyPane =document.getElementById("menu1");
while (divBodyPane.firstChild) { divBodyPane.removeChild(divBodyPane.firstChild); }
divBodyPane.appendChild(FragMenu1);
var divBodyList =document.getElementById("list1");
while (divBodyList.firstChild) { divBodyList.removeChild(divBodyList.firstChild); }
var divBodyStep2 =document.getElementById("step2");
while (divBodyStep2.firstChild) { divBodyStep2.removeChild(divBodyStep2.firstChild); }
divBodyStep2.style.backgroundColor="A3A3FF";
divBodyStep2.style.color="FFE60D";
divBodyStep2.appendChild(document.createTextNode("Step 2. Select a row from the left panel below to find associated words and phrases."));
};
Zhuyin.showbackcolor=function(){
this.className = "menurow_over";
};
Zhuyin.hidebackcolor=function(){
this.className = "menurow";
};
Zhuyin.findwords = function () {
var bopomo=this.childNodes[0].innerHTML;
var divBodyPane =document.getElementById("list1");
while (divBodyPane.firstChild) { divBodyPane.removeChild(divBodyPane.firstChild); }
divBodyPane.appendChild(document.createTextNode("Loading data associated with "+bopomo+"..."));
var oHttp = zXmlHttp.createRequest();
//cancel any active requests
if (oHttp.readyState != 0) {
oHttp.abort();
}
var oData = {
agent: "cozywebsite",
code: bopomo
};
oHttp.open("post", "/include/findzhuyinwords.php", true);
oHttp.onreadystatechange = function () {
if (oHttp.readyState == 4) {
var aResult = JSON.parse(oHttp.responseText);
Zhuyin.showresult(bopomo,aResult['pinyin'],aResult['traditional'],aResult['simplified'],aResult['english'],aResult['pinyin_num']);
}
};
oHttp.send(JSON.stringify(oData));
};
Zhuyin.showresult = function (bopomo,pinyin,traditional,simplified,english,pinyin_num) {
pinyin_num=pinyin_num.replace(":","-");
var sAudio= document.createElement("span");
var strAudio=" ";
sAudio.innerHTML=strAudio;
var FragMenu1 = document.createDocumentFragment();
oDivHeader = document.createElement("div");
oDivHeader.className = "resultheader";
sZhuyin_h = document.createElement("span");
sZhuyin_h.appendChild(document.createTextNode("Result for "+bopomo));
sZhuyin_h.appendChild(sAudio);
oDivHeader.appendChild(sZhuyin_h);
FragMenu1.appendChild(oDivHeader);
//Row Title
oDivTitle = document.createElement("div");
oDivTitle.className = "resulttitle";
tPinyin=document.createElement("div");
tTrad = document.createElement("div");
tSimp = document.createElement("div");
tPinyin.className = "titlepinyin";
tTrad.className = "titletrad";
tSimp.className = "titlesimplified";
tPinyin.appendChild(document.createTextNode("Pinyin"));
tTrad.appendChild(document.createTextNode("FanTi"));
tSimp.appendChild(document.createTextNode("JianTi"));
oDivTitle.appendChild(tPinyin);
oDivTitle.appendChild(tTrad);
oDivTitle.appendChild(tSimp);
FragMenu1.appendChild(oDivTitle);
if(pinyin.length==0){
oDivBody = document.createElement("div");
oDivBody.className = "resultrow2";
oDivBody.appendChild(document.createTextNode("No Result"));
FragMenu1.appendChild( oDivBody);
}
for (var i=0; i < pinyin.length; i++) {
oDiv = document.createElement("div");
if(i%2){
oDiv.className = "resultrow";
}else{
oDiv.className = "resultrow2";
}
sPinyin=document.createElement("div");
sTrad = document.createElement("div");
sSimp = document.createElement("div");
sPinyin.className = "resultpinyin";
sTrad.className = "resulttrad";
sSimp.className = "resultsimplified";
sPinyin.innerHTML=pinyin[i];
sTrad.innerHTML=traditional[i];
sSimp.innerHTML=simplified[i];
oDiv.appendChild(sPinyin);
oDiv.appendChild(sTrad);
oDiv.appendChild(sSimp);
oDiv.title=english[i];
FragMenu1.appendChild(oDiv);
}
var divBodyPane =document.getElementById("list1");
while (divBodyPane.firstChild) { divBodyPane.removeChild(divBodyPane.firstChild); }
divBodyPane.appendChild(FragMenu1);
var divBodyStep3 =document.getElementById("step2");
while (divBodyStep3.firstChild) { divBodyStep3.removeChild(divBodyStep3.firstChild); }
divBodyStep3.innerHTML="Step 3. Place mouse over a result row for English annotation.";
};