document.addEvent('domready', function() {

  SqueezeBox.assign($$('a.sbox'), {
    parse: 'rel',
    size: {x: 625, y: 550}
  });

	/**
	 * Second input with extended list and custom inject
	 * choice function. This one gets the first element
	 * for the value and marks the searched string.
	 */
	var searchTerm = $('txtSearchTerm');
  var page       = $('hideReturnPage').value;

	// Our instance for the element with id "demo-word2"
	new Autocompleter.Request.HTML(searchTerm, page, {
		'indicatorClass': 'autocompleter-loading',
		'postData': {
			'extended': '1' // send additional POST data, check the PHP code
		},
    filterSubset: true,
		'injectChoice': function(choice) {
			// choice is one <li> element
			var text = choice.getFirst();
			// the first element in this <li> is the <span> with the text
			var value = text.innerHTML;
			// inputValue saves value of the element for later selection
			choice.inputValue = value;
			// overrides the html with the marked query value (wrapped in a <span>)
			text.set('html', this.markQueryValue(value));
			// add the mouse events to the <li> element
			this.addChoiceEvents(choice);
		}

	});

});
