/** 
	 * 
	 * THIS METHOD IS NOT USED
	 * refreshes the list of countries starting with a given string of characters
	 * @param string first characters of the countries name
	 */
	function searchProducts(input) {
	//	if ( input.value == __as[input.id]['selectedValue'] ) {
	//		return;
	//	}
		// __as[input.id]['selectedValue'] = input.value ; 
		
		
		$.ajax({
			method: "get",url: "/js/search_products/" + input.value
			,async: false 
			,dataType: "json"
			,beforeSend: function(){ 				
			//	$("#message").html("Loading the list of products starting with " + input.value);
			} //show loading just when link is clicked
			,complete: function(){ 
			} //stop showing loading when the process is complete
			,success:function(json){
				var options = new Array() ; 	
				totalItems = json.length ; 	
			//	if ( totalItems == 0 ) {
			//		$("#message").html("No products were found with this name.");					
			//	} else 
			//		$("#message").html(totalItems + " products were found sounding similar to this.");

				//__as[input.id]['options'] = json  ;
				for (i = 0; i < json.length; i++) {
					options[i] = json[i].name ;
					 
				}	
				alert ( options ) ;
				
			} 
		}) ; 
	}
	
	
	/** 
	 * ############################################################
	 * Auto complete functions 
	 * ############################################################
	 */
	
	/**  Variables used for auto suggestion **/
	var __as = new Array() ;
	
	/** initialises the variables involved in auto suggestion
	 * 
	 * @param input The form input(textbox) to which sets the variables for
	 * @return
	 */
	function init_as(input) {
		var tb = $( "input#" + input.id )  ;
		var offset = tb.offset() ;		
		__as[input.id] = new Array() ;
		__as[input.id]['sugDivName'] = "suggestions_" + input.id ;
		__as[input.id]['sugDivClassName'] = "suggestions" ; 
		__as[input.id]['sugDiv'] = "div#" + __as[input.id]['sugDivName'] ;		
		__as[input.id]['sugSpanName'] = "suggestedOption" ; 
	    __as[input.id]['selectedIndex'] = -1 ;
	    __as[input.id]['selectedValue'] = "" ; 
	    __as[input.id]['options'] = null ;
	    __as[input.id]['left_offset'] = offset.left  ; 
	    __as[input.id]['top_offset'] = offset.top + tb.outerHeight(true);
	    __as[input.id]['min_width'] = tb.outerWidth() ;
	    __as[input.id]['visibility'] = 'visible' ;
	    __as[input.id]['display'] = 'block' ;
	     
	    tb.after ('<div id="' + __as[input.id]['sugDivName'] + '" class="' + __as[input.id]['sugDivClassName'] + '" ></div>') ;
	    var sugDiv = $(__as[input.id]['sugDiv']) ;
	    sugDiv.css("left",__as[input.id]['left_offset']) ;
	    sugDiv.css("top",__as[input.id]['top_offset']) ;
	    sugDiv.css("min-width",__as[input.id]['min_width']) ;
	    sugDiv.css('visibility' ,__as[input.id]['visible'] ) ;
	    sugDiv.css('display' ,__as[input.id]['display'] ) ;
	}
	
	/**
	 * Displays a list of suggestions for a selected text box on the screen
	 *  
	 * @param textbox the box for which suggestions are displayed
	 * @param event keyboard events
	 * @return
	 */
	function autoSuggest(input,event, fn, optParams) {
		if ( typeof(__as[input.id]) == "undefined" 
			|| __as[input.id] == null ) {
			init_as(input) ; 
		}

		// calls the function specified within the autosuggest call, with optional parameters.
		if ( optParams == null ) {
			window[fn]( input) ;
		} else {
			window[fn]( input , optParams ) ;
		}

		var suggestions = new Array(__as[input.id]['options'].length) ; 
		
		$(__as[input.id]['sugDiv']).html('') ;
		
		for (i = 0; i < __as[input.id]['options'].length; i++) {
			suggestions[i] = __as[input.id]['options'][i].name ; 
			$(__as[input.id]['sugDiv']).append('<span class="' + __as[input.id]['sugSpanName'] + '">' + __as[input.id]['options'][i].name + '</span>') ;			
		}			
		
		if (__as[input.id]['options'].length > 0 && __as[input.id]['selectedIndex'] == -1 ) {
			selectOption( input.id, 0 ) ; 
		} 
		else {
			selectOption( input.id, __as[input.id]['selectedIndex'] ) ;
		}
		
		// if there is an item selected, block the normal event triggers
		$("input#" + input.id ).keydown( function(event) {
			if ( __as[input.id]['visibility']  == 'visible' ) {
				preventDefault( event ) ;	 
				} 
			}
		) ;
		
		var span =$("span." + __as[input.id]['sugSpanName']) ;
		$(span).mouseover( function() {
			var index = $(span).index($(this)) ;
			selectOption ( input.id, index ) ; 
		} ) ;

		$(span).mouseout( function() {
			$(this).removeClass("selected") ;
			__as[input.id]['selectedIndex'] = -1 ;  
		//	selectOption( input.id, 0 ) ; 
		} ) ;

		
		$(span).click( function() {
			var index = $(span).index($(this)) ;
			input.value = suggestions[index] ;  
			hideOptions(input.id) ; 
		} ) ; 
				
		
		switch (event.keyCode) {
	        case 38:    // up arrow
	        	selectOption( input.id, __as[input.id]['selectedIndex'] - 1 ) ; 
	        	break ;
	        case 40:    // down arrow
	        	selectOption( input.id, __as[input.id]['selectedIndex'] + 1 ) ;
	        	break ; 
	        case 9:     // tab
	        	input.value = suggestions[ __as[input.id]['selectedIndex'] ] ;
	        	hideOptions(input.id) ; 
	        	break ; 	        	
	        case 27:    // esc
	        	hideOptions(input.id) ; 
	        	break ;
	        case 13:    // enter
	        	input.value = suggestions[ __as[input.id]['selectedIndex'] ] ;
	        	hideOptions(input.id) ; 
	        	break ;
		}
	}

	/** for a selected set of keys pressed it blinds the default trigger
	 * 
	 * @param event
	 * @return
	 */
	function preventDefault(event) {
		switch (event.keyCode) {
	        case 38:    // up arrow
	        case 40:    // down arrow
	        case 9:     // tab
	        case 27:    // esc
	        case 13:    // enter
	        	event.preventDefault() ;
	        	break ;
		}
	}
	
	/**
	 * hides the options div.
	 * 
	 * @param inputId Id of the input element to which hide the options for
	 * @return
	 */
	function hideOptions(inputId) {
		var sugDiv = $(__as[inputId]['sugDiv']) ;
		__as[inputId]['visibility'] = 'hidden' ;
	    __as[inputId]['display'] = 'none' ;	     
	    sugDiv.css('visibility' ,__as[inputId]['visibility'] ) ;
	    sugDiv.css('display' ,__as[inputId]['display'] ) ;
	    __as[inputId] = null ; 
	}
	 
	/*** selects and highlights an option from the suggestions */
	function selectOption(id, index) {
		if ( index < 0) { index = 0 ; }
		if ( index >= __as[id]['options'].length) { index = __as[id]['options'].length - 1 ; }
			
		__as[id]['selectedIndex'] = index ; 
		if ( __as[id]['selectedIndex'] >= 0 ) {
			$("span." + __as[id]['sugSpanName']).removeClass("selected");
			$("span." + __as[id]['sugSpanName'] + ":nth-child(" + (__as[id]['selectedIndex'] + 1) +")").addClass("selected" );
		} 
	}
	

	/**  ########################## End of Autocomplete functions ############################# */