<html>
<head>
<title>Country Languages Auto-completion Ajax Primer Tutorial</title>

<style>
body, #myCountrySearchField {
font: 1.2em verdana, arial, helvetica, sans-serif;
}

.mysuggestions {
background-color: #ffffff;
padding: 2px 6px;
border: 1px solid #000000;
}

.mysuggestions:hover {
background-color: #69F69F;
}

#mypopups {
position: absolute;
}

.myCountrySearchField.myerror {
background-color: #FFCFFC;
}

</style>

<script type="text/javascript">
window.onload = initAll;

var lc_CC='';
var prefix='';
var bitsbetween="";
var bhuh="~";

var myxhr = false;
var myCountriesArray = new Array();
var myCodesArray = new Array();
var cis = "";
var xmlDoc=loadXMLDoc("languages.xml");
var myThisLanguageCode = "";
var myThisLanguage = "";


function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
}

function populatelccc() {
lc_CC=document.getElementById('sellccc').innerHTML;
}

function initAll() {
setTimeout(populatelccc, 2000);
if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) {
bitsbetween="m/translate";
bhuh="|";
}
document.getElementById("myCountrySearchField").onkeyup = searchHelpout;


if (window.XMLHttpRequest) {
myxhr = new window.XMLHttpRequest;
}
else {
try {
myxhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
myxhr = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
myxhr = false;
}
}
}

if (myxhr) {
//console.log("prehere");

myxhr.onreadystatechange = setCountriesArray;
myxhr.open("GET", "countries_attributed.xml", true);
myxhr.send(null);
} else {
alert("Not able to create XMLHttpRequest ... sadly.");
}
}

function setCountriesArray() {
if (myxhr.readyState == 4) {
if (myxhr.status == 200) {
//console.log("here");
if (myxhr.responseXML) {
var myAllCountries = myxhr.responseXML.getElementsByTagName("country");
for (var myi=0; myi<myAllCountries.length; myi++) {
//console.log("ahere");
//console.log("yeshere at " + myAllCountries[myi].getAttribute("name"));
if (1 == 1) {
myCountriesArray[myi] = myAllCountries[myi].getAttribute("name");
myCodesArray[myi] = myAllCountries[myi].getAttribute("code");
} else {
myCountriesArray[myi] = myAllCountries[myi].getElementsByTagName("name")[0].firstChild;
myCodesArray[myi] = myAllCountries[myi].getElementsByTagName("code")[0].firstChild;
}
}
}
} else {
//console.log("Problem: " + myxhr.status);
alert("Problem: " + myxhr.status);
}
}
}

function searchHelpout() {
var xfound=false; // new ideas from May, 2015 here
var pdelim='';
var smtc = "", mtc = "";
var mystr = document.getElementById("myCountrySearchField").value;
var myThisCode = "";
myThisLanguageCode = "";
myThisLanguage = "";
var mySpareThisLanguageCode = "";
var mySpareThisLanguage = "";
document.getElementById("myCountrySearchField").className = "";
if (mystr != "") {
prefix='';
document.getElementById("mypopups").innerHTML = "";
for (var myi=0; myi<myCountriesArray.length; myi++) {
//console.log(myCountriesArray[myi]);
var myThisCountry = myCountriesArray[myi]; //.nodeValue;

if (myThisCountry.toLowerCase().indexOf(mystr.toLowerCase()) == 0) {
myThisCode = myCodesArray[myi];
mtc = myThisCountry;
var myTempDiv = document.createElement("div");
myTempDiv.title = myCodesArray[myi];
myTempDiv.innerHTML = myThisCountry;
myTempDiv.onclick = makeSelection;
myTempDiv.className = "mysuggestions";
document.getElementById("mypopups").appendChild(myTempDiv);
}

}
var myFoundCt = document.getElementById("mypopups").childNodes.length;
if (myFoundCt == 0) {
document.getElementById("myCountrySearchField").className = "myerror";
}
if (myFoundCt == 1) {
document.getElementById("myCountrySearchField").value = document.getElementById("mypopups").firstChild.innerHTML;
cis = document.getElementById("mypopups").firstChild.innerHTML;
//alert("cis=" + cis);
document.getElementById("mypopups").innerHTML = "";

//var xmlDoc=loadXMLDoc("languages.xml");

var myAllLanguages = xmlDoc.getElementsByTagName("language");
for (var myj=0; myj<myAllLanguages.length; myj++) {
//console.log(myAllLanguages[myj].getAttribute("code").toLowerCase() + " vs " + myThisCode.toLowerCase());
if (myAllLanguages[myj].getAttribute("code").toLowerCase().indexOf(myThisCode.toLowerCase()) == 0) {
myThisLanguageCode = myAllLanguages[myj].getAttribute("code");
myThisLanguage = myAllLanguages[myj].getAttribute("name");
}
if (myAllLanguages[myj].getAttribute("name").toLowerCase().indexOf(myThisCode.toLowerCase()) == 0) {
mySpareThisLanguageCode = myAllLanguages[myj].getAttribute("code");
mySpareThisLanguage = myAllLanguages[myj].getAttribute("name");
if (1 == 4) xfound=true;
} //else { // new ideas from May, 2015 here
//document.title=prefix + myAllLanguages[myj].getAttribute("name").toLowerCase() + "/" + myAllLanguages[myj].getAttribute("code").toLowerCase() + " not with " + myThisCode.toLowerCase();
//}
}

smtc = myThisCode;
if (1 == 1 && !xfound && prefix == '' && lc_CC != '' && mtc != '') { // new ideas from May, 2015 here
//document.title=myTempDiv.title;
//prefix=mtc; //'Y ';
if (lc_CC != '') {
//prefix='Q ';
if (lc_CC.indexOf('"' + mtc + '"') != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split('"' + mtc + '"');
for (xiprefs=1; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].substring(1).split("_");
if (xendofs[0].length == 2 && prefix.indexOf(xendofs[0]) == -1) {
prefix = prefix + pdelim + xendofs[0].replace("zh", "zh-CN,zh-TW");
myThisLanguageCode=""; //xendofs[0];
mySpareThisLanguageCode = ""; //
}
pdelim=',';
}
} else if (lc_CC.indexOf('"' + mtc + ' ') != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split('"' + mtc + '"');
for (xiprefs=1; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].substring(1).split("_");
if (xendofs[0].length == 2 && prefix.indexOf(xendofs[0]) == -1) {
prefix = prefix + pdelim + xendofs[0].replace("zh", "zh-CN,zh-TW");
myThisLanguageCode=""; //xendofs[0];
mySpareThisLanguageCode = ""; //
}
pdelim=',';
}
}
}
//document.title=prefix;
if (prefix != '') xfound=true;
}
if (!xfound && prefix == '' && lc_CC != '' && smtc != '') { // new ideas from May, 2015 here
//document.title=myTempDiv.title;
//prefix='Y ';
if (lc_CC != '') {
//prefix='Q ';
if (lc_CC.indexOf("_" + smtc + "<") != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split("_" + smtc + "<");
for (xiprefs=0; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].split(">");
if (xendofs[xendofs.length - 1].length == 2 && prefix.indexOf(xendofs[xendofs.length - 1]) == -1) prefix = prefix + pdelim + xendofs[xendofs.length - 1].replace("zh", "zh-CN,zh-TW");
pdelim=',';
}
}
}
//document.title=mtc;
}

if (myThisLanguageCode == "" && mySpareThisLanguageCode != "") {
myThisLanguageCode = mySpareThisLanguageCode;
myThisLanguage = mySpareThisLanguage;
}

if (myThisLanguageCode != "" && prefix.indexOf(myThisLanguageCode) == -1) {
prefix=prefix + pdelim + myThisLanguageCode;
}

if (myThisLanguageCode != "" && 1 == 2) {
window.open("http://translate.google.com/" + bitsbetween + "#en|" + myThisLanguageCode + "|Hello%20from%20Sydney%20in%20Australia.".replace(bhuh,"/").replace(bhuh,"/"), myThisLanguageCode, "left=500,top=10,width=800,height=380");
myThisLanguageCode = "";
myThisLanguage = "";
}

}
}
}

function makeSelection(evt) {
var xfound=false; // new ideas from May, 2015 here
var pdelim='';
var smtc = "", mtc = "";
var myThisCode = "";
myThisLanguageCode = "";
myThisLanguage = "";
var mySpareThisLanguageCode = "";
var mySpareThisLanguage = "";
if (evt) {
var myThisDiv = evt.target;
} else {
var myThisDiv = window.event.srcElement;
}
document.getElementById("myCountrySearchField").value = myThisDiv.innerHTML;
myThisCode = myThisDiv.title;
cis = myThisDiv.innerHTML;
//alert("Cis=" + cis);
document.getElementById("mypopups").innerHTML = "";

//var xmlDoc=loadXMLDoc("languages.xml");

var myAllLanguages = xmlDoc.getElementsByTagName("language");
for (var myj=0; myj<myAllLanguages.length; myj++) {
//console.log("2: " + myAllLanguages[myj].getAttribute("code").toLowerCase() + " vs " + myThisCode.toLowerCase());
if (myAllLanguages[myj].getAttribute("code").toLowerCase().indexOf(myThisCode.toLowerCase()) == 0) {
myThisLanguageCode = myAllLanguages[myj].getAttribute("code");
myThisLanguage = myAllLanguages[myj].getAttribute("name");
}
if (myAllLanguages[myj].getAttribute("name").toLowerCase().indexOf(myThisCode.toLowerCase()) == 0) {
mySpareThisLanguageCode = myAllLanguages[myj].getAttribute("code");
mySpareThisLanguage = myAllLanguages[myj].getAttribute("name");
}
}

smtc = myThisCode;
if (1 == 1 && !xfound && prefix == '' && lc_CC != '' && mtc != '') { // new ideas from May, 2015 here
//document.title=myTempDiv.title;
//prefix=mtc; //'Y ';
if (lc_CC != '') {
//prefix='Q ';
if (lc_CC.indexOf('"' + mtc + '"') != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split('"' + mtc + '"');
for (xiprefs=1; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].substring(1).split("_");
if (xendofs[0].length == 2 && prefix.indexOf(xendofs[0]) == -1) {
prefix = prefix + pdelim + xendofs[0].replace("zh", "zh-CN,zh-TW");
myThisLanguageCode=""; //xendofs[0];
mySpareThisLanguageCode = ""; //
}
pdelim=',';
}
} else if (lc_CC.indexOf('"' + mtc + ' ') != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split('"' + mtc + '"');
for (xiprefs=1; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].substring(1).split("_");
if (xendofs[0].length == 2 && prefix.indexOf(xendofs[0]) == -1) {
prefix = prefix + pdelim + xendofs[0].replace("zh", "zh-CN,zh-TW");
myThisLanguageCode=""; //xendofs[0];
mySpareThisLanguageCode = ""; //
}
pdelim=',';
}
}
}
//document.title=prefix;
if (prefix != '') xfound=true;
}
if (!xfound && prefix == '' && lc_CC != '' && smtc != '') { // new ideas from May, 2015 here
//document.title=myTempDiv.title;
//prefix='Y ';
if (lc_CC != '') {
//prefix='Q ';
if (lc_CC.indexOf("_" + smtc + "<") != -1) {
var xiprefs, xendofs, xprefs=lc_CC.split("_" + smtc + "<");
for (xiprefs=0; xiprefs<xprefs.length; xiprefs++) {
xendofs=xprefs[xiprefs].split(">");
if (xendofs[xendofs.length - 1].length == 2 && prefix.indexOf(xendofs[xendofs.length - 1]) == -1) prefix = prefix + pdelim + xendofs[xendofs.length - 1].replace("zh", "zh-CN,zh-TW");
pdelim=',';
}
}
}
//document.title=mtc;
}

if (myThisLanguageCode == "" && mySpareThisLanguageCode != "") {
myThisLanguageCode = mySpareThisLanguageCode;
myThisLanguage = mySpareThisLanguage;
}

if (myThisLanguageCode != "" && prefix.indexOf(myThisLanguageCode) == -1) {
prefix=prefix + pdelim + myThisLanguageCode;
}

if (myThisLanguageCode != "" && 1 == 2) {
window.open("https://translate.google.com/" + bitsbetween + "#en|" + myThisLanguageCode + "|Hello%20from%20Sydney%20in%20Australia.".replace(bhuh,"/").replace(bhuh,"/"), myThisLanguageCode, "left=500,top=10,width=800,height=360");
myThisLanguageCode = "";
myThisLanguage = "";
}

gbit();
}


function gbit() {
if (document.getElementById("myCountrySearchField").value != "" && cis != "") {
//document.getElementById("mygi").style.display = "block";
//alert("https://maps.google.com/maps?q=" + cis + '&hl=en&hnear=' + cis + '&t=m&z=5');
window.open("https://maps.google.com/maps?q=" + cis, cis, "left=10,top=230,width=1300,height=470"); //,'mygi');
cis = "";
if (myThisLanguageCode != "" && prefix == '') {
window.open("https://translate.google.com/" + bitsbetween + "#en|" + myThisLanguageCode + "|Hello%20from%20Sydney%20in%20Australia.".replace(bhuh,"/").replace(bhuh,"/"), myThisLanguageCode, "left=500,top=10,width=800,height=360");
if (("," + prefix + ",").indexOf("," + myThisLanguageCode + ",") != -1) {
prefix=prefix.replace(myThisLanguageCode, "");
}
myThisLanguageCode = "";
myThisLanguage = "";
}
if (prefix.replace(/,/g,'') != '') {
var imylangs, mylangs=prefix.split(",");
for (imylangs=0; imylangs<mylangs.length; imylangs++) {
if (mylangs[imylangs] != '') window.open("https://translate.google.com/" + bitsbetween + "#en|" + mylangs[imylangs] + "|Hello%20from%20Sydney%20in%20Australia.".replace(bhuh,"/").replace(bhuh,"/"), mylangs[imylangs], "left=500,top=" + eval((imylangs + 1) * 2) + "10,width=800,height=360");
}
}
myThisLanguageCode = "";
myThisLanguage = "";
} else {
document.getElementById("mygi").style.display = "none";
}
prefix='';
}

</script>

</head>
<body>
<form action="#">
Please enter your country name: <input type="text" name="myCountrySearchField" id="myCountrySearchField" autocomplete="off" onblur="gbit();" /><br>
<div id="mypopups"> </div>
<br><iframe id='mygi' src='javascript:false;' style='display:none;width:100%;height:550px;'></iframe>
</form>
<select id='sellccc' style='display:none;'></select>
<iframe id='mylccc' src='lc_CC.php' style='display:none;width:100%;height:550px;'></iframe>
</body>
</html>