//javascript
var DropDown = function (id){
	var x=this;
	/*Used classes*/
    x.myId = id;
	x.myClass = 'custom-select';
	x.newParent = 'parent-custom-select';
	x.newDiv = 'custom-select-newdiv'; 
	x.output = 'custom-select-output'; 
	x.arrow = 'custopm-select-arrow'; 
	x.selected = 'custom-select-selected';
    x.value = 'custom-select-value';
    x.showed = 'custom-select-show';
	x.valueId = 'inp'+x.myId;
    x.callBack = '';
    x.thisValue = function(){
        return $('#'+x.valueId).val();
    }
    x.addEvent = function(callback){
        x.callBack = callback; 
    }
    x.offsetPosition = function(obj){
        var tmp = {
            x:($(obj).position()).left,
            y:($(obj).position()).top
        };                    
        $(obj).offsetParent().each(
            function(i){
                var tmpTag = $(this,i)[0].tagName;
                if(tmpTag!='BODY' && tmpTag!='HTML'){  
                    tmp.x += ($(this,i).position()).left;
                    tmp.y += ($(this,i).position()).top;
                }
            }
        );
        //alert(tmp.x);
        return tmp;
    }
    x.changeSelected = function(val){
        $('#'+x.myId).children().each(
            function(i){
                if($(this,i)[0].title == val){ 
                    $(this,i).parent().children('.'+x.selected).removeClass(x.selected);
                    $(this,i).addClass(x.selected); 
                    $(this,i).parent().parent().children('.'+x.newDiv).children('.'+x.output).html($(this,i).html());
                    $(this,i).parent().parent().children('.'+x.value).val($(this,i)[0].title);
                }
            }
        );
    }
	/*Used Classes*/
    $('#'+x.myId).addClass(x.myClass);  
	$('#'+x.myId).wrap('<div class="'+x.newParent+'"></div>');
	$('#'+x.myId).each(
		function(i){                                                    
			$(this,i).before('<input style="display:none;" id="'+x.valueId+'" type="hidden" name="'+x.myId+'" class="'+x.value+'" value="" /><div id="'+x.myId+'newDiv" class="'+x.newDiv+'"><div class="'+x.output+'"></div><div class="'+x.arrow+'"><b>Arraor</b></div></div>');
		}
	);
	$('#'+x.myId).children('.'+x.selected).each(
		function(i){            
			$(this,i).parent().parent().children('.'+x.newDiv).children('.'+x.output).html($(this,i).html());
			$(this,i).parent().parent().children('.'+x.value).val($(this,i)[0].title);    
		}
	);
	$('#'+x.myId).parent().children('.'+x.newDiv).click(
		function(){
            if($(this).parent().children('#'+x.myId).is(':visible')){
                //alert('visible');
                $(this).parent().children('#'+x.myId).removeClass(x.showed);
            }
            else{               
                $('.'+x.showed).removeClass(x.showed); 
                $(this).parent().children('#'+x.myId).addClass(x.showed);
                var pos = x.offsetPosition($(this).parent());
                $(this).parent().children('#'+x.myId).css({top:pos.y+$(this).parent().outerHeight(),left:pos.x});
            }                    
		}
	);
    /*$(document).click(
        function(e){
            //alert($(e.target)[0].id);
            //for(i in e) alert(i);
            if($(e.target)[0].id!=x.myId+'newDiv'){
                $('.'+x.showed).removeClass(x.showed); 
            }
        }
    );*/
	$('#'+x.myId).children().click(
		function(){
			$(this).parent().removeClass(x.showed);
			$(this).parent().children('.'+x.selected).removeClass(x.selected);
			$(this).addClass(x.selected);
			$(this).parent().parent().children('.'+x.newDiv).children('.'+x.output).html($(this).html());
			$(this).parent().parent().children('.'+x.value).val($(this)[0].title);
            if(typeof x.callBack == 'function'){
                x.callBack();
            }                                               
		}
	)																													 
}