;(function($){
    $.fn.extend({
        getByteLength:function(strIN){
            var i,cnt=0;

            if(strIN != null && typeof(strIN)!='undefined'){
                for(i=0;i<strIN.length;i++){
                    if(escape(strIN.charAt(i)).length>=4){
                        cnt+=2
                    }else{
                        cnt++
                    }
                }
            }
            return cnt
        }
    });

    $.fn.extend({
        getIndexByByte:function(strIN,limit){

            if(strIN != null && typeof(strIN)!='undefined'){

                var i,cnt=0;for(i=0;i<strIN.length;i++){
                    if(escape(strIN.charAt(i)).length>=4){
                        cnt+=2
                    }else{
                        cnt++
                    }if(cnt>limit){
                        return[true,i]
                    }
                }
            }
            return false
        }
    });

    $.fn.extend({
        finalselect:function(options){
            var settings={
                id:null,
                animalSpeed:100,
                selectWidth:"120px",
                selectHeight:"24px",
                selectImage:"image/select.png",
                selectText:"Language",
                zIndex:0,
                viewHeight:"100px",
                viewWidth:"300px",
                viewMouseoverColor:"#cfdfff",
                viewTop:"28px",
                viewLeft:"10px"
            };


            if(typeof(options)!='undefined'){
                jQuery.extend(settings,options)
            }

            var tmp='<div id="'+settings.id+'-select" style="cursor:pointer;font-size:12px;z-index:'+settings.zIndex;
            tmp+= ';border: solid 0px #999';
            tmp+= ';padding: 3px; width: 120px;height:'+settings.selectHeight+'; position: relative;">';

            tmp+= '<div id="'+settings.id+'-Text" style="background: url('+settings.selectImage+') no-repeat 0 0; width: '
            tmp+= settings.selectWidth+'; height:'+settings.selectHeight+'; color: Black; padding: 0  0 0 10px;">';

            tmp+= '<div class="textshow">'+settings.selectText+'</div>'
            tmp+= '<div class="valueshow" style="display:none;"></div>'
            tmp+= '</div>'
            tmp+= '<div id="'+settings.id
            tmp+= '-selectshow" style="overflow-y:hidden; overflow-x:hidden; '
            tmp+= 'height:auto ;width:'+settings.viewWidth+'; display:none; position: absolute; left:'
            tmp+= settings.viewLeft + '; top:' + settings.viewTop + '; border: solid 1px #999; "></div></div>';

            var _handler=function(){
                $(this).html(tmp);
                bindArrowClick();
                bindSelectMouseover();
                bindSelectMouseleave()
            };
            var bindArrowClick=function(){
                var tmp=$('#'+settings.id+'-Text');
                
                $("#"+settings.id+'-Text').bind("click",function(e){
                    var obj=$('#'+settings.id+'-selectshow');
                    if(obj.css('display')=='none'){
                        obj.slideDown(settings.animalSpeed,function(){
                            obj.show();
                            obj.css('overflow','hidden');
                            obj.css('overflow-x','hidden')
                        })
                    }else{
                        obj.slideUp(settings.animalSpeed,function(){
                            obj.hide()
                        })
                    }
                })
            };
            var bindItemMouseover=function(){
                var inx=0;

                while($(".selectitem",$("#"+settings.id+"-selectshow")).get(inx)!=null){
                    var item=$(".selectitem",$("#"+settings.id+"-selectshow")).get(inx);
                    $(item).bind("mouseover",function(e){
                        $(this).css('background-color',settings.viewMouseoverColor)
                    });
                    $(item).bind("mouseout",function(e){
                        $(this).css('background-color','#fff')
                    });
                    $(item).bind("click",function(e){
                        var tmpstr=$(".thistext",$(this)).html();
                        var arr=$().getIndexByByte(tmpstr,16);
                        if(arr[0]==true){
                            tmpstr=tmpstr.substring(0,arr[1])+'...'
                        }
                        $(".textshow",$("#"+settings.id+"-Text")).html(tmpstr);
                        document.getElementById(settings.id+'-selectshow').style.display="none";
                        $(".valueshow",$("#"+settings.id+"-Text")).html($(".selectvalue",$(this)).html())
                    });
                    inx++
                }
            };
            var bindSelectMouseover=function(){
                $('#'+settings.id+'-Text').bind("mouseover",function(){
                    if($.browser.msie==false){
                        $('#'+settings.id+'-Text').css("background-position","0 -24px")
                    }
                })
            };
            var bindSelectMouseleave=function(){
                $('#'+settings.id+'-Text').bind("mouseout",function(){
                    if($.browser.msie==false){
                        $('#'+settings.id+'-Text').css("background-position","0 0px")
                    }
                })
            };
            this.setViewTop = function(top){
                $('#'+settings.id+'-selectshow').css('top',top+'px')
            };
            this.setViewLeft = function(left){
                $('#'+settings.id+'-selectshow').css('left',left+'px')
            };
            this.getLength = function(){
                return $('.selectitem',$('#'+settings.id+'-selectshow')).length
            };
            this.onClick = function(functionname){
                $('#'+settings.id+'-selectshow').bind("click",functionname)
            };
            this.getAllItem = function(){
                return $('.selectitem',$('#'+settings.id+'-selectshow'))
            };
            this.addItem = function(itemtext,itemvalue){
                var itemhtml='<div class="selectitem"><div class="selecttext">'+itemtext+'</div><div class="selectvalue" style=" display:none;">'+itemvalue+'</div></div><div>';
                $("#"+settings.id+'-selectshow').html($("#"+settings.id+'-selectshow').html()+itemhtml);
                bindItemMouseover();
            };
            this.removeItem = function(index){
                if($('.selectitem',$('#'+settings.id+'-selectshow')).length>index){
                    $($('.selectitem',$('#'+settings.id+'-selectshow')).get(index)).remove()
                }
            };
            this.getValue = function(){
                return $('.valueshow',$('#'+settings.id+'-Text')).html()
            };
            this.getText = function(){
                return $('.textshow',$('#'+settings.id+'-Text')).html()
            };
            return this.each(_handler)
        }
    })
})(jQuery);
