﻿    function addSuggestions(lis,tbid)
    {
        lis
            .attr("tbID",tbid)
            .mouseover(function(){
                $(this).css("background-color","#dedede");
            })
            .mouseout(function(){
                $(this).css("background-color","");
            })
            .click(function(){
                $("#"+$(this).attr("tbID")).val($(this).text());
                $(this).parent().remove();
            })
            .each(function(i){
                $("#"+$(this).attr("tbID")+"_suggestions").prepend($(this));
            });
        $("#"+tbid+"_suggestions").prepend("<li>[type in box for unlisted]</li>");
    }
    
    $(document).ready( function() { 
        $(".suggestBox")
            .keypress( function(e){
                if (e.keyCode==13) // enter key - don't want to submit
                {
                    return false;
                }
            })
            .keyup( function(e) { 
            
                if(e.keyCode==40) //down arrow key
                {
                    if($("#"+$(this).attr('id')+"_suggestions").length==0)
                    {
                var arrowwidth = $tb.next().next().width()+6;
                        $(this).after("<ul class='suggestions' id='"+$(this).attr('id')+"_suggestions'></ul>");
                        $("#"+$(this).attr('id')+"_suggestions").width($(this).width()+arrowwidth);
                        $("#"+$(this).attr('id')+"_suggestions").css("left",(findPosX(this))+"px").css("top",($(this).offset().top+$(this).height()+3)+"px");;
                        
                        
                        var text = $(this).val();
                        if(text.length>0)
                        {
                            var genres = $('li',$("#"+$(this).attr("xmlInputID")).html()).attr("matchText",text);
                            
                            var matches = $.grep( genres, function(n,i){
                               return ($(n).text().toLowerCase().indexOf($(n).attr("matchText").toLowerCase())==0);
                             });
                             
                            addSuggestions($(matches),$(this).attr('id'));
                        }
                        else
                        {
                            addSuggestions($('li',$("#"+$(this).attr("xmlInputID")).html()),$(this).attr('id'));
                        }
                    }
                    else
                    {
                        var oldval = parseInt($(this).next().next().val());
                        var newval = oldval+1;
                        if(newval==0)
                          newval = 1; //skip 'type in box' item
                        
                        if(newval<$(this).next().children("li").length)
                        {
                            $(this).next().next().val(newval);
                            $(this).next().children(":eq("+newval+")").css("background-color","#dedede");
                            if(oldval!=-1)
                                $(this).next().children(":eq("+oldval+")").css("background-color","");
                        }
                    }
                }
                else if(e.keyCode==38) //up arrow key
                {
                    if($("#"+$(this).attr('id')+"_suggestions").length!=0)
                    {
                        var oldval = parseInt($(this).next().next().val());
                        var newval = oldval-1;
                        if(newval==0)
                          newval = -1; //skip 'type in box' item
                        
                        if(newval>=-1)
                        {
                            $(this).next().next().val(newval);
                            if(newval!=-1)
                                $(this).next().children(":eq("+newval+")").css("background-color","#dedede");
                            else
                            {
                                $("#"+$(this).attr('id')+"_suggestions").remove();
                            }
                            $(this).next().children(":eq("+oldval+")").css("background-color","");
                        }
                    }
                }
                else if (e.keyCode==13) // enter key
                {
                    var val = parseInt($(this).next().next().val());
                    if(val!=-1)
                    {
                        $(this).val($(this).next().children(":eq("+val+")").text());
                        $(this).next().next().val(-1);
                    }
                    $("#"+$(this).attr('id')+"_suggestions").remove();
                    return false;
                }
                else
                {
                    $(this).next().next().val(-1);
                    $("#"+$(this).attr('id')+"_suggestions").remove();
                    var text = $(this).val();
                    if(text.length>0)
                    {
                var arrowwidth = $tb.next().next().width()+6;
                        var genres = $('li',$("#"+$(this).attr("xmlInputID")).html()).attr("matchText",text);
                        
                        $(this).after("<ul class='suggestions' id='"+$(this).attr('id')+"_suggestions'></ul>");
                        $("#"+$(this).attr('id')+"_suggestions").width($(this).width()+arrowwidth);
                        $("#"+$(this).attr('id')+"_suggestions").css("left",(findPosX(this))+"px").css("top",($(this).offset().top+$(this).height()+3)+"px");;
                        
                        var matches = $.grep( genres, function(n,i){
                           return ($(n).text().toLowerCase().indexOf($(n).attr("matchText").toLowerCase())==0);
                         });
                         
                        addSuggestions($(matches),$(this).attr('id'));
                          
                     }
                 }
            } )
            .focus(function(){
                $(this).attr("hasFocus","true");
            })
            .blur(function(){
                $(this).attr("hasFocus","false");
                setTimeout("if($('#"+$(this).attr('id')+"').attr('hasFocus')=='false'){$('#"+$(this).attr('id')+"_suggestions').remove();}",200);
                
            })
            .after("<a href='#' class='dropButton'>&nbsp;</a>")
            .after("<input type='hidden' value='-1' class='selectedIndex' />")
            ;
            
            $(".dropButton").click(function(){
                var $tb = $(this).prev().prev();
                if($tb.attr("class")=="suggestions")
                {
                    $tb.remove();
                }
                else
                {
                var arrowwidth = $tb.next().next().width()+6;
                    $tb.after("<ul class='suggestions' id='"+$tb.attr('id')+"_suggestions'></ul>");
                    $("#"+$tb.attr('id')+"_suggestions").width($tb.width()+arrowwidth);
                        $("#"+$tb.attr('id')+"_suggestions").css("left",(findPosX($tb[0]))+"px").css("top",($tb.offset().top+$tb.height()+3)+"px");;
                        
                    var text = $tb.val();
                    if(text.length>0)
                    {
                        var genres = $('li',$("#"+$tb.attr("xmlInputID")).html()).attr("matchText",text);
                        
                        var matches = $.grep( genres, function(n,i){
                           return ($(n).text().toLowerCase().indexOf($(n).attr("matchText").toLowerCase())==0);
                         });
                         
                        addSuggestions($(matches),$tb.attr('id'));
                    }
                    else
                    {
                        addSuggestions($('li',$("#"+$tb.attr("xmlInputID")).html()),$tb.attr('id'));
                    }
                    $tb.focus();
                }
                
                return false;
            });
            
    });

