var Class = {
  create: function() {
    return function() {
      this.initialize.apply(this, arguments);
    }
  }
}
Function.prototype.bind = function() {
  var __method = this, args = $A(arguments), object = args.shift();
  return function() {
    return __method.apply(object, args.concat($A(arguments)));
  }
}

Function.prototype.bindAsEventListener = function(object) {
  var __method = this, args = $A(arguments), object = args.shift();
  return function(event) {
    return __method.apply(object, [( event || window.event)].concat(args).concat($A(arguments)));
  }
}

var $A = Array.from = function(iterable) {
  if (!iterable) return [];
  if (iterable.toArray) {
    return iterable.toArray();
  } else {
    var results = [];
    for (var i = 0, length = iterable.length; i < length; i++)
      results.push(iterable[i]);
    return results;
  }
}

var AjaxHints = Class.create();
var AjaxHints_instances = [];

AjaxHints.init = function( inputElement ) {
        // wenn wir nach einem blur wieder aufgerufen werden
        // steht das inputelement in data.element
        if( inputElement.data )
            inputElement=inputElement.data.element;

        // holen des CO, an das diese Form submitted wird
        // von dort holen wir uns die query_superpage
        // um nur Begriffe vorzuschlagen, die dann auch gefunden werden

        $.each( inputElement.form.elements,function() {
            if( this.name && this.name.match(/wwe3_marker/) ){
                this.name.search(/\[a([0-9]+)o([0-9]+)\]/);
                area_id=RegExp.$1;
                object_id=RegExp.$2;
            }
        });

        inputElement.onkeyup=null;
        containerName='ajax_hints'+inputElement.id;
        selector_container="#"+containerName;
        if( $(selector_container).size() == 0 )
        {
            dummy=$('<div></div>');
            dummy.attr('id',containerName);
            dummy.addClass('ajax_hint_container');
            $(inputElement.parentNode).append(dummy);
        }

        $(selector_container).load
        (
                 "/rpc.php"
                ,{ action:"get_template", name:"ajax_hints", id:inputElement.id}
                ,function(data) {
                    me = new AjaxHints(inputElement);
                    me.selector_container=selector_container;
                    me.parameters={area:area_id,object:object_id};
                    me.do_search();
                    AjaxHints_instances[inputElement.id] = me;
                }
        );
}

AjaxHints.prototype = {
    initialize: function(inputElement) {
        this.call_timer=null;
        this.inputElementRef = inputElement;
        this.selector_in="#"+inputElement.id;
        this.selector_out="#ajax_hint_results";
        this.selector_wait="#ajax_hint_wait";
        this.selector_result=this.selector_out+" ul > li > a";
        $(inputElement).keydown(this.handle_key);
        $(inputElement).bind("blur",this.handle_blur);
        $(inputElement).attr('autocomplete','off');
        this.selected_result = -1;
        this.results=0;
        this.waiting4result=false;
        this.mouseOnResult=false;
        this.scrollSize=6;
    },

    // Ausblenden des ContainerDIVs wenn Inputfeld verlassen wird
    // Da ein Klick auf ein Result auch blur auslöst, benutzen wir einen Timeout
    handle_blur: function(e) {
        me = AjaxHints_instances[this.id];
    	if( me.mouseOnResult ) return;
//        $(this).bind('keyup',{element:this},AjaxHints.init);
        $(this).bind('focus',{element:this},AjaxHints.init);
        c=$(me.selector_container).get()[0];
        if(c) window.setTimeout(function(){this.parentNode.removeChild(c);}.bind(this),500);
    },
    handle_key: function(e) {
        $(me.selector_in).attr('autocomplete','off');
        me = AjaxHints_instances[this.id];
        if(( e.keyCode < 13 || e.keyCode > 40 ) )
        {
            if(me.call_timer) {
                clearTimeout(me.call_timer);
                me.call_timer=null;
            }
            me.call_timer=window.setTimeout(me.do_search.bind(me),200);
        } else {
            if( me.results > 0 )
            {
                //console.log(e.keyCode);
                switch(e.keyCode) {
                    case 13:    e.stopPropagation();                // RETURN
                                $(me.selector_result)[me.selected_result].onclick();
                                break;

                    case 33:    me.selected_result-=10;             // PAGE_UP
                                break;

                    case 34:    me.selected_result+=10;             // PAGE_DOWN
                                break;

                    case 35:    me.selected_result=me.results-1;    // END
                                break;

                    case 36:    me.selected_result=0;               // HOME
                                break;

                    case 37:                                        // LEFT
                    case 38:    me.selected_result--;               //UP
                                me.move = 'up';
                                break;

                    case 39:                                        // RIGHT
                                $(me.selector_in).attr("value",$($(me.selector_result)[me.selected_result]).attr('title'));
                                // $(me.selector_out).hide();
                                $(me.selector_container).hide();
                                break;

                    case 40:    me.selected_result++;               // DOWN
                                me.move = 'down';
                                break;
                }
                if( me.selected_result < 0 )
                    me.selected_result =0;
                if( me.selected_result > me.results-1 )
                    me.selected_result = me.results-1 ;
                $(me.selector_result).removeClass('selected');
                current_result=$($(me.selector_result)[me.selected_result])
                if(current_result) {
                    current_result.addClass('selected');


                    // scrollen mit den Tasten in der Autocomplete-Box
                    if( me.marker_0 == null)
                      me.marker_0 = 0;

                    if( me.marker_1 == null)
                      me.marker_1 = me.scrollSize - 1;

                    if(    me.move == 'down'
                        && me.selected_result > me.marker_1){

                        current_result[0].scrollIntoView(false);

                        me.marker_0++;
                        me.marker_1++;
                    }
                    else if(    me.move == 'up'
                             && me.selected_result < me.marker_0 ){

                        current_result[0].scrollIntoView(false);

                        me.marker_0--;
                        me.marker_1--;
                    }

                }
            }
        }
        return true;
    },

    handle_result_click: function ( self, text )
    {
        $(self.selector_in).attr ( "value", text );

        window.setTimeout ( function()
        {
        	self.mouseOnResult=false;
        	$(self.selector_out).hide();
        	$(self.selector_in).get(0).form.submit();
        }.bind ( this ), 100 );
    },

    handle_result: function() {
        this.results=0;
        this.selected_result=-1;

        $(this.selector_out).show();
        $(this.selector_result).each(function(self)
        {
            self.results++;

            this.onclick=arguments[0].handle_result_click.bind(this,arguments[0],$(this).attr('title'));
            $(this).mouseover(function(){
            	self.mouseOnResult=true;
            });
            $(this).mouseout(function(){
            	self.mouseOnResult=false;
            });

        },[this]);

        $(this.selector_wait).hide();
        if(this.results > 0) {



var elem_height = $(this.selector_result)[0].offsetHeight;
// autocomplete box imitieren
if( this.results > this.scrollSize ){
  var container_height = this.scrollSize * elem_height;
  var container_width = $(this.selector_container)[0].offsetWidth;

  //$(this.selector_container).css('height', container_height);
  //$(this.selector_container).css('overflow', 'auto');
}
else
{
  var container_height = this.results * elem_height;
  //$(this.selector_container).css('height', container_height);
  //$(this.selector_container).css('overflow', 'hidden');
}

me.marker_0 == null;
me.marker_1 == null;



            //$(this.selector_out).show();
            $(me.selector_container).show();
        }
        else $(this.selector_out).hide();
        this.waiting4result=false;
    },
    do_search: function() {
        _in=$(this.selector_in);
        _out_results=$(this.selector_out);
        _out_wait=$(this.selector_wait);
        if(_in[0].value.length > 0 && !this.waiting4result) {
            this.waiting4result=true;
          _out_wait.show();
          _out_results.hide();
            _out_results.load( "/rpc.php",
                               {  action:"get_search_hint",
                                  search:_in[0].value,
                                  lang:wwe_language.iso639_1,
                                  object:this.parameters.object,
                                  area:this.parameters.area },
                               this.handle_result.bind(this)
                             );

        }

    }
}