define(['jquery'],function($){ ? function Rotate(){ ? ? ? ?this.cfg = { ? ? ? ? ? ?rotateBox : null, ? ? ? ? ? ?handle : null ? ? ? ?}; ? ?} ? ?Rotate.prototype = { ? ? ? ?convertAngle : function(a){ ? ? ? ? ? ?return a/Math.PI*180 ? ? ? ?}, ? ? ? ?onMove : function(){ ? ? ? ? ? ?//console.log(this); ? ? ? ? ? ?this.angle2 = this.convertAngle(Math.atan2(this.oy - this.my, this.mx - this.ox)); ? ? ?//計算鼠標(biāo)和元素中心連線 與 水平線夾角 ? ? ? ? ? ?this.angle = this.angle1 - this.angle2 + this.oldDeg; ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?//計算旋轉(zhuǎn)角度 ? ? ? ? ? ?this.rotateBox.css({ ? ? ? ? ? ? ? ?transform : "rotate(" + this.angle + "deg)" ? ? ? ? ? ?}); ? ? ? ?}, ? ? ? ?init : function(cfg){ ? ? ? ? ? ?//console.log(this); ? ? ? ? ? ?$.extend(this.cfg,cfg,{}); ? ? ? ? ? ?this.rotateBox = this.cfg.rotateBox; ? ? ? ? ? ?if(this.cfg.handle){ ? ? ? ? ? ? ? ?this.handle = this.cfg.handle; ? ? ? ? ? ?}else{ ? ? ? ? ? ?} ? ? ? ? ? ?this.handle.mousedown(function(e){ ? ? ? ? ? ? ? ?var e = window.event || e; ? ? ? ? ? ? ? ?this.ox = this.rotateBox.width()/2+this.rotateBox.offset().left; ? ?//計算元素中心坐標(biāo) ? ? ? ? ? ? ? ?this.oy = this.rotateBox.height()/2+this.rotateBox.offset().top; ? ? ? ? ? ? ? ?this.x1 = this.handle.offset().left+this.handle.width()/2; ? ? ? ? ?//計算手柄坐標(biāo) ? ? ? ? ? ? ? ?this.y1 = this.handle.offset().top+this.handle.height()/2; ? ? ? ? ? ? ? ?this.angle1 = this.convertAngle(Math.atan2(this.oy-this.y1,this.x1-this.ox));//計算元素中心和手柄連線 與 水平線夾角 ? ? ? ? ? ? ? ?if(this.rotateBox[0].style.transform){ ? ? ? ? ? ? ? ? ? ?this.oldDeg = Number(this.rotateBox[0].style.transform.slice(7,-4)) % 360; ? ? ?//獲取元素初始角度 ? ? ? ? ? ? ? ?}else{ ? ? ? ? ? ? ? ? ? ?this.oldDeg = 0; ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?this.moving = setInterval(this.onMove.bind(this),40); ? ? ? ? ? ?}.bind(this)); ? ? ? ? ? ?document.addEventListener('mousemove',function(e){ ? ? ? ? ? ? ? ?var e = window.event || e; ? ? ? ? ? ? ? ?this.mx = e.pageX; ? ? ? ? ? ? ? ? ?//獲取移動時鼠標(biāo)位置坐標(biāo) ? ? ? ? ? ? ? ?this.my = e.pageY; ? ? ? ? ? ?}.bind(this),false); ? ? ? ? ? ?document.addEventListener('mouseup',function() { ? ? ? ? ? ? ? ?clearInterval(this.moving); ? ? ? ? ? ?}.bind(this),false); ? ? ? ?} ? ?};? ?return { ? ? ? ?Rotate : Rotate ? ?}});