var tkn;
/* AJAX Functions */
function errorHandler(message) {
  $("DivProgress").style.display = "none";
  disableForm("FrmMain", false);
  alert(message);
}
try {
  dwr.engine.setErrorHandler(errorHandler);
} catch (e) { /* ignore */ }
function translateComplete(result){
  var selTxt1 = dwr.util.getText("SelSrcLang");
  var selTxt2 = dwr.util.getText("SelTrgLang");
  var selVal2 = dwr.util.getValue("SelTrgLang");
  $("LblTrans").innerHTML = "Translation (" + selTxt2 + "):";
  $("LblOrig").innerHTML = "Original (" + selTxt1 + "):";
  if ($("DivResults").style.display == "none") fxShow("DivResults");
  $("TxtTrans").style.textAlign = "";
  if (selVal2 == "AR") $("TxtTrans").style.textAlign = "right"; 
  $("TxtTrans").value = result;
  $("DivProgress").style.display = "none";
  disableForm("FrmMain", false);
  if (typeof transliteration != "undefined" && transliteration) {
    if (selTxt1.indexOf("Ja") > -1)
      ServiceApi.translate(tkn, "JA", "TRANSLITERATION", dwr.util.getValue("TxtOrig"), setTransliterated);
    else if (selVal2.indexOf("JA") > -1)
      ServiceApi.translate(tkn, "JA", "TRANSLITERATION", result, setTransliterated);
  }
}

function trackChars(element, updateElement,maxValue) {
  var count = element.value.length;
  if (count == maxValue) {
      alert("Max value reached");
    }
  var span = document.getElementById(updateElement);
  while(span.firstChild) {
    span.removeChild(span.firstChild);
  }
  span.appendChild(document.createTextNode(count));
}
      
function translateWithDetectionComplete(result){
  var selTxt1 = dwr.util.getText("SelSrcLang");
  var selTxt2 = dwr.util.getText("SelTrgLang");
  var selVal2 = dwr.util.getValue("SelTrgLang");
  var detectSrcLang = result[0];
  var resultText = result[1];
  $("LblTrans").innerHTML = "Translation (" + selTxt2 + "):";
  $("LblOrig").innerHTML = "Original (" + detectSrcLang + "):";
  if ($("DivResults").style.display == "none") fxShow("DivResults");
  $("TxtTrans").style.textAlign = "";
  if (selVal2 == "AR") $("TxtTrans").style.textAlign = "right";
  $("TxtTrans").value = resultText;
  $("DivProgress").style.display = "none";
  disableForm("FrmMain", false);
  if (typeof transliteration != "undefined" && transliteration) {
    if (detectSrcLang.indexOf("Ja") > -1 || selTxt1.indexOf("Ja") > -1)
      ServiceApi.translate(tkn, "JA", "TRANSLITERATION", dwr.util.getValue("TxtOrig"), setTransliterated);
    else if (selVal2.indexOf("JA") > -1)
      ServiceApi.translate(tkn, "JA", "TRANSLITERATION", resultText, setTransliterated);
  }
}

function setTransliterated(result) {
  var selVal1 = dwr.util.getValue("SelSrcLang");
  var selVal2 = dwr.util.getValue("SelTrgLang");
  var divtext;
  if (selVal1.indexOf("JA") > -1)
    divText = document.getElementById("OrigBottom");
  else if (selVal2.indexOf("JA") > -1)
    divText = document.getElementById("TransBottom");
  else {
    if (selVal1.indexOf("auto") > -1)
      divText = document.getElementById("OrigBottom");
  }
  if (divText.tagName == 'DIV') {
    divText.innerHTML = result;
    divText.style.display = 'block';
  }
}

function doTranslate(token) {
  var theForm = $("FrmMain");
  if (!validate(theForm)) return false;
  var selVal1 = dwr.util.getValue("SelSrcLang");
  var selVal2 = dwr.util.getValue("SelTrgLang");
  var text = dwr.util.getValue("TxtOrig");
  disableForm("FrmMain", true);
  $("DivProgress").style.display = "";
  if (typeof transliteration != "undefined" && transliteration) {
    document.getElementById('OrigBottom').innerHTML = "";
    document.getElementById('TransBottom').innerHTML = "";
    tkn = token;
  }
  if (selVal1 == "auto") {
    var res = ServiceApi.translateWithDetection(token, selVal1, selVal2, text, translateWithDetectionComplete);
  } else {
    var res = ServiceApi.translate(token, selVal1, selVal2, text, translateComplete);
  }
  return false;  
}

function doTranslateInfo(token) {
  var theForm = $("FrmMain");
  if (!validate(theForm)) return false;
  var selVal1 = dwr.util.getValue("SelSrcLang");
  var selVal2 = dwr.util.getValue("SelTrgLang");
  var text = dwr.util.getValue("TxtOrig");
  var info = dwr.util.getValue("wl_info");
  disableForm("FrmMain", true);
  $("DivProgress").style.display = "";
  var res = ServiceApi.translateInfo(token, selVal1, selVal2, text, info, translateComplete);
  return false;
}

function doLanguageDetect(token) {
  var text = dwr.util.getValue("TxtOrig");
  var res = ServiceApi.languageDetect(token, text, languageDetected);
  return false;
}

function languageDetected(result){
  if (result == null) {
    result = "EN";
  }
  dwr.util.setValue("SelSrcLang", result.toUpperCase());
}

/* Effects Functions */
function getDimensions(element) {
  var pos = !/Safari|KHTML/.test(navigator.userAgent);
  var els = element.style;
  if (els.display != "none")
    return {width: element.clientWidth, height: element.clientHeight};
  var originalVisibility = els.visibility;
  var originalPosition = els.position;
  els.visibility = "hidden";
  if (pos) els.position = "absolute";
  els.display = "";
  var originalWidth = element.clientWidth;
  var originalHeight = element.clientHeight;
  els.display = "none";
  if (pos) els.position = originalPosition;
  els.visibility = originalVisibility;
  return {width: originalWidth, height: originalHeight};
}
function fxShow(id){
  if (id == "DivResults"){
     var ele = $(id);
     var d = getDimensions(ele);
     ele.style.display = "";
     jQ('.ui-wrapper').children('textarea').css('width','100%');
     jQ('.ui-wrapper').children('textarea').css('height','90px');
     jQ('.ui-wrapper').css('width','100%');
     jQ('.ui-wrapper').css('height','90px');
   }
  else {
  var ele = $(id);
  var d = getDimensions(ele);
  ele.style.height = "0px";
  ele.style.display = "";
  fxEle = new Fx.Styles(id)
  fxEle.custom({"opacity":[0,1], "height":[0,d.height]});
  }
}
function switchDirection() {
  // using jQ as the jQuery($) symbol
  var target = jQ('#DivResults');
  var source = jQ('#DivOrig');
  var txtOrig = jQ('#TxtOrig');
  var txtTrans = jQ('#TxtTrans');
  var timer = 500; // in milliseconds
  jQ('.ui-wrapper').children('textarea').css('height', '100px');
  jQ('.ui-wrapper').children('textarea').css('width', '100%');
  jQ('.ui-wrapper').css('height', '100px');
  jQ('.ui-wrapper').css('width', '100%');
  if ( jQ(source).index() > jQ(target).index() ) {
    // source comes after target, make it before
    jQ(source).insertBefore(jQ(target));
    // side-to-side
    source.animate({
      width:"47%",
      opacity: "0"
    }, timer, function(){
      source.css('float', 'left');
      txtOrig.resizable({maxWidth: 425 });
      source.animate({
        opacity: "1",
        marginBottom: "10px"
      }, timer);
    });
    target.animate({
      width:"47%",
      opacity: "0"
    }, timer, function(){
      target.css('float', 'right');
      txtTrans.resizable({maxWidth: 425 });
      target.animate({
        opacity: "1",
        marginBottom: "10px"
      });
    });
  } else {
    // target comes after source, make it before
    jQ(target).insertBefore(jQ(source));
    // top/bottom, reset floats
    source.animate({
      width:"0",
      opacity: "0",
      marginBottom: "25px"
    }, timer, function(){
      source.css('float', 'none');
      txtOrig.resizable({maxWidth: 900 });
      source.animate({
        opacity: "1",
        width: "100%"
      }, timer);
    });
    target.animate({
      width:"0",
      opacity: "0",
      marginBottom: "0px"
    }, timer, function(){
      target.css('float', 'none');
      txtTrans.resizable({maxWidth: 900 });
      target.animate({
        opacity: "1",
        width: "100%"
      }, timer);
    });
  }
}
function fxHide(id){ 
  var ele = $(id);
  var d = getDimensions(ele);
  var fxEle = new Fx.Styles(id, { onComplete: function() { ele.style.display = "none"; ele.style.height = d.height + "px"; }});
  fxEle.custom({"opacity":[1,0], "height":[d.height,0]});
}
function fxFadeOut(id) {
  var ele = $(id);
  new Fx.Style(ele, "opacity").custom(1,0);
}
function showhide(id){ 
  if ($(id).style.display == "none") fxShow(id); else fxHide(id); 
}
function setBtnDisabled(id, state) {
  var n = 1;
  var e = $(id + n++);
  while (e) {
    e.disabled = state;
    e = $(id + n++);
  }
}

/* Form Functions */ 
function validate(theForm) {
  var selIndex1 = theForm["wl_srclang"].selectedIndex;
  var selIndex2 = theForm["wl_trglang"].selectedIndex;
  var selVal1 = theForm["wl_srclang"].options[selIndex1].value;
  var selVal2 = theForm["wl_trglang"].options[selIndex2].value;
  if (selVal1 == "") {
    alert("Select a source language.");
    theForm["wl_srclang"].focus();
    return false;
  }
  if (selVal1 == selVal2) {
    alert("Please select two different languages.");
    theForm["wl_trglang"].focus();
    return false;
  }
  if (theForm["wl_text"].value == "") { 
      alert("Type text to translate.");
      theForm["wl_text"].focus();
      return false;
  }

  return true;
}
function handleListChange(theList) {
  var numSelected = theList.selectedIndex;
  if (numSelected != 0) {
    textValue = document.textform.wl_text.value;
    textValue = textValue + theList.options[numSelected].value;
    document.textform.wl_text.value = textValue;
    theList.selectedIndex = 0;
  }
}
var clear = 0;
function checkClear(theEle) {
  if (clear == 0) {
    clear = 1;
    theEle.value = "";
  }
}
function disableForm(name, disable){
  var el = $(name).elements;
  for (i=0; i < el.length; i++) el[i].disabled = disable;
}

function swap_langs() {
  var selIndex1 = document.getElementById("SelSrcLang").selectedIndex;
  var selIndex2 = document.getElementById("SelTrgLang").selectedIndex;
  var selValsrc = document.getElementById("SelSrcLang").options[selIndex1].value;
  var selValtrg = document.getElementById("SelTrgLang").options[selIndex2].value;
  var cbo=document.getElementById("SelTrgLang");
  for(var i=0; i<cbo.length; i++) {
    if (cbo.options[i].value == selValsrc) {
      cbo.selectedIndex = i;
    }
  }
  var sel=document.getElementById("SelSrcLang");
  for(var i=0; i<sel.length; i++) {
    if (sel.options[i].value == selValtrg) {
      sel.selectedIndex = i;
    }
  }
  
}