suggest.js

trac是一款svn服务器的web客户端

/*
 Text field auto-completion plugin for jQuery.
 Based on http://www.dyve.net/jquery/?autocomplete by Dylan Verheul.
*/
$.suggest = function(input, url, paramName, minChars, delay) {
  var input = $(input).addClass("suggest").attr("autocomplete", "off");
  var timeout = null;
  var prev = "";
  var selectedIndex = -1;
  var results = null;

  input.keydown(function(e) {
    switch(e.keyCode) {
      case 27: // escape
        hide();
        break;
      case 38: // up
      case 40: // down
        e.preventDefault();
        if (results) {
          var items = $("li", results);
          if (!items) return;
          var index = selectedIndex + (e.keyCode == 38 ? -1 : 1);
          if (index >= 0 && index < items.length) {
            move(index);
          }
        } else {
          show();
        }
        break;
      case 9:  // tab
      case 13: // return
      case 39: // right
        if (results) {
          var li = $("li.selected", results);
          if (li.length) {
            select(li);
            e.preventDefault();
          }
        }
        break;
      default:
        if (timeout) clearTimeout(timeout);
        timeout = setTimeout(show, delay);
        break;
    }
  });
  input.blur(function() {
    if (timeout) clearTimeout(timeout);
    timeout = setTimeout(hide, 200);
  });

  function getOffset(elem) {
    elem = $(elem).get(0);
    var offset = {left: 0, top: 0};
    do {
      offset.left += elem.offsetLeft || 0;
      offset.top += elem.offsetTop || 0;
      elem = elem.offsetParent;
    } while (elem);
    return offset;
  }

  function hide() {
    if (timeout) clearTimeout(timeout);
    input.removeClass("loading");
    if (results) {
      results.fadeOut("fast").remove();
      results = null;
    }
    $("iframe.iefix").remove();
    selectedIndex = -1;
  }

  function move(index) {
    if (!results) return;
    items = $("li", results);
    items.removeClass("selected");
    $(items[index]).addClass("selected");
    selectedIndex = index;
  }

  function select(li) {
    if (!li) li = $("<li>");
    else li = $(li);
    var val = $.trim(li.text());
    prev = val;
    input.val(val);
    hide();
    selectedIndex = -1;
  }

  function show() {
    var val = input.val();
    if (val == prev) return;
    prev = val;
    if (val.length < minChars) { hide(); return; }
    input.addClass("loading");
    var params = {};
    params[paramName] = val;
    $.get(url, params, function(data) {
      if (!data) { hide(); return; }
      if (!results) {
        var offset = getOffset(input);
        results = $("<div>").addClass("suggestions").css({
          position: "absolute",
          minWidth: input.get(0).offsetWidth + "px",
          top:  (offset.top + input.get(0).offsetHeight) + "px",
          left: offset.left + "px",
          zIndex: 2
        }).appendTo("body");
        if ($.browser.msie) {
          var iframe = $("<iframe style='display:none;position:absolute;" +
            "filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);'" +
            " class='iefix' src='javascript:false;' frameborder='0'" +
            " scrolling='no'></iframe>").insertAfter(results);
          setTimeout(function() {
            var offset = getOffset(results);
            iframe.css({
              top: offset.top + "px",
              right: (offset.left + results.get(0).offsetWidth) + "px",
              bottom: (offset.top + results.get(0).offsetHeight) + "px",
              left: offset.left + "px",
              zIndex: 1
            });
            iframe.show();
          }, 10);
        }
      }
      results.html(data).fadeTo("fast", 0.92);
      items = $("li", results);
      items
        .hover(function() { move(items.index(this)) },
               function() { $(this).removeClass("selected") })
        .click(function() { select(this); input.get(0).focus() });
      move(0);
    });
  }
}

$.fn.suggest = function(url, paramName, minChars, delay) {
  url = url || window.location.pathname;
  paramName = paramName || 'q';
  minChars = minChars || 1;
  delay = delay || 400;
  return this.each(function() {
    new $.suggest(this, url, paramName, minChars, delay);
  });
}