// JavaScript Document

<!-- Copyright © 2009 ExIdeas, Inc.*
// version 1.80
/****************************************************************************************************************/	
//		Variables specific to the display using HTML
/****************************************************************************************************************/	
	var WinHeight, WinWidth, WinCenter;		// Window height and width
	var ul 						="_"
	var cr						="\n"
	var	cursor 					= ul;
	var tx 						= cursor;		// text shown on the display div
	var sp 						= " ";

	var initialMessage 			= "Tap or drag on buttons to enter letters and symbols!";
	var init_message_flag 		= true;
	
	var disp_str_curr;								// string replica of the disp array. used for back up
	var disp_array 				= new Array();		// this is the string that holds the screen
	var disp_array_bkup 	= new Array();			// this is the string that holds the screen
	//var disp_array_Index = 0;		// next element to be filled
	
	var all_loaded_flag = false;
	var menu_showing_flag = false;
	var menu_left_Open_flag = false;
	
/****************************************************************************************************************/	
	var displayObject = new Array();	
function DisplayElem(divName, left, top,  width, height, leftAdjust, exposed){		// An object that has a div and can have things in them
	this.divName 			= 	divName;					
	this.top				=	top;
	this.left				=	left;
	this.width				=	width;
	this.height				=	height;
	this.leftAdjust			= 	leftAdjust;
	this.exposed 			= 	exposed
	document.getElementById(divName).style.width = width
	document.getElementById(divName).style.height = height
	document.getElementById(divName).style.top = top
	return this;
}
/****************************************************************************************************************/	
//	 calculates the new window width and adjust the left of all divs to place the board in the center.
/****************************************************************************************************************/
function CenterBoard() {	
	hide_all();
	GetWindowDimensions()			
	//var lf = WinCenter  - Math.floor(displayObject["infoLeft"].width/2) + displayObject["infoLeft"].leftAdjust;
	//var tooLeftFlag = (lf <= 0)
				// calculates WidnWidth
	for (var elem in displayObject){
		displayObject[elem].left = WinCenter - Math.floor(displayObject[elem].width/2) + displayObject[elem].leftAdjust;
		document.getElementById(displayObject[elem].divName).style.left = displayObject[elem].left;
	}
	
	show_all();
}
/**************************************************************************************************************************/
function hide_all(){
		for (var elem in displayObject)
			hideDiv(displayObject[elem].divName);
}
/**************************************************************************************************************************/
function show_all(){
	for (var elem in displayObject)
		if (eval(displayObject[elem].exposed))
			showDiv(displayObject[elem].divName);
}
/**********************************************************function hideDiv(divName) **************************************************/
function hideDiv(divName){
	document.getElementById(divName).style.visibility="hidden";
}
/**********************************************************function hideDiv(divName) **************************************************/
function showDiv(divName){
	document.getElementById(divName).style.visibility="visible";
}
/****************************************************************************************************************/
function ToggleLanguage(T){
	KeyboardName = {"English": "English", "Katakana": "&#12459;&#12479;&#12459;&#12490;"};
	if (T){
		var temp = ME_Language_Name;
		ME_Language_Name = ME_other_language;
		ME_other_language = temp;
	}
	change_keyboard_language(ME_Language_Name);
	document.getElementById("languageChangeInsideDiv").innerHTML = KeyboardName[ME_other_language];
}
/****************************************************************************************************************/
function GetWindowDimensions(){									//	Get the width and height of the displaying window 
	if (document.all){
    	WinHeight = document.body.offsetHeight; 
		WinWidth = document.body.offsetWidth;
	}
	else{ 
			WinHeight = window.innerHeight;
			WinWidth = window.innerWidth;
	}
	WinCenter = Math.floor(WinWidth/2);
}	//GetWindowDimensions()
/****************************************************************************************************************/
function initPictures(){			//DisplayElem(divName, left, top,  width, height, leftAdjust
	displayObject["base"] 			= new DisplayElem ('baseDiv', 0, 0, 408, 722,0 , true);				// create and object with width and height attach to div name	
	displayObject["display"] 		= new DisplayElem ('displayDiv', 0, 150, 300, 50, -4 , true);		// create and object with width and height attach to div name	
	displayObject["keyboard"] 		= new DisplayElem ('keyboardDiv', 0, 308, 320, 300, -3 , true);		// create and object with width and height attach to div name	
	displayObject["langChange"] 	= new DisplayElem ('langChangeDiv', 0, 308, 80, 76, 117 , true);	// create and object with width and height attach to div name	
	displayObject["infoLeft"] 		= new DisplayElem ('infoLeftDiv', 0, 10, 160, 580, -290 , true);	// create and object with width and height attach to div name	
	displayObject["infoRight"] 		= new DisplayElem ('infoRightDiv', 0, 10, 160, 580, 265 , true);	// create and object with width and height attach to div name	
	displayObject["MessagEase"] 	= new DisplayElem ('MessagEaseDiv', 0, 129, 100, 15, -107 , true);			// create and object with width and height attach to div name	
	displayObject["dayTime"] 		= new DisplayElem ('dayTimeDiv', 0, 129, 70, 15, 0 , true);			// create and object with width and height attach to div name	
	displayObject["StartStopTTest"] = new DisplayElem ('StartStopTTestDiv', 0, 129, 90, 15, 104 , true);// create and object with width and height attach to div name	
	displayObject["timerCore"] 		= new DisplayElem ('timerCoreDiv', 0, 273, 300, 6, -4, 'ttest_in_progress')	;	// create an object with width and height attach to div name	
	displayObject["timerBox"] 		= new DisplayElem ('timerBoxDiv', 0, 272, 300, 6, -5, 'ttest_in_progress');		// create an object with width and height attach to div name	
	displayObject["changeLanguage"] = new DisplayElem ('changeLanguageDiv', 0, 129, 100, 15, -112 , '!ttest_in_progress');// create and object with width and height attach to div name	
	displayObject["menu"] 			= new DisplayElem ('menuDiv', 0, 0, 0, 0, 0, 'menu_showing_flag');				// create and object with width and height attach to div name	
	displayObject["outerpop"] 		= new DisplayElem ('outerpopDiv', 0, 308, 280, 280, -4, 'popup_showing_flag');				// create and object with width and height attach to div name	
	displayObject["innerpop"] 		= new DisplayElem ('innerpopDiv', 0, 338, 220, 220, -4, 'popup_showing_flag');				// create and object with width and height attach to div name	
	
	disableImageDrag();
}
/**************************************************************************************************************/
function disableImageDrag(){
	var isIEFlag = isIE();
	for (var elem in displayObject)
		if (isIEFlag)
			document.getElementById(displayObject[elem].divName).attachEvent('onmousedown', preventDef);
		else
			document.getElementById(displayObject[elem].divName).addEventListener("mousedown", preventDef, false);
}
/**************************************************************************************************************/
 function isIE(){
      return /msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent);
}
/**************************************************************************************************************/
function preventDef(event) {
  event.preventDefault();
}
/*********************************************************************************************************************/
function body_MouseDown(){		// just hide the menu
	
	if(menu_left_Open_flag){
		hideDiv('menuDiv');
		menu_showing_flag = false;
		menu_left_Open_flag = false;
	}
	
}
/**************************************************************************************************************/
// HTML function wrappers. These call ME functions  ME_MouseDown(P), ME_MouseUp(P), and ME_MouseMove(P)
function HTML_MouseDown(event) {						// HTML mouse down service 
	if (all_loaded_flag){
		var P = Get_Keyboard_Div_XY(event);
		ME_MouseDown(P);									// Call MessagEase's mouse down routine
	}
}
/*********************************************************************************************************************/
function Get_Keyboard_Div_XY(event){					// returns the xy coordinates rel to the Keyboard
	var p = new Object();
	if (isIE()){
		p.x = event.offsetX;
		p.y = event.offsetY;
	}
	else{
		p.x = event.layerX;
		p.y = event.layerY;
	}
	return p;
}
/*********************************************************************************************************************/
function HTML_MouseUp(event){
	if (all_loaded_flag){
		var P = Get_Body_XY_Displaced(event,displayObject['keyboard'].left, displayObject['keyboard'].top);
		ME_MouseUp(P)
	}
}
/*********************************************************************************************************************/
function HTML_MouseMove(event){
	if (all_loaded_flag){
 		var P = Get_Body_XY_Displaced(event,displayObject['keyboard'].left, displayObject['keyboard'].top);
		ME_MouseMove(P)
	}
}
/*********************************************************************************************************************/
function Get_Body_XY_Displaced(e, offset_x, offset_y) {
	var p = new Object();
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		p.x = e.pageX;
		p.y = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		p.x = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		p.y = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	p.x -= offset_x; 
	p.y -=offset_y;
	return p;
}
/*********************************************************************************************************************/
function Initialize(){
	initPictures();				// initialize the display divs
	ME_initilize();				// initialize the keyboard characters
	initTimer();
	CenterBoard();
	//ToggleLanguage(false);		// causes the language name to be displayedenter
	all_loaded_flag = true;

}
/****************************************************************************************************************************/
function removeThenAddChars(NoOfCharsRemoved, charAdded){			// this function is used by combine()  or do_autocombine() to combine one or two chars into a new one
	disp_array.length -=NoOfCharsRemoved;
	addCharToScreen(charAdded)
	render_display();
}
/*********************************************************************************************************************/
function showKeyboardImage(imageURL){						// show the keyboard image on the approrpiate area.
	blendimage("keyboardDiv", "keyboardImg", imageURL, 400);
}
/****************************************************************************************************************************/
function wipe() {				// cleans the whole screen when a cirlce on the edit button is done
	disp_array.length = 0;
	//render_display();
}
/************************************************************************************************************************/
function getCharBehindCursor(n){					// get a single char behind the cursor 0 means immediately behind, 1 means the one before it.
	if (disp_array.length >n)
		return( String.fromCharCode(disp_array[disp_array.length-1-n]).charAt(0));
	else
		return ("");
}
/*****************************************************************************************************************/
function putInDiv(DivName, String){
	document.getElementById(DivName).innerHTML = String ; 
}
/************************************************************************************************************************/
function getCharUnicode(x){				// trick html and get the unicode char
	if (x == "&amp;") return("&");
	else if (x == "&lt;") return("<");
	else if (x == "&gt;") return(">");
	else if (x==" ") return(' ');
	else if (x=="\n") return('\n');
	document.getElementById("dummydiv").innerHTML =x 				// put it somewhere to create the char
	return  (document.getElementById("dummydiv").innerHTML);
}
/************************************************************************************************************************/
function enter_char(y){	
	if (ttest_in_progress)
		ttest_check(y);
	else{
		addCharToScreen(y);
		render_display();
	}
}
/************************************************************************************************************************/
function addCharToScreen(y){
	disp_array[disp_array.length] = getCharUnicode(y).charCodeAt(0)
}
/*********************************************************************************************************************/
function addStrToScreen(s){
	for (var i=0; i< s.length; i++){
		addCharToScreen(s.charAt(i));
	}
	render_display();
}
/***********************************************************************************************************************/
function render_display(){								// uses the array E_Display_Array to show what's on the screen, taking care of carriage returns
	var i, last_space, beg_of_line, disp_show; 			// disp_show is a local string but disp_str is global
	var lines_exposed  = 3;
	disp_str = "";							
	for (i in  disp_array)
			disp_str =  disp_str.concat(String.fromCharCode(disp_array[i]))
	
	if (!ttest_in_progress)
		disp_str_curr = disp_str  							//make available for backup
	
	i = 0;
	last_space = -1;
	beg_of_line = 0; 
	
	while (i < disp_str.length)
		if (disp_str.charAt(i) == cr)
			beg_of_line = ++i;
		else 
			if (disp_str.charAt(i) == sp)
				last_space = i++;
			else 
				if (     tooLarge     (   disp_str.substring(beg_of_line, i+1) ) )					// this char or word cannot be added
					if (last_space <= beg_of_line){					// too long of  a char: break it here
						disp_str=(disp_str.substr(0, i)).concat(cr, disp_str.substr(i));
						beg_of_line = ++i;
					}
					else{
						//disp_str=(disp_str.substr(0, last_space)).concat(cr, disp_str.substr(last_space+1));			// no space at the end of the line
						disp_str=(disp_str.substr(0, last_space+1)).concat(cr, disp_str.substr(last_space+1));			// space at the end of the last word of the line
						beg_of_line = last_space + 1;
						i++
					}
				else
					i++;
	
	if (ttest_in_progress){									// if typing test is on: show top 3 lines, no cursor, render it through render_ttest_string()
		var lines_exposed  = 3;
		var count= 0;
		var mark = 0;
		for (i=0 ; i < disp_str.length; i++)
			if(disp_str.charAt(i) == cr)
				if(++count == lines_exposed) mark = i;
		disp_show = disp_str.substr(0, mark);
		disp_show = render_ttest_string(disp_show)			// render it so correct and incorrect lettes are shown
	}
	else{													// if it's regular typing, show the buttom 3 lines
		var count= 0;
		var mark = 0;
		for (i= disp_str.length-1; i>=0; i--)
			if(disp_str.charAt(i) == cr)
				if(++count == lines_exposed) mark = i;
		disp_show = disp_str.substr(mark) + cursor;
	}
	document.getElementById("displayDiv").innerHTML= '<pre>' + disp_show + "</pre>"; 
}
/***********************************************************************************************************************/
function CR_pos(str){
	return(str.search(/\n/) )
}
/***********************************************************************************************************************/

function hasCR(str){
		return( str.search(/\n/) != -1)
}
/***********************************************************************************************************************/
function tooLarge(s){
var Max_Num_Char = 25;
var Max_width = 290;
	if (document.getElementById) {
		var rulerSpan = document.getElementById('ruler');
		rulerSpan.innerHTML = '<pre>' + s +'</pre>';
		return (rulerSpan.offsetWidth > Max_width);
	}
	else
		return(s.length > Max_Num_Char);
}
/***********************************************************************************************************************/
function width_of_string(s) {
	if (document.getElementById) {
		var rulerSpan = document.getElementById('ruler');
		rulerSpan.innerHTML = s;
		return (rulerSpan.offsetWidth);
	}
	else (s.length * (300/35))
}
/*************************************************************************************************************************/
function bspace() {
	if (disp_array.length>0){
		disp_array.length--;
		render_display();
	}
}
/*************************************************************************************************************************/
function display_initial_message(initialMessage){
	disp_array.length = 0;
	addStrToScreen(initialMessage)
	disp_array.length = 0; 				// this would make it disapper
}
/*********************************************************************************************************************/
function openNewWindow(w,h,name) { 
  popupWin = window.open('', name, 'width='+ w+', height='+h+', left=100, top=100, menubar=no, toolbar=no,location=no ,directories=no ,status=no ,scrollbars=no ,resizable=no, marginwidth=0 marginheight=0')
}
/*********************************************************************************************************************/