// 	onscriptload(); 

	
var firsttimeload = true;
function AppendEvent(obj,handler,capture, effects){ 	
		lstrObj = document.getElementById(obj);
	 if (navigator.userAgent.toLowerCase().indexOf("msie") != -1){
		 lstrObj.attachEvent('onclick', KeyHandler_click);
		 if (effects == true){
			 lstrObj.attachEvent('onmouseover', KeyHandler_mouseover);
			 lstrObj.attachEvent('onmouseout', KeyHandler_mouseout);
		 }
	 } else {// Mozilla, Netscape, Firefox
		 lstrObj.addEventListener('click', KeyHandler_click, false);
  		 if (effects == true){
  		 	lstrObj.addEventListener('mouseover', KeyHandler_mouseover, false);
			lstrObj.addEventListener('mouseout', KeyHandler_mouseout, false);
		}
	 }
}
function exitKeyboard() {
	KBBackgroundDiv.style.display = "none";
	//document.getElementById(vksizecontrolsDiv).style.display = "none";
	//document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;				
	showvkstate = false;
	//insertedTxt.removeAttribute('readOnly');
	EditableTextBox.focus();
}
function ShiftKeyPressed() {
	if (keyboardInterface == "_Shifted") {
		keyboardInterface = "_Default";
		Layout("_Default");
	} else if (keyboardInterface == "_Default") {
		keyboardInterface = "_Shifted";
		Layout("_Shifted");
	}
}
function backspace() {
	var insertedTxtLength = EditableTextBox.value.length;
	var newTxt = EditableTextBox.value.substr(0,insertedTxtLength-1);
	EditableTextBox.value = newTxt
}

function KeyHandler_mouseover(e){
	var mouseobj = Event(e);
	document.getElementById(mouseobj.id).className="btn btn-over";
}
function KeyHandler_mouseout(e){
		var mouseobj = Event(e);
		document.getElementById(mouseobj.id).className="btn"; 
}
function AddChar(Hexa){
	 EditableTextBox.value = EditableTextBox.value+String.fromCharCode(Hexa);
}
function KeyHandler_click(e) {

	var mouseobj = Event(e);

	if (keyboardInterface == "_Shifted")	{
		var currentBoard = ar_keys_shifted;
	} else if (keyboardInterface == "_Default") {
		var currentBoard = ar_keys_normal;
	}
	
	
	switch (mouseobj.id) {
	
		case "btn1_0": { backspace(); break;}
		case "btn1_1": { AddChar(currentBoard[0]);   break;}
		case "btn1_2": { AddChar(currentBoard[1]);   break; }
		case "btn1_3": { AddChar(currentBoard[2]);   break; }
		case "btn1_4": { AddChar(currentBoard[3]);   break; }
		case "btn1_5": { AddChar(currentBoard[4]);   break; }
		case "btn1_6": { AddChar(currentBoard[5]);   break; }
		case "btn1_7": { AddChar(currentBoard[6]);   break; }
		case "btn1_8": { AddChar(currentBoard[7]);   break; }
		case "btn1_9": { AddChar(currentBoard[8]);   break; }
		case "btn1_10": { AddChar(currentBoard[9]);   break; }
		case "btn1_11": { AddChar(currentBoard[10]);   break; }
		case "btn1_12": { AddChar(currentBoard[11]);   break; }
		case "btn1_13": { AddChar(currentBoard[12]);   break; }
		case "btn1_14": { exitKeyboard(); break; }
		
		case "btn2_0": { AddChar(currentBoard[13]);   break; }
		case "btn2_1": { AddChar(currentBoard[14]);   break; }
		case "btn2_2": { AddChar(currentBoard[15]);   break; }
		case "btn2_3": { AddChar(currentBoard[16]);   break; }
		case "btn2_4": { AddChar(currentBoard[17]);   break; }
		case "btn2_5": { if (keyboardInterface == "_Default") {
							var newchar = currentBoard[18].split("+");
						 	AddChar(newchar[0]);
					      } else if (keyboardInterface == "_Shifted") {
					      	AddChar(currentBoard[18]);
					      }
					      break;
					    }
		case "btn2_6": { AddChar(currentBoard[19]);   break; }
		case "btn2_7": { AddChar(currentBoard[20]);   break; }
		case "btn2_8": { if (keyboardInterface == "_Shifted") {
							var newchar = currentBoard[21].split("+");
						 	AddChar(newchar[0]);
						 	AddChar(newchar[1]);
					      } else if (keyboardInterface == "_Default") {
					     	 AddChar(currentBoard[21]);
					      }
					      break;
					    }
					     
		case "btn2_9": { AddChar(currentBoard[22]);   break; }
		case "btn2_10": { AddChar(currentBoard[23]);   break; }
		case "btn2_11": { AddChar(currentBoard[24]);   break; }
		case "btn2_12": { AddChar(currentBoard[25]);   break; }
		case "btn2_13": { AddChar(currentBoard[26]);   break; }
		
		
		case "btn3_0": { TxtBxForm.submit(); break; }
		case "btn3_1": { AddChar(currentBoard[27]);   break; }
		case "btn3_2": { AddChar(currentBoard[28]);   break; }
		case "btn3_3": { AddChar(currentBoard[29]);   break; }
		case "btn3_4": { AddChar(currentBoard[30]);   break; }
		case "btn3_5": { AddChar(currentBoard[31]);   break; }
		case "btn3_6": { AddChar(currentBoard[32]);   break; }
		case "btn3_7": { if (keyboardInterface == "_Shifted") {
							var newchar3_7 = currentBoard[33].split("+");
						 	AddChar(newchar3_7[0]);
						 	AddChar(newchar3_7[1]);
						 	
					      } else if (keyboardInterface == "_Default") {
					      	AddChar(currentBoard[33]);
					      }
					      break;
					  }
		case "btn3_8": { AddChar(currentBoard[34]);   break; }
		case "btn3_9": { AddChar(currentBoard[35]);   break; }
		case "btn3_10": { AddChar(currentBoard[36]);   break; }
		case "btn3_11": { AddChar(currentBoard[37]);   break; }
		
		
		case "btn4_0": { ShiftKeyPressed(); break;}
		case "btn4_1": { AddChar(currentBoard[38]);   break; }
		case "btn4_2": { AddChar(currentBoard[39]);   break; }
		case "btn4_3": { AddChar(currentBoard[40]);   break; }
		case "btn4_4": { AddChar(currentBoard[41]);   break; }
		case "btn4_5": { AddChar(currentBoard[42]);   break; }	
		case "btn4_6": { var newchar4_6 = currentBoard[43].split("+");
						 AddChar(newchar4_6[0]);
						 AddChar(newchar4_6[1]);
					     break; }
		case "btn4_7": { AddChar(currentBoard[44]);   break; }
		case "btn4_8": { AddChar(currentBoard[45]);   break; }
		case "btn4_9": { AddChar(currentBoard[46]);   break; }
		case "btn4_10": { AddChar(currentBoard[47]);   break; }
		case "btn4_11": { ShiftKeyPressed();  break; }
		
		case "btn5_0": { AddChar("0x0020");   break; }
	
	
	
		
	}//switch end
	
	formFocuse();
	if (keyboardInterface == "_Shifted" && shiftkey != 0) {
		keyboardInterface = "_Default";
		Layout("_Default");
		shiftkey = 0; // Restore shiftkey value to unpressed
	} 

}
function formFocuse(){
	EditableTextBox.focus();
}	
function Event(e)
	{
		  var event = e ? e : window.event;
		  return event.srcElement ? event.srcElement : event.target;
	}
	
function firstKeyboardState(vkstate){
	
		if (vkstate == false){
				KBBackgroundDiv.style.display = "none";
				//document.getElementById(vksizecontrolsDiv).style.display = "none";
				//document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;	
				//EditableTextBox.readOnly="";
				//insertedTxt.removeAttribute('readOnly');
		} else {
				//insertedTxt.setAttribute('readOnly','readonly');
				KBBackgroundDiv.style.display = "block";
				//document.getElementById(vksizecontrolsDiv).style.display = "block";
				//document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;
				//EditableTextBox.setAttribute("readonly", "true");
				//EditableTextBox.readOnly="readonly";
		}
		
	}
function Layout(state) {
		if (state == "_Default") {
			var currentlayout = ar_keys_normal
		} else if (state == "_Shifted") {
			var currentlayout = ar_keys_shifted
		}
	var key = 0;
	for (var line=1; line<5; line++) {
	
		for (var k=0; k<14 ; k++) {
		
		
			if ((line == 3 && k == 12) || (line == 4 && k == 12) || (line == 5 && k == 1)) { break;}
			if (!(line == 1 && k == 0) && !(line == 3 && k == 0) && !(line == 4 && (k == 0 || k == 11))) {
				
			//special case to concatinate two characters
				if (line == 2 && k == 8 && state == "_Shifted") {
					var chararray28 = currentlayout[key].split("+");
					document.getElementById("btn" + line + "_" + k).innerHTML = String.fromCharCode(chararray28[0])+String.fromCharCode(chararray28[1]);
					key += 1;
				} else if (line == 2 && k == 5 && state == "_Default") {
					var chararray25 = currentlayout[key].split("+");
					document.getElementById("btn" + line + "_" + k).innerHTML = String.fromCharCode(chararray25[0])+String.fromCharCode(chararray25[1]);
					key += 1;
				} else if (line == 3 && k == 7 && state == "_Shifted") {
					var chararray37 = currentlayout[key].split("+");
					document.getElementById("btn" + line + "_" + k).innerHTML = String.fromCharCode(chararray37[0])+String.fromCharCode(chararray37[1]);
					key += 1;
				} else if (line == 4 && k == 6) {
					var chararray46 = currentlayout[key].split("+");
					document.getElementById("btn" + line + "_" + k).innerHTML = String.fromCharCode(chararray46[0])+String.fromCharCode(chararray46[1]);
					key += 1;
				} else {
						if (currentlayout[key] == "") { //do without escaping
						document.getElementById("btn" + line + "_" + k).innerHTML = String.fromCharCode(currentlayout[key]);
						}else{
					document.getElementById("btn" + line + "_" + k).innerHTML = escapeIllegalChar(String.fromCharCode(currentlayout[key]));
					}
					key += 1;
				}
				
			}
		} 
	
	}
	
}
function escapeIllegalChar(strSRC){
         var strRet;
         strRet = "";
 
         for (var i=0, chc; i<strSRC.length; i++){
 
                 chc     = strSRC.charCodeAt(i); 
                 strRet += (chc == 32 
                         || chc == 37
                         || chc == 44
                         || chc == 95)?
                                 strSRC.charAt(i):
                                 '&#'+chc+';'
         }
         return strRet;
 }
 
function initiate() {
// add Event listener for each key
	for (var line=1; line<6; line++) {
		for (var k=0; k<14 ; k++) {
				
				if ((line == 3 && k == 13) || (line == 4 && k == 12) || (line == 5 && k == 1)) { 
					break;
				}
				
				//filter hasEffects or not
				if ((line == 1 && k == 0) || (line == 1 && k == 13)
				 || (line == 2 && k == 0) || (line == 2 && k == 13)
				  || (line == 3 && k == 0) || (line == 3 && k == 12)
				   || (line == 4 && k == 0) || (line == 4 && k == 11)
				    || (line == 5 && k == 0)){
					//AppendEvent(btnid,event,true,hasEffects);
					AppendEvent("btn"+line+"_"+k,'click',true,false);
				} else {
					AppendEvent("btn"+line+"_"+k,'click',true,true);
				} 
			} 
		
	
	}
	AppendEvent("btn1_14",'click',true);
	//AppendEvent("size",'click',true);
	//add listener to the vk controls
	//AppendEvent("sizeone",'click',true);
	//AppendEvent("sizetwo",'click',true);
	//AppendEvent("sizethree",'click',true);
	//AppendEvent(vklinkcontrolHref,'click',true);
}

function DrawKeyBoard() {


// first keyboard row
	
	var row1 = document.createElement("div");
	row1.id = "row1";
	row1.className = "row1";
	//document.getElementById("KB").appendChild(newkey);
	
	var newkey = document.createElement("div");
	newkey.id = "btn1_0";
	newkey.className = "btn-bs" ;
	row1.appendChild(newkey);

 	for (var k=1; k<14; k++) {
		newkey = document.createElement("div");
		newkey.id = "btn1_" + k;
		newkey.className = "btn" ;
		row1.appendChild(newkey);
	}
	
	newkey = document.createElement("div");
	newkey.id = "btn1_14";
	newkey.className = "btn-esc";
	row1.appendChild(newkey);
	
	// second keyboard row
	
	var row2 = document.createElement("div");
	row2.id = "row2";
	row2.className = "row2";
	//document.getElementById("KB").appendChild(newkey);
	
	newkey = document.createElement("div");
	newkey.id = "btn2_0";
	newkey.className = "btn-slash mid-btn-slash" ;
	row2.appendChild(newkey);

	 for (var k=1; k<13; k++) {
		newkey = document.createElement("div");
		newkey.id = "btn2_" + k;
		if (k == 2 || 3 || 4 ) { newkey.className = "btn" ; } else { newkey.className = "btn" ;}

		row2.appendChild(newkey);
	 }
	 
	newkey = document.createElement("div");
	newkey.id = "btn2_13";
	newkey.className = "btn-tab" ;
	row2.appendChild(newkey);
	 
	// third keyboard row
	
	var row3 = document.createElement("div");
	row3.id = "row3";
	row3.className = "row3"
	//document.getElementById("KB").appendChild(newkey);
	
	newkey = document.createElement("div");
	newkey.id = "btn3_0";
	newkey.className = "btn-enter mid-btn-enter" ;
	row3.appendChild(newkey);

	 for (var k=1; k<12; k++) {
		newkey = document.createElement("div");
		newkey.id = "btn3_" + k;
		if (k == 2 || 5 || 10 || 11 ) { newkey.className = "btn" ; } else { newkey.className = "btn" ;}
		row3.appendChild(newkey);
	 }
	 
	newkey = document.createElement("div");
	newkey.id = "btn3_12";
	newkey.className = "btn-caps";
	newkey.innerHTML = "Caps";
	row3.appendChild(newkey);

 	// forth keyboard row
	
	var row4 = document.createElement("div");
	row4.id = "row4";
	row4.className = "row4"
	//document.getElementById("KB").appendChild(newkey);
	
	newkey = document.createElement("div");
	newkey.id = "btn4_0";
	newkey.className = "btn-shift-r mid-btn-shift-r" ;
	row4.appendChild(newkey);

	 for (var k=1; k<11; k++) {
		newkey = document.createElement("div");
		newkey.id = "btn4_" + k;
		if (k == 5 || 6 || 10 ) { newkey.className = "btn" ; } else { newkey.className = "btn" ;}
		row4.appendChild(newkey);
	 }
	 
	newkey = document.createElement("div");
	newkey.id = "btn4_11";
	newkey.className = "btn-shift-l" ;
	row4.appendChild(newkey);
	
	// fifth keyboard row
	
	var row5 = document.createElement("div");
	row5.id = "row5";
	row5.className = "row5"
	
	
	newkey = document.createElement("div");
	newkey.id = "btn_logo";
	newkey.className = "logo-VK" ;
	row5.appendChild(newkey);

	 
	newkey = document.createElement("div");
	newkey.id = "btn5_0";
	newkey.className = "btn-space mid-btn-space" ;
	row5.appendChild(newkey);

	newkey = document.createElement("div");
	newkey.id = "btn_url";
	newkey.className = "url" ;
	newkey.innerHTML = "www.araby.com";
	row5.appendChild(newkey);
	
	
	var newkeyboard = document.createElement("div");
	newkeyboard.id = "KB";
	newkeyboard.className = "keyboard mid-keyboard" ;

	//appending  rows to the keyboard
	newkeyboard.appendChild(row1);
	newkeyboard.appendChild(row2);
	newkeyboard.appendChild(row3);
	newkeyboard.appendChild(row4);
	newkeyboard.appendChild(row5);
	//appending keyboard to the main div
	KBBackgroundDiv.appendChild(newkeyboard);
	
/*
	var newkey = document.createElement("DIV_size");
	newkey.id = "size";
	newkey.className = "btn-size" ;
	newkey.style.display = "none";
	newkey.innerHTML = "حجم متوسط";
	document.getElementById("row5").appendChild(newkey);
	*/
	
	//create keyboard size controls
	/*
	var newcontrol = document.createElement("vksizeone");
	newcontrol.id = "sizeone";
	newcontrol.innerHTML = "1";
	newcontrol.className = "btn" ;
	document.getElementById(vksizecontrolsDiv).appendChild(newcontrol);
	
	var newcontrol = document.createElement("vksizeone");
	newcontrol.id = "sizetwo";
	newcontrol.innerHTML = "2";
	newcontrol.className = "btn" ;
	document.getElementById(vksizecontrolsDiv).appendChild(newcontrol);
	
	var newcontrol = document.createElement("vksizeone");
	newcontrol.id = "sizethree";
	newcontrol.innerHTML = "3";
	newcontrol.className = "btn" ;
	document.getElementById(vksizecontrolsDiv).appendChild(newcontrol);
	*/

	//create show/hide link
	//var newlink = document.createElement("a");
	//newlink.setAttribute("href","");
	//newlink.setAttribute("id","vklinkcontrol");
	//newlink.innerHTML = "لوحة المفاتيح"+vklinkImageControl;
	//newlink.style.cursor="pointer";
	//newlink.className="searchbox-txt";
	//document.getElementById(vklinkcontrolDiv).appendChild(newlink);
	//document.getElementById(vklinkcontrolDiv).innerHTML =  '&nbsp;' + document.getElementById(vklinkcontrolDiv).innerHTML + '<div id="vkboard"><script src="/images/virtual_keyboard.js"></script>';
	//document.getElementById(vklinkcontrolHref).setAttribute("href","");

}





function onclickload(){

 	KBBackgroundDiv = document.getElementById("vkboard"); // Where the keyboard will be located
 	TxtBxForm = document.getElementById("searchForm"); // Where the form to submit
 	EditableTextBox = document.getElementById("topSearchBox"); // the Text box object
 	insertedTxt = EditableTextBox;
 	//var vksizecontrolsDiv = "vkcontrols"; // Where the size control will be located
 	//size = 0; //default is small size
 	showvkstate = true; //default is show keyboard on load
    ar_keys_normal = new Array("0x003D","0x002D","0x0660","0x0669","0x0668","0x0667","0x0666","0x0665","0x0664","0x0663","0x0662","0x0661","0x0630"
								,"0x005C","0x062F","0x062C","0x062D","0x062E","0x0647+0x0640","0x0639","0x063A","0x0641","0x0642","0x062b","0x0635","0x0636","0x0009"
								,"0x0637","0x0643","0x0645","0x0646","0x062A","0x0627","0x0644","0x0628","0x064a","0x0633","0x0634"
								,"0x0638","0x0632","0x0648","0x0629","0x0649","0x0644+0x0627","0x0631","0x0624","0x0621","0x0626");
	ar_keys_shifted = new Array("0x002B","0x005F","0x0028","0x0029","0x002A","0x0026","0x005E","0x066A","0x0024","0x0023","0x0040","0x0021","0x0651"
								,"0x007C","0x007B","0x007D","0x061B","","","","0x0625","0x0644+0x0625","0x064C","0x064F","0x064B","0x064E","0x0009"
								,"0x0022","0x003A","0x002F","0x060C","0x0640","0x0623","0x0644+0x0623","0x005B","0x005D","0x064D","0x0650"
								,"0x061F","0x003C","0x003E","","0x0622","0x0644+0x0622","0x007B","0x007D","0x0652","0x0653");
	
	//check in which page you are
   var strHref = window.location.href;
   if ( strHref.indexOf("Music") > -1 && getURLParam('q') == ""){
	//you are in Music index page
		document.getElementById("vkboard").className="keyboard-bg position-musichome mid-keyboard-bg";
	}else if (getURLParam('q') == ""){
		//you are in index page
		document.getElementById("vkboard").className="keyboard-bg position-home mid-keyboard-bg";
	}else{ 
		//you are in resultes page
		document.getElementById("vkboard").className="keyboard-bg position-inner mid-keyboard-bg";
	}
	DrawKeyBoard();
 	keyboardInterface = "_Default"; // Default keyboard characters (_Default = not shifted keyboard - _Shifter = shifter keyboard)
	shiftkey = 0; // Default shift key is unpressed (0 is unpressed - 1 is pressed)
	firstKeyboardState(showvkstate);
	Layout("_Default");
	initiate();
	/* this function belong to the tip*/
	//stickyhide();
}
function onscriptload(){
	/*vklinkcontrolHref = "vklink"; // Where the show-hide link will be located
	vklinkImageControl = "&nbsp;<img src='/images/vkboard/keyboard.gif' alt='' border=0' />";
	document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;
	document.getElementById(vklinkcontrolHref).style.cursor="pointer";
	document.getElementById(vklinkcontrolHref).className="searchbox-txt";
	
	if (navigator.appName == 'Microsoft Internet Explorer'){
		document.getElementById(vklinkcontrolHref).attachEvent('onclick', showme);
	} else {// Mozilla, Netscape, Firefox
		document.getElementById(vklinkcontrolHref).addEventListener('click', showme, false);
	}
	
*/
}
//calling when the user click on the keyboard
function showme() {

	if (firsttimeload == true){
		firsttimeload = false;
		//document.onclick=check;
		onclickload();
		
	}else{
			if (showvkstate == false){
				/* this function belong to the tip*/
				//stickyhide();
				/*this code run only on the images vertical*/
				if(document.getElementById("imagesize")){
					document.getElementById("imagesize").style.visibility = "hidden";
				}	
				//function track(dist,query,resultClicked,resultOrder,vertical,source)
				//track(dist,query,resultClicked,resultOrder,vertical,source)
				KBBackgroundDiv.style.display = "block";
				
				//document.getElementById(vksizecontrolsDiv).style.display = "block";
				//document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;
				showvkstate = true;	
				//insertedTxt.setAttribute('readOnly','readonly');
				//EditableTextBox.focus();
				//document.onclick=check;			
			} else {
			
				/*this code run only on the images vertical*/
				if(document.getElementById("imagesize")){
					document.getElementById("imagesize").style.visibility = "visible";
				}	
				KBBackgroundDiv.style.display = "none";
				//document.onclick="";
				//document.getElementById(vksizecontrolsDiv).style.display = "none";
				//document.getElementById(vklinkcontrolHref).innerHTML = "لوحة المفاتيح"+vklinkImageControl;				
				showvkstate = false;
				//insertedTxt.removeAttribute('readOnly');
				//EditableTextBox.focus();
			}
			EditableTextBox.focus();
		}
	
}
function getURLParam(strParamName){
      var strReturn = "";
      var strHref = window.location.href;
      if ( strHref.indexOf("?") > -1 ){
        var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase();
        var aQueryString = strQueryString.split("&");
        for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){
          if (aQueryString[iParam].indexOf(strParamName + "=") > -1 ){
            var aParam = aQueryString[iParam].split("=");
            strReturn = aParam[1];
            break;
          }
        }
      }
      return strReturn;
} 



function check(e){
	var target = (e && e.target) || (event && event.srcElement);
	var obj =  KBBackgroundDiv;

	if (checkParent(target)){
		showme();
		
	}

}
function checkParent(t){
	while(t.parentNode){
	if(t==KBBackgroundDiv){
		return false
	}	
		t=t.parentNode
	}
return true
}