/**

 * Javascript auto-completion for form fields. jQuery based in 1.1.5.

 * Different types of auto-completion fields can be defined (e.g. with different data sets). For each one, a schema

 * can be created describing how to draw each row.

 */

var autofill_schemas = window.autofill_schemas || {};

/**

 * SCHEMA - GENERIC

 */

autofill_schemas.generic = {

  init: function(element, fillclass, params)

  {

    $(element).autocomplete(makeUrlNS('Special', 'Autofill', 'type=' + fillclass) + '&userinput=', {

        minChars: 3

    });

  }

}

/**

 * SCHEMA - USERNAME

 */

autofill_schemas.username = {

  init: function(element, fillclass, params)

  {

    params = params || {};

    var allow_anon = params.allow_anon ? '1' : '0';

    $(element).autocomplete(makeUrlNS('Special', 'Autofill', 'type=' + fillclass + '&allow_anon=' + allow_anon) + '&userinput=', {

        minChars: 3,

        formatItem: function(row, _, __)

        {

          var html = row.name_highlight + ' – ';

          html += '<span style="' + row.rank_style + '">' + row.rank_title + '</span>';

          return html;

        },

        tableHeader: '<tr><th>' + $lang.get('user_autofill_heading_suggestions') + '</th></tr>',

        showWhenNoResults: true,

        noResultsHTML: '<tr><td class="row1" style="font-size: smaller;">' + $lang.get('user_autofill_msg_no_suggestions') + '</td></tr>',

    });

  }

}

autofill_schemas.page = {

  init: function(element, fillclass, params)

  {

    $(element).autocomplete(makeUrlNS('Special', 'Autofill', 'type=' + fillclass) + '&userinput=', {

        minChars: 3,

        formatItem: function(row, _, __)

        {

          var html = '<u>' + row.name_highlight + '</u>';

          html += ' – ' + row.pid_highlight;

          return html;

        },

        showWhenNoResults: true,

        noResultsHTML: '<tr><td class="row1" style="font-size: smaller;">' + $lang.get('user_autofill_msg_no_suggestions') + '</td></tr>',

    });

  }

}

window.autofill_onload = function()

{

  if ( this.loaded )

  {

    return true;

  }

  var inputs = document.getElementsByClassName('input', 'autofill');

  if ( inputs.length > 0 )

  {

    // we have at least one input that needs to be made an autofill element.

    // is spry data loaded?

    load_component('l10n');

  }

  this.loaded = true;

  for ( var i = 0; i < inputs.length; i++ )

  {

    autofill_init_element(inputs[i]);

  }

}

window.autofill_init_element = function(element, params)

{

  if ( element.af_initted )

    return false;

  params = params || {};

  // assign an ID if it doesn't have one yet

  if ( !element.id )

  {

    element.id = 'autofill_' + Math.floor(Math.random() * 100000);

  }

  var id = element.id;

  // get the fill type

  var fillclass = element.className;

  fillclass = fillclass.split(' ');

  fillclass = fillclass[1];

  var schema = ( autofill_schemas[fillclass] ) ? autofill_schemas[fillclass] : autofill_schemas['generic'];

  if ( typeof(schema.init) != 'function' )

  {

    schema.init = autofill_schemas.generic.init;

  }

  schema.init(element, fillclass, params);

  element.af_initted = true;

}

window.AutofillUsername = function(el, allow_anon)

{

  el.onkeyup = null;

  el.className = 'autofill username';

  autofill_init_element(el, { allow_anon: allow_anon });

}

window.AutofillPage = function(el)

{

  el.onkeyup = null;

  el.className = 'autofill page';

  autofill_init_element(el, {});

}

window.autofill_init = function()

{

  load_component(['l10n', 'jquery', 'jquery-ui']);

  if ( !window.jQuery )

  {

    throw('jQuery didn\'t load properly. Aborting auto-complete init.');

  }

  jQuery.autocomplete = function(input, options) {

    // Create a link to self

    var me = this;

    // Create jQuery object for input element

    var $input = $(input).attr("autocomplete", "off");

    // Apply inputClass if necessary

    if (options.inputClass) {

      $input.addClass(options.inputClass);

    }

    // Create results

    var results = document.createElement("div");

    $(results).addClass('tblholder').css('z-index', getHighestZ() + 1).css('margin-top', 0);

    $(results).css('clip', 'rect(0px,auto,auto,0px)').css('overflow', 'auto').css('max-height', '300px');

    // Create jQuery object for results

    // var $results = $(results);

    var $results = $(results).hide().addClass(options.resultsClass).css("position", "absolute");

    if( options.width > 0 ) {

      $results.css("width", options.width);

    }

    // Add to body element

    $("body").append(results);

    input.autocompleter = me;

    var timeout = null;

    var prev = "";

    var active = -1;

    var cache = {};

    var keyb = false;

    // hasFocus was false by default, see if making it true helps

    var hasFocus = true;

    var hasNoResults = false;

    var lastKeyPressCode = null;

    var mouseDownOnSelect = false;

    var hidingResults = false;

    // flush cache

    function flushCache(){

      cache = {};

      cache.data = {};

      cache.length = 0;

    };

    // flush cache

    flushCache();

    // if there is a data array supplied

    if( options.data != null ){

      var sFirstChar = "", stMatchSets = {}, row = [];

      // no url was specified, we need to adjust the cache length to make sure it fits the local data store

      if( typeof options.url != "string" ) {

        options.cacheLength = 1;

      }

      // loop through the array and create a lookup structure

      for( var i=0; i < options.data.length; i++ ){

        // if row is a string, make an array otherwise just reference the array

        row = ((typeof options.data[i] == "string") ? [options.data[i]] : options.data[i]);

        // if the length is zero, don't add to list

        if( row[0].length > 0 ){

          // get the first character

          sFirstChar = row[0].substring(0, 1).toLowerCase();

          // if no lookup array for this character exists, look it up now

          if( !stMatchSets[sFirstChar] ) stMatchSets[sFirstChar] = [];

          // if the match is a string

          stMatchSets[sFirstChar].push(row);

        }

      }

      // add the data items to the cache

      if ( options.cacheLength )

      {

        for( var k in stMatchSets ) {

          // increase the cache size

          options.cacheLength++;

          // add to the cache

          addToCache(k, stMatchSets[k]);

        }

      }

    }

    $input

    .keydown(function(e) {

      // track last key pressed

      lastKeyPressCode = e.keyCode;

      switch(e.keyCode) {

        case 38: // up

          e.preventDefault();

          moveSelect(-1);

          break;

        case 40: // down

          e.preventDefault();

          moveSelect(1);

          break;

        case 9:  // tab

        case 13: // return

          if( selectCurrent() ){

            // make sure to blur off the current field

            // (Enano edit - why do we want this, again?)

            // $input.get(0).blur();

            e.preventDefault();

          }

          break;

        default:

          active = -1;

          if (timeout) clearTimeout(timeout);

          timeout = setTimeout(function(){onChange();}, options.delay);

          break;

      }

    })

    .focus(function(){

      // track whether the field has focus, we shouldn't process any results if the field no longer has focus

      hasFocus = true;

    })

    .blur(function() {

      // track whether the field has focus

      hasFocus = false;

      if (!mouseDownOnSelect) {

        hideResults();

      }

    });

    hideResultsNow();

    function onChange() {

      // ignore if the following keys are pressed: [del] [shift] [capslock]

      if( lastKeyPressCode == 46 || (lastKeyPressCode > 8 && lastKeyPressCode < 32) ) return $results.hide();

      var v = $input.val();

      if (v == prev) return;

      prev = v;

      if (v.length >= options.minChars) {

        $input.addClass(options.loadingClass);

        requestData(v);

      } else {

        $input.removeClass(options.loadingClass);

        $results.hide();

      }

    };

    function moveSelect(step) {

      var lis = $("td", results);

      if (!lis || hasNoResults) return;

      active += step;

      if (active < 0) {

        active = 0;

      } else if (active >= lis.size()) {

        active = lis.size() - 1;

      }

      lis.removeClass("row2");

      $(lis[active]).addClass("row2");

      // scroll the results div

      // are we going up or down?

      var td_top = $dynano(lis[active]).Top() - $dynano(results).Top();

      var td_height = $dynano(lis[active]).Height();

      var td_bottom = td_top + td_height;

      var visibleTopBoundary = getScrollOffset(results);

      var results_height = $dynano(results).Height();

      var visibleBottomBoundary = visibleTopBoundary + results_height;

      var scrollTo = false;

      if ( td_top < visibleTopBoundary && step < 0 )

      {

        // going up: scroll the results div to just higher than the result we're trying to see

        scrollTo = td_top - 7;

      }

      else if ( td_bottom > visibleBottomBoundary && step > 0 )

      {

        // going down is a little harder, we want the result to be at the bottom

        scrollTo = td_top - results_height + td_height + 7;

      }

      if ( scrollTo )

      {

        results.scrollTop = scrollTo;

      }

      // Weird behaviour in IE

      // if (lis[active] && lis[active].scrollIntoView) {

      // 	lis[active].scrollIntoView(false);

      // }

    };

    function selectCurrent() {

      var li = $("td.row2", results)[0];

      if (!li) {

        var $li = $("td", results);

        if (options.selectOnly) {

          if ($li.length == 1) li = $li[0];

        } else if (options.selectFirst) {

          li = $li[0];

        }

      }

      if (li) {

        selectItem(li);

        return true;

      } else {

        return false;

      }

    };

    function selectItem(li) {

      if (!li) {

        li = document.createElement("li");

        li.extra = [];

        li.selectValue = "";

      }

      var v = $.trim(li.selectValue ? li.selectValue : li.innerHTML);

      input.lastSelected = v;

      prev = v;

      $results.html("");

      $input.val(v);

      hideResultsNow();

      if (options.onItemSelect) {

        setTimeout(function() { options.onItemSelect(li) }, 1);

      }

    };

    // selects a portion of the input string

    function createSelection(start, end){

      // get a reference to the input element

      var field = $input.get(0);

      if( field.createTextRange ){

        var selRange = field.createTextRange();

        selRange.collapse(true);

        selRange.moveStart("character", start);

        selRange.moveEnd("character", end);

        selRange.select();

      } else if( field.setSelectionRange ){

        field.setSelectionRange(start, end);

      } else {

        if( field.selectionStart ){

          field.selectionStart = start;

          field.selectionEnd = end;

        }

      }

      field.focus();

    };

    // fills in the input box w/the first match (assumed to be the best match)

    function autoFill(sValue){

      // if the last user key pressed was backspace, don't autofill

      if( lastKeyPressCode != 8 ){

        // fill in the value (keep the case the user has typed)

        $input.val($input.val() + sValue.substring(prev.length));

        // select the portion of the value not typed by the user (so the next character will erase)

        createSelection(prev.length, sValue.length);

      }

    };

    function showResults() {

      // get the position of the input field right now (in case the DOM is shifted)

      var pos = findPos(input);

      // either use the specified width, or autocalculate based on form element

      var iWidth = (options.width > 0) ? options.width : $input.width();

      // reposition

      $results.css({

        width: parseInt(iWidth) + "px",

        top: (pos.y + input.offsetHeight) + "px",

        left: pos.x + "px"

      });

      if ( !$results.is(":visible") )

      {

        $results.show("blind", {}, 200);

      }

      else

      {

        $results.show();

      }

    };

    function hideResults() {

      if (timeout) clearTimeout(timeout);

      timeout = setTimeout(hideResultsNow, 200);

    };

    function hideResultsNow() {

      if (hidingResults) {

        return;

      }

      hidingResults = true;

      if (timeout) {

        clearTimeout(timeout);

      }

      var v = $input.removeClass(options.loadingClass).val();

      if ($results.is(":visible")) {

        $results.hide();

      }

      if (options.mustMatch) {

        if (!input.lastSelected || input.lastSelected != v) {

          selectItem(null);

        }

      }

      hidingResults = false;

    };

    function receiveData(q, data) {

      if (data) {

        $input.removeClass(options.loadingClass);

        results.innerHTML = "";

        // if the field no longer has focus or if there are no matches, do not display the drop down

        if( !hasFocus )

        {

          return hideResultsNow();

        }

        if ( data.length == 0 && !options.showWhenNoResults )

        {

          return hideResultsNow();

        }

        hasNoResults = false;

        if ($.browser.msie) {

          // we put a styled iframe behind the calendar so HTML SELECT elements don't show through

          $results.append(document.createElement('iframe'));

        }

        results.appendChild(dataToDom(data));

        // autofill in the complete box w/the first match as long as the user hasn't entered in more data

        if( options.autoFill && ($input.val().toLowerCase() == q.toLowerCase()) ) autoFill(data[0][0]);

        showResults();

      } else {

        hideResultsNow();

      }

    };

    function parseData(data) {

      if (!data) return null;

      var parsed = parseJSON(data);

      return parsed;

    };

    function dataToDom(data) {

      var ul = document.createElement("table");

      $(ul).attr("border", "0").attr("cellspacing", "1").attr("cellpadding", "3");

      var num = data.length;

      if ( options.tableHeader )

      {

        ul.innerHTML = options.tableHeader;