document.write("<link rel='stylesheet' href='http://static.nexon.co.jp/global/swkeyboard/css/swkeyboard2.css' />");
document.write("<div id='pw_dummy'></div>");
document.write("<div class='software-keyboard-cont' id='keyboard' style='display:none;'>");
document.write("<div class='software-keyboard-ttl' onclick='clickSuffule();'>");
document.write("<span>ソフトウェアキーボード</span>");
document.write("</div>");
document.write("<div class='software-keyboard-close'><a href='javascript:open_keyboard(0);'><span>閉じる</span></a></div>");
document.write("<div class='software-keyboard-bg-blue' onclick='clickSuffule();'>");
document.write("<div class='software-keyboard-bg-white' >");
document.write("<div class='software-keyboard-bg-gray' onmouseover='hideKey();' onmouseout='showKey();'>");

document.write("<p class='keytxt' id='statusMessage1' style='display:block;'><strong>キー配置を表示中</strong></p>");
document.write("<p class='keytxt' id='statusMessage2' style='display:none;'><span><strong>安全のため、クリック時はキー配置を表示していません。</strong></span></p>");

document.write("<div class='software-keyboard' onmouseover='hideKey();' onmouseout='showKey();'>");
document.write("<ul>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey0' onclick='inputText(0,0); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey1' onclick='inputText(0,1); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey2' onclick='inputText(0,2); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey3' onclick='inputText(0,3); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey4' onclick='inputText(0,4); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey5' onclick='inputText(0,5); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey6' onclick='inputText(0,6); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey7' onclick='inputText(0,7); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey8' onclick='inputText(0,8); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey9' onclick='inputText(0,9); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey10' onclick='inputText(0,10); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey11' onclick='inputText(0,11); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey12' onclick='inputText(0,12); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey13' onclick='inputText(0,13); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey14' onclick='inputText(0,14); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey15' onclick='inputText(0,15); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey16' onclick='inputText(0,16); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey17' onclick='inputText(0,17); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey18' onclick='inputText(0,18); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey19' onclick='inputText(0,19); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey20' onclick='inputText(0,20); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey21' onclick='inputText(0,21); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey22' onclick='inputText(0,22); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey23' onclick='inputText(0,23); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey24' onclick='inputText(0,24); '/></li>");
document.write("<li><input type='button' value='' class='key' id='upperLetterKey25' onclick='inputText(0,25); '/></li>");
document.write("</ul>");
document.write("</div>");
document.write("<div class='software-keyboard'>");
document.write("<div class='second'>");
document.write("<ul>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey0' onclick='inputText(1,0); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey1' onclick='inputText(1,1); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey2' onclick='inputText(1,2); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey3' onclick='inputText(1,3); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey4' onclick='inputText(1,4); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey5' onclick='inputText(1,5); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey6' onclick='inputText(1,6); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey7' onclick='inputText(1,7); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey8' onclick='inputText(1,8); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey9' onclick='inputText(1,9); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey10' onclick='inputText(1,10); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey11' onclick='inputText(1,11); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey12' onclick='inputText(1,12); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey13' onclick='inputText(1,13); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey14' onclick='inputText(1,14); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey15' onclick='inputText(1,15); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey16' onclick='inputText(1,16); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey17' onclick='inputText(1,17); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey18' onclick='inputText(1,18); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey19' onclick='inputText(1,19); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey20' onclick='inputText(1,20); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey21' onclick='inputText(1,21); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey22' onclick='inputText(1,22); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey23' onclick='inputText(1,23); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey24' onclick='inputText(1,24); '/></li>");
document.write("<li><input type='button' value='' class='key' id='lowerLetterKey25' onclick='inputText(1,25); '/></li>");
document.write("</ul>");
document.write("</div>");
document.write("</div>");
document.write("<div class='software-keyboard'>");
document.write("<div class='second'>");
document.write("<ul>");
document.write("<li><input type='button' value='' class='key' id='NumKey0' onclick='inputText(2,0); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey1' onclick='inputText(2,1); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey2' onclick='inputText(2,2); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey3' onclick='inputText(2,3); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey4' onclick='inputText(2,4); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey5' onclick='inputText(2,5); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey6' onclick='inputText(2,6); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey7' onclick='inputText(2,7); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey8' onclick='inputText(2,8); '/></li>");
document.write("<li><input type='button' value='' class='key' id='NumKey9' onclick='inputText(2,9); '/></li>");
document.write("</ul>");
document.write("</div>");
document.write("</div>");
document.write("<div class='software-keyboard-delete'>");
document.write("<div class='second'>");
document.write("<input type='button' value='一文字消去' class='delete' onclick='delText();' />");
document.write("<input type='button' value='すべて消去' class='delete' onclick='allDelText();' />");
document.write("</div>");
document.write("</div>");
document.write("</div>");
document.write("<ul>");
document.write("<li>※ソフトウェアキーボード上のキー配置表示エリアを左クリックすると、キー配置が変更します。</li>");
document.write("</ul>");
document.write("</div>");
document.write("</div>");
document.write("</div>");

upperLetter = new Array("A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z");
lowerLetter = new Array("a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z");
Num = new Array("0","1","2","3","4","5","6","7","8","9");

suffule();

function suffule(){

	replaceKey();

	for(cnt=0;cnt<Num.length;cnt++){
		document.getElementById("NumKey"+cnt).value = Num[cnt];
	}

	for(cnt=0;cnt<upperLetter.length;cnt++){
		document.getElementById("upperLetterKey"+cnt).value = upperLetter[cnt];
		document.getElementById("lowerLetterKey"+cnt).value = lowerLetter[cnt];
	}


	function replaceKey(){
		tmp = new Array(upperLetter);
		tmp2 = new Array(lowerLetter);

		for (cnt=Num.length-1;cnt>=0;cnt--){
			j = Math.floor(Math.random()*cnt);
			num = Num[j];
			Num[j] = Num[cnt];
			Num[cnt] = num;
		}


		for (cnt=0;cnt<upperLetter.length;cnt++){
			tmp[cnt] = upperLetter[cnt];
			tmp2[cnt] = lowerLetter[cnt];
		}

		j = Math.floor(Math.random()*upperLetter.length);

		for (cnt=0;cnt<upperLetter.length;cnt++){
			upperLetter[cnt] = tmp[j];
			lowerLetter[cnt] = tmp2[j];
			j++;
			if (j>=upperLetter.length) j = 0;
		}
	}
}

function addElement(nxpw) {
	document.getElementById('pw_dummy').value = nxpw
}

function open_keyboard(frm_pw){

	addElement(frm_pw);

	if ( document.getElementById('keyboard').style.display == "block") {
		document.getElementById('keyboard').style.display = "none";
	}else{
		document.getElementById('keyboard').style.display = "block";
		document.getElementById(frm_pw).focus();
	}
}

function inputText(keyType, keyNum){
	
	var pwFrmName = document.getElementById('pw_dummy').value

	if (keyType==0){
		document.getElementById(pwFrmName).value += upperLetter[keyNum];
	}else if (keyType==1){
		document.getElementById(pwFrmName).value += lowerLetter[keyNum];
	}else if (keyType==2){
		document.getElementById(pwFrmName).value += Num[keyNum];
	}

	document.getElementById(pwFrmName).focus();
}

function delText(){

	var pwFrmName = document.getElementById('pw_dummy').value

	var str = document.getElementById(pwFrmName).value;
	var temp = str.substring(0, str.length-1);

	document.getElementById(pwFrmName).value = temp;
	document.getElementById(pwFrmName).focus();
}

function allDelText(){
	var pwFrmName = document.getElementById('pw_dummy').value

	document.getElementById(pwFrmName).value = '';
	document.getElementById(pwFrmName).focus();
}

function showKey(){
	keyflag = 1;
	printKey();
}

function hideKey(){
	keyflag = 0;
	printKey();
}

function printKey(){
	if (keyflag==1){
		for(cnt=0;cnt<Num.length;cnt++){
			document.getElementById("NumKey"+cnt).value = Num[cnt];
		}

		for(cnt=0;cnt<upperLetter.length;cnt++){
			document.getElementById("upperLetterKey"+cnt).value = upperLetter[cnt];
			document.getElementById("lowerLetterKey"+cnt).value = lowerLetter[cnt];
		}


		document.getElementById("statusMessage1").style.display = "block";
		document.getElementById("statusMessage2").style.display = "none";


	}else{
		for(cnt=0;cnt<Num.length;cnt++){
			document.getElementById("NumKey"+cnt).value = "　";
		}
		for(cnt=0;cnt<upperLetter.length;cnt++){
			document.getElementById("upperLetterKey"+cnt).value = "　";
			document.getElementById("lowerLetterKey"+cnt).value = "　";
		}

		document.getElementById("statusMessage1").style.display = "none";
		document.getElementById("statusMessage2").style.display = "block";
	}

}


function clickSuffule(){

	if (keyflag == 1){
		suffule();
		alert('キー配置を変更しました。');
	}
}