RegisterEventHandler (window, 'load', selectTermins);
var article = null;
var HINT = new Array();
function selectTermins () {
	article = document.getElementsByTagName('body')[0];
	var top, i, temp, terms;
	terms = article.getElementsByTagName('ins');
	for (i = 0; i < terms.length; i++) {

		terms[i];
		temp = document.createElement('div');
		article.appendChild(temp);
		temp_line = document.createElement('div');
		article.appendChild(temp_line);
		temp_line.className = 'hint_line';
		temp_line.style.zIndex = '4';
		temp.id = 'hint'+(i+1);
		temp_line.id = 'hint_line'+(i+1);
		temp.style.zIndex = '100';
		temp.className = 'hint small';
		terms[i].id = 'term'+(i+1);
		temp.style.right = '5%';
		top = TSSGDA.getTopOffset(terms[i]);// - TSSGDA.getTopOffset(article);
		temp.style.top = top + 'px';//console.log(top);
		temp.style.width = '18%';
		temp.style.display = 'none';
       	cont = document.createElement('div');
       	cont.style.position = 'absolute';
       	article.appendChild(cont);
       	var tmp_arr = terms[i].getElementsByTagName('dfn');
       	var txt_obj;
       	for (var j in tmp_arr)
       	{
       		txt_obj = tmp_arr[j];
       		if (/gloss_term/i.test(txt_obj.className)) break;
        }
		temp.innerHTML = '<div>'+txt_obj.innerHTML+'</div>';// console.log(TSSGDA.getTopOffset(terms[i]) + ' ' + TSSGDA.getTopOffset(article));
		terms[i].title = '';
//        width = (TSSGDA.getLeftOffset(temp) - TSSGDA.getLeftOffset(terms[i])-20);
//		temp_line.style.width = width + 'px';
		terms[i].onmouseover = showHint;
		//temp_line.onmouseout = hideHint;
		HINT[i+1]=[temp, temp_line, terms[i], cont];
	}
}

function renderHint(i)
{
	//console.log(i, HINT[i]);
	var bubble_top = TSSGDA.getTopOffset(document.getElementById('main_content'));
	var bubble_height = document.getElementById('main_content').offsetHeight;
	var top = TSSGDA.getTopOffset(HINT[i][2]);
	HINT[i][0].style.top = top + 'px';
    HINT[i][0].style.display = 'block';
    var width = (TSSGDA.getLeftOffset(HINT[i][0]) - TSSGDA.getLeftOffset(HINT[i][2]));
	HINT[i][1].style.width = width + 'px';
	HINT[i][1].style.top = top + 'px';
	var left = TSSGDA.getLeftOffset(HINT[i][2]);
	HINT[i][1].style.left = left + 'px';
    HINT[i][1].style.display = 'block';
    HINT[i][2].style.background = "#e5eff5";
    HINT[i][2].style.borderBottomStyle = 'none';
	HINT[i][3].style.display = 'block';
    HINT[i][3].style.width = width + HINT[i][0].offsetWidth + 'px';
    HINT[i][3].style.height =  HINT[i][0].offsetHeight + 'px';
    HINT[i][3].style.left = left + 'px';
    HINT[i][3].style.top = top + 'px';
    HINT[i][4] = [left, top, width, HINT[i][2].offsetHeight + 20, HINT[i][0].offsetWidth, HINT[i][0].offsetHeight];
		    HINT[i][3].style.zIndex = 3;
	if (top + HINT[i][0].offsetHeight > bubble_top + bubble_height) top = bubble_top + bubble_height - HINT[i][0].offsetHeight;
	HINT[i][0].style.top = top + 'px';
	//console.log(top, HINT[i][0].offsetHeight, bubble_top, bubble_height);

		   // console.log(HINT[i][4]);
//    HINT[i][0].style.background = 'silver';
}

function showHint(event)  {
	hideAllHints();
	document.documentElement.onmousemove = null;
	if (!event) event=window.event;
	var article = document.getElementById('main_content');
    var target = event.target||event.srcElement;
    while (!/ins/i.test(target.nodeName)) target = target.parentNode;
    var id = target.id.substr(4) ;
    if(!id) return false;
    renderHint(id);
    //HINT[id][3].onmousemove = dontHide;
    document.documentElement.onmousemove = function (event) {hideHint(event, id);}
//	width = (TSSGDA.getLeftOffset(hint) - TSSGDA.getLeftOffset(event.target)-20);
//	hint_line.style.width = width + 'px';

//	top = TSSGDA.getTopOffset(event.target);// - TSSGDA.getTopOffset(document.getElementById('main_content'));
//	hint.style.top = top + 'px';
}

function hideHint(event, i)  {
	if (!event) event=window.event;
	//var article = document.getElementById('main_content');
    //var target = event.target||event.srcElement;
    //while (!/hint/i.test(target.className)) target = target.parentNode;
    //var i = event.target.id.substr(9) ;
    m_left = event.clientX;
    var scroll_top = document.documentElement.scrollTop||document.body.scrollTop;
    m_top = scroll_top + 5 + event.clientY;
    if (
    	(m_left + 10 > HINT[i][4][0] && m_left < HINT[i][4][0] + HINT[i][4][2] && m_top > HINT[i][4][1] && m_top < HINT[i][4][1] + HINT[i][4][3]) ||
    	(m_left > HINT[i][4][0] + HINT[i][4][2] - 10 && m_left < HINT[i][4][0] + HINT[i][4][2]  + HINT[i][4][4] && m_top > HINT[i][4][1] && m_top < HINT[i][4][1] + HINT[i][4][5])
    ) return false;
   	//alert(m_left+'/'+m_top+'+'+HINT[i][4][0]+'/'+HINT[i][4][1]+'/'+HINT[i][4][2]+'/'+HINT[i][4][3]+'/'+'||'+scroll_top);

    //console.log(m_left, m_top, HINT[i][4]);
    if(!i) return false;
    document.documentElement.onmousemove = null;
    //console.log(i);
    hideAllHints();
}

function hideAllHints(i)
{
for (i in HINT)
    {
	    HINT[i][0].style.display = 'none';
    	HINT[i][1].style.display = 'none';
    	HINT[i][2].style.background = "none";
    	HINT[i][2].style.borderBottomStyle = 'dashed';
    	HINT[i][3].style.display = "none";
    }
}