;(function($){
	var configBtn = function(ele, grid) {
		this.$el  		= ele;
		this.grid 		= grid;
		this.contentDiv = null;
		grid.datagrid('options').columns && this.loadData(grid);
	}
	configBtn.prototype = {
		constructor:configBtn,
		modifyGridColumn:function($li,$ckbox){
			this.grid.datagrid($ckbox.attr("checked")? 'showColumn': 'hideColumn',$li.attr('name'));
		},
		loadData: function(grid){
		    	 var obj,i= 0,
		    	 	 thiz = this , 
		    	 	 ul   = $('<ul class="list-setting"></ul>'),
		    	     data = (grid.datagrid('options').columns)[0] ;
		    	 if(!data.length ) return $(this);   
		    	 
		    	 for( ; data[i]; i++){
		    		 obj = data[i];
		    		 obj 
		    		 && obj.configShow
	    		 	 && obj.field
	    		 	 &&	ul.append($("<li></li>")
	    		 		.attr("id",obj.field + "_li" || '')
	    		 		.attr("name",obj.field || '')
	    		        .append('<input type="checkbox" '
	    		        		+ ( !obj.hidden ? 'checked=\'checked\'': '')
	    		        		+'> <span>'
	    		        		+(obj.title || '')
	    		        		+'</span>'));
		    	 }
		    	 this.contentDiv = ul.wrap("<div class=\"list-setting\"></div>");
		    	 this.$el.append(this.contentDiv);
		    	 setTimeout(function(){
		    		 thiz.$el.find("li").find('input:eq(0)').bind('click',function(){
			    			$(this).attr("checked",$(this).attr("checked") ? false :"checked");
			    	 });
		    		thiz.$el.mouseenter(function(){
			    		thiz.contentDiv.stop(true,true).show(11);
			    	}).mouseleave(function(){
			    		thiz.contentDiv.stop(true,true).hide(11);
			    	}).find("li").bind('click',function(){
			    		var ckbox = $(this).find('input:eq(0)');
		    			ckbox.attr("checked",ckbox.attr("checked") ? false :"checked");
		    			thiz.modifyGridColumn($(this),ckbox);
			    	});
		    	},0);
		    	return $(this);
		}
	};
	$.fn.configBtn = function(data) {
	    return new configBtn(this, data || null);
	};
})($,document);
