Import('ajax/MyAJAX.js');
Import('myLib/events/CreatorEvents.js');

MyAJAXSuggest = {};

MyAJAXSuggest.requests = [];

MyAJAXSuggest.file	= 'ajax.php';

MyAJAXSuggest.field = null;

MyAJAXSuggest.options = null;

MyAJAXSuggest.layer = null;

//MyAJAXSuggest.isHidden = true;

MyAJAXSuggest.style = {
	'height'		: '200px',
	'position'		: 'absolute',
	'border'		: '1px solid #000',
	'overflow'		: 'scroll',
	'background'	: 'white',
	'z-index'		: 100,
	'offset'		: 20
};

MyAJAXSuggest.divName = 'suggestionDiv';

//--- public

MyAJAXSuggest.suggestByServiceId = function(serviceId, field, style){
	if(MyAJAXSuggest.isInit(field)){
		var params = MyAJAXSuggest.initParams(field, style);
		MyAJAX.init('suggestByServiceId', [serviceId, MyAJAXSuggest.field.value], params);
	}
};

//---

MyAJAXSuggest.initMethod = function(method, field, style){
	if(MyAJAXSuggest.isInit(field)){
		var params = MyAJAXSuggest.initParams(field, style);
		MyAJAX.init(method, [MyAJAXSuggest.field.value], params);
	}
};

MyAJAXSuggest.init = function(field, style){
	if(MyAJAXSuggest.isInit(field)){
		var params = MyAJAXSuggest.initParams(field, style);
		MyAJAX.init('suggest', [MyAJAXSuggest.field.value], params);
	}
};

MyAJAXSuggest.isInit = function(field){
	return field.value.length >= 2; // && field.value.length <= 20;
};

//--- private

MyAJAXSuggest.responseMethod = function(obj){
	var index = MyAJAXSuggest.requests.length - 1;
	/*
	if(MyAJAXSuggest.requests.length > 0){
		index = MyAJAXSuggest.requests.length - 1;
	}
	*/

	if(parseInt(obj.tag.index) == index){
		//alert(obj.responseText);
		//return;

		MyAJAXSuggest.requests = [];

		MyAJAXSuggest.options = MyAJAX.xmlToArray(obj);

		if(MyAJAXSuggest.options.length == 0){
			MyAJAXSuggest.hidden();
		}
		else{
			MyAJAXSuggest.layer.innerHTML = '';
			for(var i = 0; i < MyAJAXSuggest.options.length; i++){
				MyAJAXSuggest.layer.innerHTML += '' +
				'<div id="' + MyAJAXSuggest.divName + i +
				'" onclick="MyAJAXSuggest.loadOptionText(this); MyAJAXSuggest.hidden();" ' +
				'onmouseover="MyAJAXSuggest.selectOption(this);" style="cursor: hand; ' +
				'padding: 2px 1px 2px 1px; text-align: left;">' + MyAJAXSuggest.options[i] + '</div>';
			}
			MyAJAXSuggest.checkOptions();
			MyAJAXSuggest.visible();
		}
	}
};

//---

MyAJAXSuggest.initParams = function(field, style){
	MyAJAXSuggest.field = field;

	MyAJAXSuggest.initStyle(style);
	MyAJAXSuggest.createLayer(field);
	MyAJAXSuggest.initEvents();

	var index = MyAJAXSuggest.requests.length;
	MyAJAXSuggest.requests[index] = true;

	return {
		tag:	{'index': index},
		file:	MyAJAXSuggest.file,
		method: MyAJAXSuggest.responseMethod
	};
};

MyAJAXSuggest.initStyle = function(style){
	if(typeof(style) == 'object' && style != null){
		for(var i in style){
			MyAJAXSuggest.style[i] = style[i];
		}
	}
};

MyAJAXSuggest.initEvents = function(){
	var ce = new CreatorEvents(window);
	ce.add('click', MyAJAXSuggest.hidden);
};

MyAJAXSuggest.visible = function(){
	MyAJAXSuggest.layer.style['visibility'] = 'visible';
	//MyAJAXSuggest.layer.style.display = 'block';
};

MyAJAXSuggest.hidden = function(isHidden){
	//if(MyAJAXSuggest.isHidden || isHidden){
		MyAJAXSuggest.layer.style['visibility'] = 'hidden';
		//MyAJAXSuggest.layer.style.display = 'none';
	//}
};

MyAJAXSuggest.selectOption = function(option){
	for(var i = 0; i < MyAJAXSuggest.options.length; i++){
		document.getElementById(MyAJAXSuggest.divName + i).style.backgroundColor = 'white';
	}
	option.style.backgroundColor = '#ededed';
};

MyAJAXSuggest.checkOptions = function(){
	for(var i = 0; i < MyAJAXSuggest.options.length; i++){
		var div = document.getElementById(MyAJAXSuggest.divName + i);
		if(div.innerHTML.toLowerCase() == MyAJAXSuggest.field.value.toLowerCase()){
			div.style.backgroundColor = MyAJAXSuggest.bgColor;
		}

	}
};

MyAJAXSuggest.loadOptionText = function(option){
	MyAJAXSuggest.field.value = option.innerHTML;
};

MyAJAXSuggest.createLayer = function(field){
	if(MyAJAXSuggest.layer == null){
		//alert(field.parentNode.parentNode.id); //nodeName
		var parent = MyAJAXSuggest.getParent(field); //document.getElementById('divHeadA'); //field.parentNode;
		if(parent != null){
			parent.style['position'] = 'relative';
			parent.style['overflow'] = 'visible';
			MyAJAXSuggest.layer = document.createElement('div');
			MyAJAXSuggest.loadStyle();
			MyAJAXSuggest.hidden();
			//MyAJAXSuggest.layer.style['display'] = 'none';
			//var body = document.getElementsByTagName('body')[0];
			parent.appendChild(MyAJAXSuggest.layer);
		}
	}
	else{
		MyAJAXSuggest.loadStyle();
	}
};

MyAJAXSuggest.loadStyle = function(){
	for(var i in MyAJAXSuggest.style){
		if(typeof(MyAJAXSuggest.style[i]) == 'number')
			MyAJAXSuggest.layer.style[i] = MyAJAXSuggest.style[i] + 'px';
		else
			MyAJAXSuggest.layer.style[i] = MyAJAXSuggest.style[i];
	}
};

MyAJAXSuggest.getParent = function(field){
	var parent = field;
	while(true){
		parent = parent.parentNode;
		var name = parent.nodeName.toLowerCase();
		if(parent == null || name == 'div'){ // || name == 'td' || name == 'th'
			break;
		}
	}
	return parent;
};