document.addEvent('domready', function() {
 
	/**
	 * Simple example, backend returns a list of <li> elements,
	 * processed by Autocompleter.Request.HTML.
	 */
	var inputWord = $('s');
 
		
	new Autocompleter.Request.HTML(inputWord, oneup_url, {
		'indicatorClass': 'autocompleter-loading', // class added to the input during request
		'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);
			}
	});
 
	/**
	 * 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 inputWord2 = $('demo-word2');
	//  
	// // Our instance for the element with id "demo-word2"
	// new Autocompleter.Request.HTML(inputWord2, 'script.php', {
	// 	'indicatorClass': 'autocompleter-loading',
	// 	'postData': {
	// 		'extended': '1' // send additional POST data, check the PHP code
	// 	},
	// 	'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);
	// 	}
	// });
 
});
