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

MyAJAXSuggest = {};

MyAJAXSuggest.requests = [];

MyAJAXSuggest.file	= 'ajax.php';

MyAJAXSuggest.field = null;

MyAJAXSuggest.options = null;

MyAJAXSuggest.bgColor = '#ededed';

MyAJAXSuggest.layer = null;

MyAJAXSuggest.isHidden = true;

MyAJAXSuggest.style = {
	//width:	200,
	height:		'175px',
	position:	'absolute',
	border:		'1px solid #000',
	overflow:	'scroll',
	background: 'white',
	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.toArray(obj);
		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++){
				//alert(MyAJAXSuggest.options[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();
	MyAJAXSuggest.positionLayer(field);
	MyAJAXSuggest.initEvents();
	
	var index = MyAJAXSuggest.requests.length;
	MyAJAXSuggest.requests[index] = true;
	
	//MyAJAXSuggest.request = true;
	
	//alert(index);
	
	return {
		tag:	{'index': index},
		file:	MyAJAXSuggest.file,
		method: MyAJAXSuggest.responseMethod
		/*
		method: function(obj){
			alert(obj.responseText);
			return;
			
			if(MyAJAXSuggest.request){
				MyAJAXSuggest.request = false;
			
				MyAJAXSuggest.options = MyAJAX.toArray(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.initStyle = function(style){
	MyAJAXSuggest.style.width = parseInt(MyAJAXSuggest.field.style.width) + 'px';
	
	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.field.onblur = function(){
		MyAJAXSuggest.hidden();
	};
	
	MyAJAXSuggest.layer.onmouseover = function(){
		MyAJAXSuggest.isHidden = false;
	};
	
	MyAJAXSuggest.layer.onmouseout = function(){
		MyAJAXSuggest.isHidden = true;
	};
	
	MyAJAXSuggest.layer.onblur = function(){
		MyAJAXSuggest.hidden();
	};
	*/
};
  	
MyAJAXSuggest.visible = function(){
	MyAJAXSuggest.layer.style.visibility = 'visible';
};

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

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

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(){
	if(MyAJAXSuggest.layer == null){
		MyAJAXSuggest.layer = document.createElement('div');
		//div.setAttribute('id', id);
		MyAJAXSuggest.loadStyle();
		MyAJAXSuggest.layer.style['visibility'] = 'hidden';
		var body = document.getElementsByTagName('body')[0];
		body.appendChild(MyAJAXSuggest.layer);
	}
	else{
		MyAJAXSuggest.loadStyle();
	}
};

MyAJAXSuggest.loadStyle = function(){
	for(var i in MyAJAXSuggest.style){
		MyAJAXSuggest.layer.style[i] = MyAJAXSuggest.style[i];
	}
};

MyAJAXSuggest.positionLayer = function(field){
	var cp = new CheckPosition(field);
	//alert(cp.top + ' - ' + cp.left);
	MyAJAXSuggest.layer.style.top = cp.top + MyAJAXSuggest.style.offset + 'px';
	MyAJAXSuggest.layer.style.left = cp.left + 'px';
};