/**
* @author Remy Sharp
* @url http://remysharp.com/2007/01/25/jquery-tutorial-text-box-hints/
*/

(function ($) {

$.fn.hint = function (blurClass) {
  if (!blurClass) { 
    blurClass = 'blur';
  }
    
  return this.each(function () {
    // get jQuery version of 'this'
    var $input = $(this),
    
    // capture the rest of the variable to allow for reuse
      title = $input.attr('title'),
      $form = $(this.form),
      $win = $(window);

    function remove() {
      if ($input.val() === title && $input.hasClass(blurClass)) {
        $input.val('').removeClass(blurClass);
      }
    }

    // only apply logic if the element has the attribute
    if (title) { 
      // on blur, set value to title attr if text is blank
      $input.blur(function () {
        if (this.value === '') {
          $input.val(title).addClass(blurClass);
        }
      }).focus(remove).blur(); // now change all inputs to title
      
      // clear the pre-defined text when form is submitted
      $form.submit(remove);
      $win.unload(remove); // handles Firefox's autocomplete
    }
  });
};

})(jQuery);

$(function(){ 
			    // find all the input elements with title attributes
				$('input[title!=""]').hint();
			});


$(document).ready(function(){
var models=new Array();
$('#models a').each(function( index,element ) {
	models[models.length]={name: $(element).attr('title'),img: $(element).text(),url: $(element).attr('href')};
});

$("#search_field").autocomplete(models,{
		minChars: 2,
		width: 254,
		matchContains: true,
		//autoFill: true,
		formatItem: function(row, i, max) {
			return '<span class="qs_photo"><img style="max-height: 32px;max-width: 32px;" src="'+row.img+'"></span><span class="qs_text"> '+row.name+'</span>';
		},
		formatMatch: function(row, i, max) {
			return row.name;
		},
		formatResult: function(row) {
			return row.name;
		}
	}
).result(function(event, item) {
	location.href = item.url;
});

});