/**
 * 具有上下文提示的输入框对象
 * @constructor
 * @class   具有上下文提示的输入框对象
 * @param  {String|Node} oParent  控件所在的父节点ID或者对象
 * @param  {Object}      oOptions 可选配置参数，已处理的参数列表
 *                                inputId   [String]   - 输入框id
 *                                className [String]   - 控件关联样式
 *                                onchange  [Function] - 输入框内容发生改变时的回调函数
 *                                onsuccess [Function] - 选中用户名的回调函数
 *                                onhideslt [Function] - 隐藏select
 * 
 */ 
CxtInput = Class.create();

/**
 * 控件初始化函数
 * @param {String|Node} oParent     父节点id或者对象
 * @param {Object}      oOptions    可选配置参数
 */
CxtInput.prototype.initialize = function(oParent,oOptions){
    oParent = $(oParent);
    if(!oParent) return;
    oOptions = oOptions || {};
    this.body = document.createElement('div');
    this.body.className = oOptions.className || '';
    this.key = oOptions.key||'';
    this.cbChange = oOptions.onchange || Prototype.emptyFunction;
    this.cbSuccess = oOptions.onsuccess;
    this.cbHideSelect  = oOptions.onhideslt;
    var str = '<input type="text" autocomplete="off" value="'+(oOptions.txtValue||'')+'" class="'+oOptions.txtClassName+'"';
    if (oOptions.inputId)  str += ' id="'+oOptions.inputId+'"'+' name="'+oOptions.inputId+'"';
    str += '/><div class="' +  oOptions.className + '-cxt" style="display:none;"></div>';
    this.body.innerHTML = str;
    this.input = this.body.getElementsByTagName('input')[0];
    this.context = this.body.getElementsByTagName('div')[0];
    Event.observe(this.input,'input',this.onChange.bind(this));
    Event.observe(this.input,'propertychange',this.onChange.bind(this));
    Event.observe(this.input,'keypress',this.onKeyPress.bindAsEventListener(this));
    Event.observe(document,'click',this.onClick.bind(this));
    Event.observe(this.input,'click',function(){Event.stop(window.event||arguments[0]);});
    oParent.appendChild(this.body);
};
/**
 * 输入框输入的消息响应函数
 */
CxtInput.prototype.onChange = function(){
    if(this.__flag){return;}
    if(this.input.value == ''){
        this.context.style.display = 'none';
        this.cbHideSelect(false);
    }
    this.cbChange(this.input.value,this.onListChange.bind(this));
};
/**
 * 上下文列表变化的回调函数
 * @param {Array} list  上下文列表
 */
CxtInput.prototype.onListChange = function(list){
    if(!list||!list.length){
    	this.context.style.display = 'none';
        this.cbHideSelect(false);
        return;
    };
    this.resetList(list);
    this.context.style.display = '';
    this.cbHideSelect(true);
};
/**
 * 在输入框中输入的消息响应函数
 * @param {Object} event    事件对象
 * 
 */
CxtInput.prototype.onKeyPress = function(event){
    switch(event.keyCode){
        case 9 :
        case 13:
            this.select(this.context.curIndex);
            Event.stop(event);
        break;
        case 38:
            if(this.context.curIndex > 0){
                Element.removeClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1],'cur');
                this.context.curIndex--;
                Element.addClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1],'cur');
            }
        break;
        case 40:
            if(this.context.curIndex < this.list.length - 1){
                Element.removeClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1],'cur');
                this.context.curIndex++;
                Element.addClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1],'cur');
            }
        break;
    }
};
/**
 * 设置上下文列表
 * @param {Array}   list    上下文列表
 */
CxtInput.prototype.resetList = function(list){
    if(!list||!list.length) list = [];
    this.list = list;
    for(var i=0,cs=this.context.childNodes,len=cs.length;i<len;i++)
        this.context.removeChild(this.context.firstChild);
    var frag = document.createDocumentFragment(),tpl=document.createElement('div'),div;
    div = tpl.cloneNode(false);
    div.className = 'hint';
    div.innerText = div.textContent = '请选择';
    div.onclick = this.select.bind(this,this.context.curIndex);
    frag.appendChild(div);
    for(var i=0,l=list.length,self = this;i<l;i++){
        div = tpl.cloneNode(false);
        div.innerText = div.textContent = list[i][this.key];
        if(i == 0){
            Element.addClassName(div,'cur');
            this.context.curIndex = i;
        }
        div.onmouseover = this.onMouseOver.bind(this,i);
        frag.appendChild(div);
    }
    this.__count = 0;
    this.context.appendChild(frag);
};
/**
 * 鼠标over上下文中的一项的消息响应函数
 */
CxtInput.prototype.onMouseOver = function(index){
    if(!this.__count++) return;
    Element.removeClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1], 'cur');
    this.context.curIndex = index;
    Element.addClassName(this.context.getElementsByTagName('div')[this.context.curIndex+1], 'cur');
};
/**
 * 鼠标点击的消息响应函数
 */
CxtInput.prototype.onClick = function(){
    if(this.context.curIndex != undefined&&this.context.style.display != 'none') this.select(this.context.curIndex);
};
/**
 * 选中上下文列表中的一项
 * @param {Number} index    索引值
 */
CxtInput.prototype.select = function(index){
    this.__flag = true;
    if(index == undefined||(index>this.list.length)||this.context.style.display == 'none') return;
    this.input.value = this.list[index][this.key];
    this.context.style.display = 'none';
    this.cbHideSelect(false);
    this.__flag = false;
    this.cbSuccess&&this.cbSuccess(this.list[index]);
};