/*! verify-v0.1.1 mit license by 大熊*/


;(function($, window, document,undefined) {
	
	//定义code的构造函数
    var code = function(ele, opt) {
        this.$element = ele,
        this.defaults = {
        	type : 1,
        	figure : 100,	//位数，仅在type=2时生效
        	arith : 0,	//算法，支持加减乘，0为随机，仅在type=2时生效
        	width : '200px',
		    height : '60px',
		    fontsize : '30px',
        	codelength : 6,
        	btnid : 'check-btn',
        	ready : function(){},
        	success : function(){},
            error : function(){}
        },
        this.options = $.extend({}, this.defaults, opt)
    };
    
    var _code_chars = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
    var _code_color1 = ['#fffff0', '#f0ffff', '#f0fff0', '#fff0f0'];
    var _code_color2 = ['#ff0033', '#006699', '#993366', '#ff9900', '#66cc66', '#ff33cc'];
    
    //定义code的方法
    code.prototype = {
    	init : function() {
			
			var _this = this;
			
			this.loaddom();
			this.setcode();
			
			this.options.ready();
			
			this.$element[0].onselectstart = document.body.ondrag = function(){ 
				return false; 
			};
			
			//点击验证码
			this.$element.find('.verify-code, .verify-change-code').on('click', function() {
				_this.setcode();
			});
			
			//确定的点击事件
			this.htmldoms.code_btn.on('click', function() {
				_this.checkcode();
			})
			
    	},
    	
    	//加载页面
    	loaddom : function() {
    		var panelhtml = '<div class="cerify-code-panel"><div class="verify-code"></div><div class="verify-code-area"><div class="verify-input-area"><input type="text" class="varify-input-code" /></div><div class="verify-change-area"><a class="verify-change-code">换一张</a></div></div></div>';
        	this.$element.append(panelhtml);
        	
        	this.isend = false;
        	
        	this.htmldoms = {
        		code_btn : $('#'+this.options.btnid),
        		code : this.$element.find('.verify-code'),
        		code_area : this.$element.find('.verify-code-area'),
        		code_input : this.$element.find('.varify-input-code'),
        	};
        	
        	this.htmldoms.code.css({'width':this.options.width, 'height':this.options.height,'line-height':this.options.height, 'font-size':this.options.fontsize});
        	this.htmldoms.code_area.css({'width':this.options.width});
    	},
    	
    	
    	//设置验证码
    	setcode : function() {
    		if(this.isend == false) {
    			
	    		var color1num = math.floor(math.random() * 3);
	    		var color2num = math.floor(math.random() * 5);
	    		
	    		this.htmldoms.code.css({'background-color': _code_color1[color1num], 'color': _code_color2[color2num]});
	    		this.htmldoms.code_input.val('');
	    		
	    		var code = '';
	    		this.code_chose = '';
	    		
	    		if(this.options.type == 1) {		//普通验证码
					for(var i = 0; i < this.options.codelength; i++) {
						var charnum = math.floor(math.random() * 52);
						var tmpstyle = (charnum%2 ==0)? "font-style:italic;margin-right: 10px;":"font-weight:bolder;";
						tmpstyle += (math.floor(math.random() * 2) == 1)? "font-weight:bolder;":"";
						
						this.code_chose += _code_chars[charnum];
						code += '<font style="'+tmpstyle+'">'+_code_chars[charnum]+'</font>';
					}
	    		}else {		//算法验证码
	    			
	    			var num1 = math.floor(math.random() * this.options.figure);
	    			var num2 = math.floor(math.random() * this.options.figure);
	    			
	    			if(this.options.arith == 0) {
	    				var tmparith = math.floor(math.random() * 3);
	    			}
	    			
	    			switch(tmparith) {
	    				case 1 :
	    					this.code_chose = parseint(num1) + parseint(num2);
	    					code = num1 + ' + ' + num2 + ' = ?';
	    					break;
	    				case 2 :
	    					if(parseint(num1) < parseint(num2)) {
	    						var tmpnum = num1;
	    						num1 = num2;
	    						num2 = tmpnum;
	    					}
	    					this.code_chose = parseint(num1) - parseint(num2);
	    					code = num1 + ' - ' + num2 + ' = ?';
	    					break;
	    				default :
	    					this.code_chose = parseint(num1) * parseint(num2);
	    					code = num1 + ' × ' + num2 + ' = ?';
	    					break;
	    			}
	    		}
	    		
	    		this.htmldoms.code.html(code);
    		}
    	},
    	
    	//比对验证码
    	checkcode : function() {
    		if(this.options.type == 1) {		//普通验证码
    			var own_input = this.htmldoms.code_input.val().touppercase();
    			this.code_chose = this.code_chose.touppercase();
    		}else {
    			var own_input = this.htmldoms.code_input.val();
    		}
    		
    		if(own_input == this.code_chose) {
    			this.isend = true;
    			this.options.success(this);
    		}else {
    			this.options.error(this);
    			this.setcode();
    		}
    	},
    	
    	//刷新
    	refresh : function() {
    		this.isend = false;
    		this.$element.find('.verify-code').click();
    	}
    	
    	
    };
    
    
    //定义slide的构造函数
    var slide = function(ele, opt) {
        this.$element = ele,
        this.defaults = {
        	
        	type : 1,
        	mode : 'fixed',	//弹出式pop，固定fixed
        	voffset: 5,
            vspace : 5,
            explain : '向右滑动完成验证',
            imgurl : 'images/',
            imgname : ['1.jpg', '2.jpg'],
            imgsize : {
	        	width: '400px',
	        	height: '200px',
	        },
	        blocksize : {
	        	width: '50px',
	        	height: '50px',
	        },
            circleradius: '10px',
	        barsize : {
	        	width : '400px',
	        	height : '40px',
	        },
            ready : function(){},
        	success : function(){},
            error : function(){}
            
        },
        this.options = $.extend({}, this.defaults, opt)
    };
    
    
    //定义slide的方法
    slide.prototype = {
        
        init: function() {
        	var _this = this;
        	
        	//加载页面
        	this.loaddom();
			_this.refresh();
        	this.options.ready();
        	
        	this.$element[0].onselectstart = document.body.ondrag = function(){ 
				return false; 
			};
        	
        	if(this.options.mode == 'pop')	{
        		this.$element.on('mouseover', function(e){
        			_this.showimg();
	        	});
	        	
	        	this.$element.on('mouseout', function(e){
	        		_this.hideimg();
	        	});
	        	
	        	
	        	this.htmldoms.out_panel.on('mouseover', function(e){
	        		_this.showimg();
	        	});
	        	
	        	this.htmldoms.out_panel.on('mouseout', function(e){
	        		_this.hideimg();
	        	});
        	}
        	
        	//按下
        	this.htmldoms.move_block.on('touchstart', function(e) {
        		_this.start(e);
        	});
        	
        	this.htmldoms.move_block.on('mousedown', function(e) {
        		_this.start(e);
        	});
        	
        	//拖动
            window.addeventlistener("touchmove", function(e) {
            	_this.move(e);
            });

			
            window.addeventlistener("mousemove", function(e) {
				
            	_this.move(e);
            });
            
            //鼠标松开
            window.addeventlistener("touchend", function() {
            	_this.end();
            });
            window.addeventlistener("mouseup", function() {
            	_this.end();
            });
            
            //刷新
            _this.$element.find('.verify-refresh').on('click', function() {
				_this.refresh();
            });
        },
        
        //初始化加载
        loaddom : function() {

        	this.img_rand = math.floor(math.random() * this.options.imgname.length);			//随机的背景图片
			this.status = false;	//鼠标状态
        	this.isend = false;		//是够验证完成
        	this.setsize = this.resetsize(this);	//重新设置宽度高度
			this.pluswidth = 0;
			this.plusheight = 0;
            this.x = 0;
            this.y = 0;
        	var panelhtml = '';
        	var tmphtml = '';
			this.lengthpercent = (parseint(this.setsize.img_width)-parseint(this.setsize.block_width)- parseint(this.setsize.circle_radius) - parseint(this.setsize.circle_radius) * 0.8)/(parseint(this.setsize.img_width)-parseint(this.setsize.bar_height));
        	
        	if(this.options.type != 1) {		//图片滑动
        		
				panelhtml += '<div class="verify-img-out"><div class="verify-img-panel"><div class="verify-refresh" style="z-index:3"><i class="iconfont icon-refresh"></i></div><canvas  class="verify-img-canvas" width="'+this.setsize.img_width+'" height="'+this.setsize.img_height+'"></canvas></div></div>';

				this.pluswidth = parseint(this.setsize.block_width) + parseint(this.setsize.circle_radius) * 2 - parseint(this.setsize.circle_radius) * 0.2;
				this.plusheight = parseint(this.setsize.block_height) + parseint(this.setsize.circle_radius) * 2 - parseint(this.setsize.circle_radius) * 0.2;

				tmphtml = '<canvas class="verify-sub-block"  width="'+this.pluswidth+'" height="'+this.plusheight+'" style="left:0; position:absolute;" ></canvas>';
        	}
        	
			panelhtml += tmphtml+'<div class="verify-bar-area"><span  class="verify-msg">'+this.options.explain+'</span><div class="verify-left-bar"><span  class="verify-msg"></span><div  class="verify-move-block"><i  class="verify-icon iconfont icon-right"></i></div></div></div>';
        	this.$element.append(panelhtml);
        	
        	this.htmldoms = {
        		sub_block : this.$element.find('.verify-sub-block'),
        		out_panel : this.$element.find('.verify-img-out'),
        		img_panel : this.$element.find('.verify-img-panel'),
				img_canvas : this.$element.find('.verify-img-canvas'),
        		bar_area : this.$element.find('.verify-bar-area'),
        		move_block : this.$element.find('.verify-move-block'),
        		left_bar : this.$element.find('.verify-left-bar'),
        		msg : this.$element.find('.verify-msg'),
        		icon : this.$element.find('.verify-icon'),
        		refresh :this.$element.find('.verify-refresh')
        	};
        	
        	
        	this.$element.css('position', 'relative');
        	if(this.options.mode == 'pop') {
        		this.htmldoms.out_panel.css({'display': 'none', 'position': 'absolute', 'bottom': '42px'});
        		this.htmldoms.sub_block.css({'display': 'none'});
        	}else {
        		this.htmldoms.out_panel.css({'position': 'relative'});
        	}
        	
			this.htmldoms.out_panel.css('height', parseint(this.setsize.img_height) + this.options.vspace + 'px');
			this.htmldoms.img_panel.css({'width': this.setsize.img_width, 'height': this.setsize.img_height});
			this.htmldoms.bar_area.css({'width': this.setsize.bar_width, 'height': this.setsize.bar_height, 'line-height':this.setsize.bar_height});
        	this.htmldoms.move_block.css({'width': this.setsize.bar_height, 'height': this.setsize.bar_height});
        	this.htmldoms.left_bar.css({'width': this.setsize.bar_height, 'height': this.setsize.bar_height});
  
        	this.randset();
        },
        
		drawimg: function(obj, img) {
			
	       	var canvas = this.htmldoms.img_canvas[0];
			if(canvas) {
				var ctx=canvas.getcontext("2d");
				ctx.drawimage(img,0,0, parseint(this.setsize.img_width), parseint(this.setsize.img_height));

				graphparameter = {
					x : this.x,
					y : this.y,
					r : parseint(this.setsize.circle_radius),
					w : (parseint(this.setsize.block_width) - 2 * parseint(this.setsize.circle_radius)) / 2,
					h :	(parseint(this.setsize.block_height) - 2 * parseint(this.setsize.circle_radius)) / 2
				};
				
				obj.drawrule(ctx, graphparameter);
			}
			
			var canvas2 = this.htmldoms.sub_block[0];
			if(canvas2) {
				var proportionx = img.width/parseint(this.setsize.img_width);
				var proportiony = img.height/parseint(this.setsize.img_height);

				var ctx2=canvas2.getcontext("2d");

				ctx2.restore();
				ctx2.drawimage(img,this.x * proportionx, (this.y - parseint(this.setsize.circle_radius) - parseint(this.setsize.circle_radius) * 0.8) * proportiony,this.pluswidth * proportionx,this.plusheight * proportiony,0,0,this.pluswidth,this.plusheight);
				ctx2.save();
				ctx2.globalcompositeoperation = "destination-atop";
				
				graphparameter.x = 0;
				graphparameter.y = parseint(this.setsize.circle_radius) + parseint(this.setsize.circle_radius) * 0.8;
				obj.drawrule(ctx2, graphparameter);
			}
		},

		drawrule:function(ctx, graphparameter) {
			var x = graphparameter.x;
            var y = graphparameter.y;
            var r = graphparameter.r
            var w = graphparameter.w
            var h = graphparameter.h
  
            ctx.beginpath();
			ctx.moveto(x, y);
			ctx.lineto((x + w) + r * 0.4, y);
			ctx.arc((x + w) + r, y - r * 0.8, r, 0.7 * math.pi, 0.3 * math.pi);
			ctx.lineto((x + (2 * w) + (2 * r)), y);
			ctx.lineto((x + (2 * w) + (2 * r)), y + h);
			ctx.arc((x + (2 * w) + (2 * r)) + (r * 0.8), y + h + r, r, 1.2*math.pi, 0.8*math.pi);
			ctx.lineto((x + (2 * w) + (2 * r)), y + (2 * h) + (2 * r));
			ctx.lineto(x, y + (2 * h) + (2 * r));
			ctx.lineto(x, y + h + 2 * r - r * 0.4);
			ctx.arc(x + (r * 0.8), y + h + r, r, 0.8 * math.pi, 1.2 * math.pi, true);
			ctx.lineto(x, y);

            ctx.fillstyle="#fff";
			ctx.fill();
			ctx.closepath();
		},


        //鼠标按下
        start: function(e) {
        	if(this.isend == false) {
	        	this.htmldoms.msg.text('');
	        	this.htmldoms.move_block.css('background-color', '#337ab7');
	        	this.htmldoms.left_bar.css('border-color', '#337ab7');
	        	this.htmldoms.icon.css('color', '#fff');
	        	e.stoppropagation();
	        	this.status = true;
        	}
        },
        
        //鼠标移动
        move: function(e) {
        	if(this.status && this.isend == false) {
				if(this.options.mode == 'pop')	{
        			this.showimg();
				}
        		
	            if(!e.touches) {    //兼容移动端
	                var x = e.clientx;
	            }else {     //兼容pc端
	                var x = e.touches[0].pagex;
	            }
	            var bar_area_left = slide.prototype.getleft(this.htmldoms.bar_area[0]);
                var move_block_left = x - bar_area_left; //小方块相对于父元素的left值


	            if(this.options.type != 1) {		//图片滑动
					if(move_block_left >= (this.htmldoms.bar_area[0].offsetwidth - parseint(this.setsize.bar_height) + parseint(parseint(this.setsize.block_width)/2) - 2) ) {
	                	move_block_left = (this.htmldoms.bar_area[0].offsetwidth - parseint(this.setsize.bar_height) + parseint(parseint(this.setsize.block_width)/2)- 2);
	            	}
	            }else {		//普通滑动
	            	if(move_block_left >= this.htmldoms.bar_area[0].offsetwidth - parseint(parseint(this.setsize.bar_height)/2) + 3) {
	            		this.$element.find('.verify-msg:eq(1)').text('松开验证');
	                	move_block_left = this.htmldoms.bar_area[0].offsetwidth - parseint(parseint(this.setsize.bar_height)/2) + 3;
	            	}else {
	            		this.$element.find('.verify-msg:eq(1)').text('');
	            	}
	            }

	            if(move_block_left <= parseint(parseint(this.setsize.block_width)/2)) {
            		move_block_left = parseint(parseint(this.setsize.block_width)/2);
            	}
				
	            
	            //拖动后小方块的left值
	            this.htmldoms.move_block.css('left', move_block_left-parseint(parseint(this.setsize.block_width)/2) + "px");
	            this.htmldoms.left_bar.css('width', move_block_left-parseint(parseint(this.setsize.block_width)/2) + "px");
				this.htmldoms.sub_block.css('left', (move_block_left-parseint(parseint(this.setsize.block_width)/2)) * this.lengthpercent + "px");
				
	        }
        },
        
        //鼠标松开
        end: function() {
        	
        	var _this = this;
        	
        	//判断是否重合
        	if(this.status  && this.isend == false) {
        		
        		if(this.options.type != 1) {		//图片滑动
        			
        			var voffset = parseint(this.options.voffset);

		            if(parseint(this.x) >= (parseint(this.htmldoms.sub_block.css('left')) - voffset) && parseint(this.x) <= (parseint(this.htmldoms.sub_block.css('left')) + voffset)) {
		            	this.htmldoms.move_block.css('background-color', '#5cb85c');
		            	this.htmldoms.left_bar.css({'border-color': '#5cb85c', 'background-color': '#fff'});
		            	this.htmldoms.icon.css('color', '#fff');
		            	this.htmldoms.icon.removeclass('icon-right');
		            	this.htmldoms.icon.addclass('icon-check');
		            	this.htmldoms.refresh.hide();
		            	this.isend = true;
		            	this.options.success(this);
		            }else{
		            	this.htmldoms.move_block.css('background-color', '#d9534f');
		            	this.htmldoms.left_bar.css('border-color', '#d9534f');
		            	this.htmldoms.icon.css('color', '#fff');
		            	this.htmldoms.icon.removeclass('icon-right');
		            	this.htmldoms.icon.addclass('icon-close');
		            	
		            	
		            	settimeout(function () { 
					    	_this.refresh();
					    }, 400);
		            	
		            	this.options.error(this);
		            }
        			
        		}else {		//普通滑动
        			
        			if(parseint(this.htmldoms.move_block.css('left')) >= (parseint(this.setsize.bar_width) - parseint(this.setsize.bar_height) - parseint(this.options.voffset))) {
        				this.htmldoms.move_block.css('background-color', '#5cb85c');
        				this.htmldoms.left_bar.css({'color': '#4cae4c', 'border-color': '#5cb85c', 'background-color': '#fff' });
        				this.htmldoms.icon.css('color', '#fff');
		            	this.htmldoms.icon.removeclass('icon-right');
		            	this.htmldoms.icon.addclass('icon-check');
		            	this.htmldoms.refresh.hide();
        				this.$element.find('.verify-msg:eq(1)').text('验证成功');
        				this.isend = true;
        				this.options.success(this);
        			}else {
        				this.$element.find('.verify-msg:eq(1)').text('');
        				this.htmldoms.move_block.css('background-color', '#d9534f');
		            	this.htmldoms.left_bar.css('border-color', '#d9534f');
		            	this.htmldoms.icon.css('color', '#fff');
		            	this.htmldoms.icon.removeclass('icon-right');
		            	this.htmldoms.icon.addclass('icon-close');
		            	this.isend = true;
		            	
		            	settimeout(function () { 
		            		_this.$element.find('.verify-msg:eq(1)').text('');
					    	_this.refresh();
					    	_this.isend = false;
					    }, 400);
		            	
		            	this.options.error(this);
        			}
        		}
        		
	            this.status = false;
        	}
        },
        
        //弹出式
        showimg : function() {
        	this.htmldoms.out_panel.css({'display': 'block'});
        	this.htmldoms.sub_block.css({'display': 'block'});
        },
        
        //固定式
        hideimg : function() {
        	this.htmldoms.out_panel.css({'display': 'none'});
        	this.htmldoms.sub_block.css({'display': 'none'});
        },
        
        
        resetsize : function(obj) {
        	var img_width,img_height,bar_width,bar_height,block_width,block_height,circle_radius;	//图片的宽度、高度，移动条的宽度、高度
        	var parentwidth = obj.$element.parent().width() || $(window).width();
        	var parentheight = obj.$element.parent().height() || $(window).height();
        	
       		if(obj.options.imgsize.width.indexof('%')!= -1){
        		img_width = parseint(obj.options.imgsize.width)/100 * parentwidth + 'px';
		　　}else {
				img_width = obj.options.imgsize.width;
			}
		
			if(obj.options.imgsize.height.indexof('%')!= -1){
        		img_height = parseint(obj.options.imgsize.height)/100 * parentheight + 'px';
		　　}else {
				img_height = obj.options.imgsize.height;
			}
		
			if(obj.options.barsize.width.indexof('%')!= -1){
        		bar_width = parseint(obj.options.barsize.width)/100 * parentwidth + 'px';
		　　}else {
				bar_width = obj.options.barsize.width;
			}
		
			if(obj.options.barsize.height.indexof('%')!= -1){
        		bar_height = parseint(obj.options.barsize.height)/100 * parentheight + 'px';
		　　}else {
				bar_height = obj.options.barsize.height;
			}
			
			if(obj.options.blocksize) {
				if(obj.options.blocksize.width.indexof('%')!= -1){
					block_width = parseint(obj.options.blocksize.width)/100 * parentwidth + 'px';
			　　}else {
					block_width = obj.options.blocksize.width;
				}
				
			
				if(obj.options.blocksize.height.indexof('%')!= -1){
					block_height = parseint(obj.options.blocksize.height)/100 * parentheight + 'px';
			　　}else {
					block_height = obj.options.blocksize.height;
				}
			}

			if(obj.options.circleradius) {
				if(obj.options.circleradius.indexof('%')!= -1){
					circle_radius = parseint(obj.options.circleradius)/100 * parentheight + 'px';
			　　}else {
					circle_radius = obj.options.circleradius;
				}
			}
		
			return {img_width : img_width, img_height : img_height, bar_width : bar_width, bar_height : bar_height, block_width : block_width, block_height : block_height, circle_radius : circle_radius};
       	},
        
        //随机出生点位
        randset: function() {
        	var rand1 = math.floor(math.random()*9+1);
        	var rand2 = math.floor(math.random()*9+1);
        	var top = rand1 * parseint(this.setsize.img_height)/15 + parseint(this.setsize.img_height) * 0.1;
        	var left = rand2 * parseint(this.setsize.img_width)/15 + parseint(this.setsize.img_width) * 0.1;
  
            this.x = left;
            this.y = top;

  
            if(this.options.mode == 'pop') {
                this.htmldoms.sub_block.css({'top': '-'+(parseint(this.setsize.img_height) + this.options.vspace +  parseint(this.setsize.circle_radius) + parseint(this.setsize.circle_radius) * 0.8 - this.y - 2) +'px'});
            }else {
                this.htmldoms.sub_block.css({'top': this.y - (parseint(this.setsize.circle_radius) + parseint(this.setsize.circle_radius) * 0.8) + 2 + 'px'});
            }
  
  
        },
        
        //刷新
        refresh: function() {
			var _this = this;
        	this.htmldoms.refresh.show();
        	this.$element.find('.verify-msg:eq(1)').text('');
        	this.$element.find('.verify-msg:eq(1)').css('color', '#000');
        	this.htmldoms.move_block.animate({'left':'0px'}, 'fast');
			this.htmldoms.left_bar.animate({'width': parseint(this.setsize.bar_height)}, 'fast');
			this.htmldoms.left_bar.css({'border-color': '#ddd'});
			
			this.htmldoms.move_block.css('background-color', '#fff');
			this.htmldoms.icon.css('color', '#000');
			this.htmldoms.icon.removeclass('icon-close');
			this.htmldoms.icon.addclass('icon-right');
			this.$element.find('.verify-msg:eq(0)').text(this.options.explain);
        	
        	this.randset();
        	this.img_rand = math.floor(math.random() * this.options.imgname.length); //随机的背景图片
 
			var img = new image();
		    //img.src = this.options.imgurl + this.options.imgname[this.img_rand];
		    
			//自定义验证码的图片路径
		    img.src = verifypath + this.options.imgname[this.img_rand];
		 	
		    // 加载完成开始绘制
		 	$(img).on('load', function(e) {
        		_this.drawimg(_this, this);
        	});
			
			this.isend = false;

			this.htmldoms.sub_block.css('left', "0px");
        },
        
        //获取left值
        getleft: function(node) {
			var left = $(node).offset().left;
//            var left = 0;
//            var nowpos = node.offsetparent;
//
//            while(nowpos != null) {
//              left += $(nowpos).offset().left;
//              nowpos = nowpos.offsetparent;
//            }
            return left;
        }
    };
    
    
    //定义points的构造函数
    var points = function(ele, opt) {
        this.$element = ele,
        this.defaults = {
        	mode : 'fixed',	//弹出式pop，固定fixed
        	defaultnum : 4,	//默认的文字数量
		    checknum : 3,	//校对的文字数量
		    vspace : 5,	//间隔
		    imgurl : 'images/',
        	imgname : ['1.jpg', '2.jpg'],
        	imgsize : {
	        	width: '400px',
	        	height: '200px',
	        },
	        barsize : {
	        	width : '400px',
	        	height : '40px',
	        },
	        ready : function(){},
        	success : function(){},
            error : function(){}
        },
        this.options = $.extend({}, this.defaults, opt)
    };
    
    //定义points的方法
    points.prototype = {
    	init : function() {
			
			var _this = this;
			
			//加载页面
        	_this.loaddom();
        	 
        	_this.refresh();
        	_this.options.ready();
        	
        	this.$element[0].onselectstart = document.body.ondrag = function(){ 
				return false; 
			};
			
			
			if(this.options.mode == 'pop')	{
        		this.$element.on('mouseover', function(e){
        			_this.showimg();
	        	});
	        	
	        	this.$element.on('mouseout', function(e){
	        		_this.hideimg();
	        	});
	        	
	        	
	        	this.htmldoms.out_panel.on('mouseover', function(e){
	        		_this.showimg();
	        	});
	        	
	        	this.htmldoms.out_panel.on('mouseout', function(e){
	        		_this.hideimg();
	        	});
        	}
			
        	
		 	//点击事件比对
        	_this.$element.find('.verify-img-panel canvas').on('click', function(e) {
        		
				_this.checkposarr.push(_this.getmousepos(this, e));
				
				if(_this.num == _this.options.checknum) {
					
					_this.num = _this.createpoint(_this.getmousepos(this, e));
					settimeout(function () { 
						var flag = _this.comparepos(_this.fontpos, _this.checkposarr);
						
						if(flag == false) {	//验证失败
							
							_this.options.error(_this);
							_this.$element.find('.verify-bar-area').css({'color': '#d9534f', 'border-color': '#d9534f'});
						    _this.$element.find('.verify-msg').text('验证失败');
							
							settimeout(function () { 
								_this.$element.find('.verify-bar-area').css({'color': '#000','border-color': '#ddd'});
						    	_this.refresh();
						    }, 400);
							
						}else {	//验证成功
							_this.$element.find('.verify-bar-area').css({'color': '#4cae4c', 'border-color': '#5cb85c'});
							_this.$element.find('.verify-msg').text('验证成功');
							_this.$element.find('.verify-refresh').hide();
							_this.$element.find('.verify-img-panel').unbind('click');
							_this.options.success(_this);
						}
					}, 400);
					
				}
				
				if(_this.num < _this.options.checknum) {
					_this.num = _this.createpoint(_this.getmousepos(this, e));
				}

        	});
        	
        	 //刷新
            _this.$element.find('.verify-refresh').on('click', function() {
            	_this.refresh();
            });
        	
    	},
    	
    	
    	
    	//加载页面
    	loaddom : function() {
    		
    		this.fontpos = [];	//选中的坐标信息
    		this.checkposarr = [];	//用户点击的坐标
    		this.num = 1;	//点击的记数
    		this.img_rand = math.floor(math.random() * this.options.imgname.length); //随机的背景图片
    		
        	var panelhtml = '';
        	var tmphtml = '';
        	
        	this.setsize = slide.prototype.resetsize(this);	//重新设置宽度高度
        	
        	panelhtml += '<div class="verify-img-out"><div class="verify-img-panel"><div class="verify-refresh" style="z-index:3"><i class="iconfont icon-refresh"></i></div><canvas width="'+this.setsize.img_width+'" height="'+this.setsize.img_height+'"></canvas></div></div><div class="verify-bar-area"><span  class="verify-msg"></span></div>';
        	
        	this.$element.append(panelhtml);
        	
        	
        	this.htmldoms = {
        		out_panel : this.$element.find('.verify-img-out'),
        		img_panel : this.$element.find('.verify-img-panel'),
        		bar_area : this.$element.find('.verify-bar-area'),
        		msg : this.$element.find('.verify-msg'),
        	};
        	
        	this.$element.css('position', 'relative');
        	if(this.options.mode == 'pop') {
        		this.htmldoms.out_panel.css({'display': 'none', 'position': 'absolute', 'bottom': '42px'});
        	}else {
        		this.htmldoms.out_panel.css({'position': 'relative'});
        	}
        	
        	this.htmldoms.out_panel.css('height', parseint(this.setsize.img_height) + this.options.vspace + 'px');
    		this.htmldoms.img_panel.css({'width': this.setsize.img_width, 'height': this.setsize.img_height, 'background-size' : this.setsize.img_width + ' '+ this.setsize.img_height, 'margin-bottom': this.options.vspace + 'px'});
    		this.htmldoms.bar_area.css({'width': this.options.barsize.width, 'height': this.setsize.bar_height, 'line-height':this.setsize.bar_height});
    		
    	},
    	
    	//绘制合成的图片
    	drawimg : function(obj, img) {
    		//准备canvas环境 
	       	var canvas = this.$element.find('canvas')[0];
	      	//var canvas=document.getelementbyid("mycanvas");
	       	var ctx=canvas.getcontext("2d");
	       	
	       	// 绘制图片
	       	ctx.drawimage(img,0,0, parseint(this.setsize.img_width), parseint(this.setsize.img_height));
	       	
	       	// 绘制水印
	       	var fontsizearr = ['italic small-caps bold 20px microsoft yahei', 'small-caps normal 25px arial', '34px microsoft yahei'];
	       	var fontstr = '天地玄黄宇宙洪荒日月盈昃辰宿列张寒来暑往秋收冬藏闰余成岁律吕调阳云腾致雨露结为霜金生丽水玉出昆冈剑号巨阙珠称夜光果珍李柰菜重芥姜海咸河淡鳞潜羽翔龙师火帝鸟官人皇始制文字乃服衣裳推位让国有虞陶唐吊民伐罪周发殷汤坐朝问道垂拱平章爱育黎首臣伏戎羌遐迩体率宾归王';	//不重复的汉字
	       	
	       	
	       	var fontchars = [];
	       	
	       	var avg = math.floor(parseint(this.setsize.img_width)/(parseint(this.options.defaultnum)+1));
	       	var tmp_index = '';
	       	var color2num = math.floor(math.random() * 5);
	       	
	       	for(var i = 1; i <= this.options.defaultnum; i++) {
	       		
	       		fontchars[i-1] = this.getchars(fontstr, fontchars);
	       		
	       		tmp_index = math.floor(math.random()*3);
	       		ctx.font = fontsizearr[tmp_index];
		       	ctx.fillstyle = _code_color2[color2num];
		       	
		       	if(math.floor(math.random() * 2) == 1) {
		       		var tmp_y = math.floor(parseint(this.setsize.img_height)/2) + tmp_index*20 + 20;
		       	}else {
		       		var tmp_y = math.floor(parseint(this.setsize.img_height)/2) - tmp_index*20;
		       	}
		       	
		       	ctx.filltext(fontchars[i-1],avg * i, tmp_y);
		       	this.fontpos[i-1] = {'char': fontchars[i-1], 'x': avg * i, 'y': tmp_y};
		       	
	       	}
	       	
	       	for(var i = 0; i < (this.options.defaultnum-this.options.checknum); i++) {
	       		this.shuffle(this.fontpos).pop();
	       	}
	       	
	       	var msgstr = '';
	       	for(var i = 0; i < this.fontpos.length; i++) {
	       		msgstr += this.fontpos[i].char + ',';
	       	}
	       	
	       	this.htmldoms.msg.text('请顺序点击【' + msgstr.substring(0,msgstr.length-1) + '】');
	       	
	       	return this.fontpos;
    	},
    	
    	//获取坐标
    	getmousepos :function(obj, event) {
            var e = event || window.event;
            var scrollx = document.documentelement.scrollleft || document.body.scrollleft;
            var scrolly = document.documentelement.scrolltop || document.body.scrolltop;
            var x = e.clientx - ($(obj).offset().left - $(window).scrollleft());
    		var y = e.clienty - ($(obj).offset().top - $(window).scrolltop());
    		
            return {'x': x, 'y': y};
     	},
     	
     	//递归去重
     	getchars : function(fontstr, fontchars) {
     		
     		var tmp_rand = parseint(math.floor(math.random() * fontstr.length));
     		if(tmp_rand > 0) {
     			tmp_rand = tmp_rand - 1;
     		}
     		
     		tmp_char = fontstr.charat(tmp_rand);
       		if($.inarray(tmp_char, fontchars) == -1) {
       			return tmp_char;
       		}else {
       			return points.prototype.getchars(fontstr, fontchars);
       		}
     	},
		
     	//洗牌数组
       	shuffle : function(arr) {
			var m = arr.length, i;
			var tmpf;
			while (m) {
				i = (math.random() * m--) >>> 0;
				tmpf = arr[m];
				arr[m] = arr[i];
				arr[i] = tmpf;
				//[arr[m], arr[i]] = [arr[i], arr[m]];	//低版本浏览器不支持此写法
			}
			return arr;
		},
       	
       	//创建坐标点
       	createpoint : function (pos) {
       		this.htmldoms.img_panel.append('<div class="point-area" style="background-color:#1abd6c;color:#fff;z-index:9999;width:30px;height:30px;text-align:center;line-height:30px;border-radius: 50%;position:absolute;top:'+parseint(pos.y-10)+'px;left:'+parseint(pos.x-10)+'px;">'+this.num+'</div>');
       		return ++this.num;
       	},
       	
       	//比对坐标点
       	comparepos : function (fontpos, checkposarr) {
       		
       		var flag = true;
       		for(var i = 0; i < fontpos.length; i++) {
       			if(!(parseint(checkposarr[i].x) + 40 > fontpos[i].x && parseint(checkposarr[i].x) - 40 < fontpos[i].x && parseint(checkposarr[i].y) + 40 > fontpos[i].y && parseint(checkposarr[i].y) - 40 < fontpos[i].y)) {
       				flag = false;
       				break;
       			}
       		}
       		
       		return flag;
       	},
       	
       	//弹出式
        showimg : function() {
        	this.htmldoms.out_panel.css({'display': 'block'});
        },
        
        //固定式
        hideimg : function() {
        	this.htmldoms.out_panel.css({'display': 'none'});
        },
       	
       	//刷新
        refresh: function() {
        	var _this = this;
        	this.$element.find('.point-area').remove();
        	this.fontpos = [];
        	this.checkposarr = [];
        	this.num = 1;
        	
        	this.img_rand = math.floor(math.random() * this.options.imgname.length); //随机的背景图片
        	var img = new image();
		    //img.src = this.options.imgurl +this.options.imgname[this.img_rand];
		    
		    //自定义验证码的图片路径
		    img.src = verifypath + this.options.imgname[this.img_rand];
		 	
		 	
		 	// 加载完成开始绘制
		 	$(img).on('load', function(e) {
        		this.fontpos = _this.drawimg(_this, this);
        	});
        	
        	_this.$element.find('.verify-bar-area').css({'color': '#000', 'border-color': '#ddd'});
			_this.$element.find('.verify-msg').text('验证失败');
			_this.$element.find('.verify-refresh').show();
        },
    	
    };
    
    //在插件中使用codeverify对象
    $.fn.codeverify = function(options, callbacks) {
        var code = new code(this, options);
        code.init();
    };
    
    //在插件中使用slideverify对象
    $.fn.slideverify = function(options, callbacks) {
        var slide = new slide(this, options);
        slide.init();
    };
    
    //在插件中使用clickverify对象
    $.fn.pointsverify = function(options, callbacks) {
        var points = new points(this, options);
        points.init();
    };
   
})(jquery, window, document);