/* hgiln-p.js */
/* web-hanglin-pack ver 0.33 */
/* by chiyu ( http://ha1.seikyou.ne.jp/home/akairingosaita/hangul/ ) */

/* web-hanglin-pack is available at */
/* http://ha1.seikyou.ne.jp/home/akairingosaita/hglin/hglinen.htm */

/* This web-hanglin-pack is based on */
/* original web-hanglin made by jeanluca */
/* ( http://jeanluca.cool.ne.jp/ ) */

/* The original Web-Hanglin is a Web version */
/* of Hanglin, a MS Windows aplication made by jeanluca, */
/* which is also available at http://jeanluca.cool.ne.jp/ */

//set function for English version
function hglin_set_english(){
  hglin_language = "english";
  hglin_first_syllable = "first consonants";
  hglin_second_syllable = "vowels";
  hglin_third_syllable = "final consonants";
  hglin_name_clear = "Clear";
  hglin_name_backspace = "BS";
  hglin_name_space = "Space";
  hglin_name_exclamation = "&#65281;"; // full-width exclamation mark
  hglin_name_question = "&#65311;"; // full-width question mark
  hglin_name_comma = "&#65292;"; // full-width comma
  hglin_name_period = "&#65294;"; // full-width period
  hglin_name_no = "110;&#111"; // no
  hglin_extended_convert_to_ncr = "convert to Unicode number";
}

function hglin_set_korean(){
  hglin_language = "korean";
  hglin_first_syllable = "&#52395;&#49548;&#47532;"; //cheos-so-ri
  hglin_second_syllable = "&#47784;&#51020;"; //mo-eum
  hglin_third_syllable = "&#45149;&#49548;&#47532;"; //kkeuth-so-ri
  hglin_name_clear = "Clear";
  hglin_name_backspace = "BS";
  hglin_name_space = "&#44277;&#48177;"; // kong-baek
  hglin_name_exclamation = "&#65281;"; // full-width exclamation mark
  hglin_name_question = "&#65311;"; // full-width question mark
  hglin_name_comma = "&#65292;"; // full-width comma
  hglin_name_period = "&#65294;"; // full-width period
  hglin_name_no = "110;&#111"; // no
  hglin_extended_convert_to_ncr = "convert to Unicode number";
}

function hglin_set_japanese(){
  hglin_language = "japanese";
  hglin_first_syllable = "&#21021;&#22768;"; //syosei
  hglin_second_syllable = "&#20013;&#22768;"; //tyu~sei
  hglin_third_syllable = "&#32066;&#22768;"; //syu~sei
  hglin_name_clear = "Clear";
  hglin_name_backspace = "BS";
  hglin_name_space = "&#31354;&#30333;"; // ku~haku
  hglin_name_exclamation = "&#65281;"; // full-width exclamation mark
  hglin_name_question = "&#65311;"; // full-width question mark
  hglin_name_comma = "&#65292;"; // full-width comma
  hglin_name_period = "&#65294;"; // full-width period
  hglin_name_no = "28961"; // nasi
  hglin_extended_convert_to_ncr = "convert to Unicode number";
}

// setting for English version (default)
hglin_set_english();

//browser detect
var br_check=0;
if(document.all) br_check=1 //MSIE4 or later
    else if(document.layers) br_check=2 //Netscape4.x
        else if(document.getElementById) br_check=3 //Netscape 6


function set_innerHTML(myid, mystring){
    if(br_check==1){ //IE4
      myelement = eval("document.all." + myid);
      myelement.innerHTML = mystring;
    } else if(br_check==3){ //NN6
      myelement = eval("document.getElementById\(\"" + myid +"\"\)");
      myelement.innerHTML = mystring;
    }
}

function get_innerHTML(myid){
    if(br_check==1){ //IE4
      myelement = eval("document.all." + myid);
      return myelement.innerHTML;
    } else if(br_check==3){ //NN6
      myelement = eval("document.getElementById\(\"" + myid +"\"\)");
      return myelement.innerHTML;
    }
}

function set_backgroundColor(myid, mycolor){
    if(br_check==1){ //IE4
      myelement = eval("document.all." + myid);
      myelement.style.backgroundColor = mycolor;
    } else if(br_check==3){ //NN6
      myelement = eval("document.getElementById\(\"" + myid +"\"\)");
      myelement.style.backgroundColor = mycolor;
    }
}


var OutputTextarea ="";

var SyoNumber = -1;
var CyuNumber = -1;
var PatNumber = -1;
var MidNum = -1;
hlight = "aqua";
choice1= "lightgreen";
choice2= "bisque";
choice3= "lavender";
bkcol = "lightgrey";
Syo = new Array(19); //syosei array
Cyu = new Array(21); //cyu~sei array
Pat = new Array(28); //syu~sei(pat-chim) array
mover="this.style.backgroundColor='"+hlight+"'";
mout1="this.style.backgroundColor='"+choice1+"'";
mout2="this.style.backgroundColor='"+choice2+"'";
mout3="this.style.backgroundColor='"+choice3+"'";

function SetSyoCode(){
    Syo[0]=12593;    Syo[1]=12594;
    Syo[2]=12596;    Syo[3]=12599;
    Syo[4]=12600;    Syo[5]=12601;
    Syo[6]=12609;    Syo[7]=12610;
    Syo[8]=12611;    Syo[9]=12613;
    Syo[10]=12614;   Syo[11]=12615;
    Syo[12]=12616;   Syo[13]=12617;
    Syo[14]=12618;   Syo[15]=12619;
    Syo[16]=12620;   Syo[17]=12621;
    Syo[18]=12622;
}
function SetCyuCode(){
  for(i=0;i<21;i++){
    Cyu[i]=12623+i;
  }
}
function SetPatCode(){
  Pat[0] = hglin_name_no;
  for(i=0; i<7;i++){
    Pat[i+1]=12593+i;
  }
  for(i=7; i<17;i++){
    Pat[i+1]=12601+(i-7);
  }
  for(i=17; i<22;i++){
    Pat[i+1]=12612+(i-17);
  }
  for(i=22; i<27;i++){
    Pat[i+1]=12618+(i-22);
  }
}

function ShowSyosei(){

    Str="<TABLE border='1'><TBODY><TR>";
    for(i=0; i< 14; i++){
       if (i < 11){
       Str = Str+"<TD class='jibo1' id='up"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('up" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('up" + i +"', choice1)\""
             +"onClick = 'SyoClick("+i+")'"
             +" >"
             +"&#"+Syo[i]+";"+"</A></TD>";
      } else {
       Str = Str+"<TD class='mkeyDummy'>"+'&#12615;'+"</TD>";
      }
    }
    Str = Str+"</TR><TR>"
    for(i=11; i< 25; i++){
       if (i < 19) {
       Str = Str+"<TD class='jibo1' id='up"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('up" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('up" + i +"', choice1)\""
             +"onClick = 'SyoClick("+i+")'"
             +">"
             +"&#"+Syo[i]+";"+"</A></TD>";
       }else{
         Str = Str+"<TD class='mkeyDummy'>"+'&#12615;'+"</TD>";
       }
    }
    Str = Str+"</TR></TBODY></TABLE>";
    set_innerHTML("pad", Str);

    Str2 = '<TABLE border="1"><TBODY><TR>'
    Str2 += '<TD class="jibo1" id="ind1"><A href="javascript:void(0)" class="ja" onClick="ShowSyosei()">';
    Str2 += hglin_first_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="mkey" id="ind2"><A href="javascript:void(0)" class="ja" onClick="ShowCyusei()">';
    Str2 += hglin_second_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="mkey" id="ind3"><A href="javascript:void(0)" class="ja" onClick="ShowPatim()">'
    Str2 += hglin_third_syllable;
    Str2 += '</A></TD>';
    Str2 += '</TR></TBODY></TABLE>'
    set_innerHTML("ind0", Str2);
}
function ShowCyusei(){
    Str="<TABLE border='1'><TBODY><TR>";
    for(i=0; i< 14; i++){
       if (i < 11) {
       Str = Str+"<TD class='jibo2' id='uq"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('uq" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('uq" + i +"', choice2)\""
             +"onClick = 'CyuClick("+i+")'"
             +" >"
             +"&#"+Cyu[i]+";"+"</A></TD>";
       } else {
         Str = Str+"<TD class='mkeyDummy'>"+'&#12615;'+"</TD>";
       }
    }
    Str = Str+"</TR><TR>"
    for(i=11; i< 25; i++){
       if (i < 21) {
       Str = Str+"<TD class='jibo2' id='uq"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('uq" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('uq" + i +"', choice2)\""
             +"onClick = 'CyuClick("+i+")'"
             +">"
             +"&#"+Cyu[i]+";"+"</A></TD>";
       }else{
         Str = Str+"<TD class='mkeyDummy'>"+'&#12615;'+"</TD>";
       }
    }
    Str = Str+"</TR></TBODY></TABLE>";
    set_innerHTML("pad", Str);
  
    Str2 = '<TABLE border="1"><TBODY><TR>'
    Str2 += '<TD class="mkey" id="ind1"><A href="javascript:void(0)" class="ja" onClick="ShowSyosei()">';
    Str2 += hglin_first_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="jibo2" id="ind2"><A href="javascript:void(0)" class="ja" onClick="ShowCyusei()">';
    Str2 += hglin_second_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="mkey" id="ind3"><A href="javascript:void(0)" class="ja" onClick="ShowPatim()">'
    Str2 += hglin_third_syllable;
    Str2 += '</A></TD>';
    Str2 += '</TR></TBODY></TABLE>'
    set_innerHTML("ind0", Str2);
}
function ShowPatim(){
    Str="<TABLE border='1'><TBODY><TR>";
    for(i=0; i< 14; i++){
       Str = Str+"<TD class='jibo3' id='ur"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('ur" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('ur" + i +"', choice3)\""
             +"onClick = 'PatClick("+i+")'"
             +">"
             +"&#"+Pat[i]+";"+"</A></TD>";
    }
    Str = Str+"</TR><TR>"
    for(i=14; i< 28; i++){
       Str = Str+"<TD class='jibo3' id='ur"+i+"'><A href='javascript:void(0)' class='ja' " 
             +"onmouseover = \"set_backgroundColor('ur" + i +"', hlight)\""
             +"onmouseout  = \"set_backgroundColor('ur" + i +"', choice3)\""
             +"onClick = 'PatClick("+i+")'"
             +">"
             +"&#"+Pat[i]+";"+"</A></TD>";
    }
    Str = Str+"</TR></TBODY></TABLE>";
    set_innerHTML("pad", Str);

    Str2 = '<TABLE border="1"><TBODY><TR>'
    Str2 += '<TD class="mkey" id="ind1"><A href="javascript:void(0)" class="ja" onClick="ShowSyosei()">';
    Str2 += hglin_first_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="mkey" id="ind2"><A href="javascript:void(0)" class="ja" onClick="ShowCyusei()">';
    Str2 += hglin_second_syllable;
    Str2 += '</A></TD>';
    Str2 += '<TD class="jibo3" id="ind3"><A href="javascript:void(0)" class="ja" onClick="ShowPatim()">'
    Str2 += hglin_third_syllable;
    Str2 += '</A></TD>';
    Str2 += '</TR></TBODY></TABLE>'
    set_innerHTML("ind0", Str2);
}

function SyoClick(n){
  SyoNumber=n;
  set_innerHTML("res", "&#"+ Syo[n] +';');
  ShowCyusei();
//  eval(OutputTextarea + ".focus()");
}
function CyuClick(nn){
  CyuNumber = nn;
  if (SyoNumber>=0) {
    MidNum    = 44032+(SyoNumber*21*28)+(CyuNumber*28);
    set_innerHTML("res", "&#"+MidNum+";");
    ShowPatim();
//    eval(OutputTextarea + ".focus()");
  }
}
function PatClick(nnn){
  PatNumber = nnn;
  if( MidNum > 0 ){
    LastNum = MidNum + nnn;
    stx = "&#"+LastNum+";";
    set_innerHTML("res", "<font color='lightgreen'>" + stx + "</font>");
    hanglin_insert(String.fromCharCode(LastNum));
    ShowSyosei();
//    eval(OutputTextarea + ".focus()");
  }
}

function ShowCopyright(){
    str ="";
    str += "<div style='font-size: x-small; font-style: italic;";
    str += "font-weight: bold; font-family:Arial; padding-left: 10px;";
    str += "padding-top:3px; color: white;'>Web-Hanglin-pack &copy; ";
    str += "<a href='http://jeanluca.cool.ne.jp/' TARGET=_blank>jeanluca</a> and";
    str += "<a href='http://ha1.seikyou.ne.jp/home/akairingosaita/hangul/' TARGET=_blank>";
    str += "chiyu</a>";
    str += "<br>";
    str += "<a href='http://ha1.seikyou.ne.jp/home/akairingosaita/hglin/hglinen.htm' TARGET=_blank>";
    str += "about Web-Hanglin-pack";
    str += "</a>";
    str += "</div>";
    set_innerHTML("copyr", str);
}


function ShowControlPanel(){
    str = "";
    str += "<TABLE border='1'>";
    str += "  <TBODY>";
    str += "    <TR>";
    str += '      <TD width="50%" class="mkey" id="gg1"><A href="javascript:void(0)" class="ja"';
    str +=        'onmouseover="set_backgroundColor(\'gg1\', hlight)"';
    str +=         'onmouseout="set_backgroundColor(\'gg1\', bkcol)"';
    str +=        'onClick="ClearClick()">';
    str +=        hglin_name_clear;
    str +=        '</A></TD>';
    str += '      <TD width="50%" class="mkey" id="gg2"><A href="javascript:void(0)" class="ja"';
    str +=           'onmouseover="set_backgroundColor(\'gg2\', hlight)"';
    str +=           'onmouseout="set_backgroundColor(\'gg2\', bkcol)"';
    str +=           'onClick="BsClick()">';
    str +=           hglin_name_backspace;
    str +=           '</A></TD>';
    str += '    </TR>';
    str +=      '<TR>';
    str +=      '<TD colspan="2" bgColor="lightgrey" align="center" id="gg3"><A href="javascript:void(0)" class="ja"';
    str +=           'onmouseover="set_backgroundColor(\'gg3\', hlight)"';
    str +=           'onmouseout="set_backgroundColor(\'gg3\', bkcol)"';
    str +=           'onClick="hanglin_insert(\' \')">';
    str +=           hglin_name_space;
    str +=           '</A></TD>';
    str += '    </TR>';
    str +=              '<TR>';
    str +=               '<TD class="mkey" id="gg4"><A href="javascript:void(0)" class="ja"';
    str +=              'onmouseover="set_backgroundColor(\'gg4\', hlight)"';
    str +=              'onmouseout="set_backgroundColor(\'gg4\', bkcol)"';
    str +=              'onClick="hanglin_insert(\'!\')">';
    str +=              hglin_name_exclamation;
    str +=              '</A></TD>';
    str += '      <TD class="mkey" id="gg5"><A href="javascript:void(0)" class="ja"';
    str +=               'onmouseover="set_backgroundColor(\'gg5\', hlight)"';
    str +=               'onmouseout="set_backgroundColor(\'gg5\', bkcol)"';
    str +=               'onClick="hanglin_insert(\'?\')">';
    str +=               hglin_name_question;
    str +=               '</A></TD>';
    str += '    </TR>';
    str +=                 '<TR>';
    str +=                  '<TD class="mkey" id="gg6"><A href="javascript:void(0)" class="ja"';
    str +=                   'onmouseover="set_backgroundColor(\'gg6\', hlight)"';
    str +=                   'onmouseout="set_backgroundColor(\'gg6\', bkcol)"';
    str +=                  'onClick="hanglin_insert(\',\')">';
    str +=                  hglin_name_comma;
    str +=                  '</A></TD>';
    str += '      <TD class="mkey" id="gg7"><A href="javascript:void(0)" class="ja"';
    str +=                   'onmouseover="set_backgroundColor(\'gg7\', hlight)"';
    str +=                   'onmouseout="set_backgroundColor(\'gg7\', bkcol)"';
    str +=                 'onClick="hanglin_insert(\'.\')">';
    str +=                 hglin_name_period;
    str +=                 '</A></TD>';
    str += '    </TR>  </TBODY></TABLE>';
    set_innerHTML("ctrl", str);
}

function ShowExtended() {
  str = "";
  str += "<form name='extended_form'>";
  str += "&#12288;<div id='extended_textarea' style='font-size: 200%; color: red;'>";
  str += "</div>";
  str += "<br><input type='button' name='extended_ncr' value='";
  str += hglin_extended_convert_to_ncr;
  str += "' onClick='hanglin_extended_convert_to_ncr()'>"
  str += "</form>";
  set_innerHTML("extended", str);
}

function hanglin_extended_convert_to_ncr() {
  var wkstr = get_innerHTML("extended_textarea");
  var wkstr2 = "";
  var wk_i = 0;
  var wkchr = "";
  for(wk_i = 0;wk_i < wkstr.length; wk_i++) {
    wkchrcode = wkstr.charCodeAt(wk_i);
    if(12593 <= wkchrcode && wkchrcode <= 42195) {
      wkstr2 += "&#" + wkchrcode + ";";
    } else if(44032 <= wkchrcode && wkchrcode <= 55203) {
      wkstr2 += "&#" + wkchrcode + ";";
    } else {
      wkstr2 += wkstr.charAt(wk_i);
    }
  }
  if(eval(OutputTextarea)) {
    eval(OutputTextarea + ".value = wkstr2");
  }
}

function hanglin_insert(st) {
  if(eval(OutputTextarea)) {
    eval(OutputTextarea + ".value += st");
  }
//    eval(OutputTextarea + ".focus()");
  if(document.extended_form) {
    set_innerHTML("extended_textarea", get_innerHTML("extended_textarea")+st);
  }
}

function ClearClick(){
  if(eval(OutputTextarea)) {
    eval(OutputTextarea + ".value=''");
//  eval(OutputTextarea + ".focus()");
  }
  if(document.extended_form) {
    set_innerHTML("extended_textarea", "");
  }
}
function BsClick(){
  if(eval(OutputTextarea)) {
    eval("var wkstr= " + OutputTextarea + ".value");
    eval(OutputTextarea + ".value = wkstr.slice(0,-1)");
//  eval(OutputTextarea + ".focus()");
  }
  if(document.extended_form) {
    wkstr = get_innerHTML("extended_textarea");
    set_innerHTML("extended_textarea", wkstr.slice(0,-1));
  }
}

function set_hanglin(input_area){
  OutputTextarea = input_area;
  SetSyoCode();
  SetCyuCode();
  SetPatCode();

  str = ""
  str += "<TABLE style='background-color : gray;' BORDER=0 CELLSPACING=0 CELLPADDING=0"
      str += "style='background-color : gray;'"
      str += "padding-left; 10px;"
      str += "padding-top: 5px;'>"
      str += "<TR>"
      str += "<TD>"
      str += "<P id='res' style='font-size: 200%; color: white;'>&#12288;</P>"
      str += "<DIV id='pad' >&#12288;</DIV>"
      str += "<DIV id='ind0'>&#12288;</DIV>"
      str += "<DIV id='copyr'></DIV>"
      str += "</TD>"
      str += "<TD>"
      str += "<DIV id='ctrl'>&#12288;</DIV>"
      str += "</TD></TR>";
      str += "<TR><TD>";
      str += "<DIV id='extended'></DIV>"
      str += "</TD></TR></TABLE>";

  document.writeln(str);

  ShowSyosei();
  ShowCopyright();
  ShowControlPanel();
}

function set_hanglin_extended(input_area){
  set_hanglin(input_area);
  ShowExtended();
}

function get_hanglin_extended_textarea() {
  return get_innerHTML("extended_textarea");
}

//main function




