mirror of
https://github.com/rough-stuff/rough.git
synced 2026-02-15 07:55:38 -05:00
3 lines
33 KiB
JavaScript
3 lines
33 KiB
JavaScript
"use strict";function _possibleConstructorReturn(a,b){if(!a)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!b||"object"!=typeof b&&"function"!=typeof b?a:b}function _inherits(a,b){if("function"!=typeof b&&null!==b)throw new TypeError("Super expression must either be null or a function, not "+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function GeomToken(a,b){arguments.length>0&&this.init(a,b)}var _createClass=function(){function a(a,b){for(var c=0;c<b.length;c++){var d=b[c];d.enumerable=d.enumerable||!1,d.configurable=!0,"value"in d&&(d.writable=!0),Object.defineProperty(a,d.key,d)}}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),Drawable=function(){function a(b){if(_classCallCheck(this,a),this._fields={},this._dirty=!1,this._canvas=null,this.z=0,this._roughness=null,this._bowing=null,this._stroke=null,this._strokeWidth=null,this._fill=null,this._fillStyle=null,this._fillWeight=null,this._hachureAngle=null,this._hachureGap=null,this._maxRandomnessOffset=null,this._curveTightness=0,b)for(var c=0;c<b.length;c++)this._defineRenderProperty(b[c])}return _createClass(a,[{key:"_defineRenderProperty",value:function(a){Object.defineProperty(this,a,{get:function(){return this._get(a)},set:function(b){this._set(a,b)}})}},{key:"attach",value:function(a,b){this.attached=!0,this._canvas=a,this.z=b}},{key:"detach",value:function(){this.attached=!1,this.z=0}},{key:"remove",value:function(){this.attached&&this._canvas&&this._canvas.remove(this)}},{key:"_get",value:function(a){return this._fields[a]?this._fields[a]:null}},{key:"_set",value:function(a,b){var c=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._fields[a]=b,c&&(this._dirty=!0,this._canvas&&this._canvas.requestDraw())}},{key:"draw",value:function(a){console.log("Draw not implemented.",a)}},{key:"getOffset",value:function(a,b){return this.roughness*(Math.random()*(b-a)+a)}},{key:"drawLine",value:function(a,b,c,d,e,f){var g=Math.pow(b-d,2)+Math.pow(b-d,2),h=this.maxRandomnessOffset||0;h*h*100>g&&(h=Math.sqrt(g)/10);var i=h/2,j=.2+.2*Math.random(),k=this.bowing*this.maxRandomnessOffset*(e-c)/200,l=this.bowing*this.maxRandomnessOffset*(b-d)/200;k=this.getOffset(-k,k),l=this.getOffset(-l,l),f||a.beginPath(),a.moveTo(b+this.getOffset(-h,h),c+this.getOffset(-h,h)),a.bezierCurveTo(k+b+(d-b)*j+this.getOffset(-h,h),l+c+(e-c)*j+this.getOffset(-h,h),k+b+2*(d-b)*j+this.getOffset(-h,h),l+c+2*(e-c)*j+this.getOffset(-h,h),d+this.getOffset(-h,h),e+this.getOffset(-h,h)),f||a.stroke(),f||a.beginPath(),a.moveTo(b+this.getOffset(-i,i),c+this.getOffset(-i,i)),a.bezierCurveTo(k+b+(d-b)*j+this.getOffset(-i,i),l+c+(e-c)*j+this.getOffset(-i,i),k+b+2*(d-b)*j+this.getOffset(-i,i),l+c+2*(e-c)*j+this.getOffset(-i,i),d+this.getOffset(-i,i),e+this.getOffset(-i,i)),f||a.stroke()}},{key:"drawLinearPath",value:function(a,b,c){var d=b.length;if(d>2){a.beginPath();for(var e=0;e<d-1;e++)this.drawLine(a,b[e][0],b[e][1],b[e+1][0],b[e+1][1],!0);c&&this.drawLine(a,b[d-1][0],b[d-1][1],b[0][0],b[0][1],!0),a.stroke()}else 2==d&&this.drawLine(a,b[0][0],b[0][1],b[1][0],b[1][1])}},{key:"drawCurve",value:function(a,b,c,d,e){var f,g=b.length;if(g>3){var h=[],i=1-this.curveTightness;for(c||a.beginPath(),a.moveTo(b[1][0],b[1][1]),f=1;f+2<g;f++){var j=b[f];h[0]=[j[0],j[1]],h[1]=[j[0]+(i*b[f+1][0]-i*b[f-1][0])/6,j[1]+(i*b[f+1][1]-i*b[f-1][1])/6],h[2]=[b[f+1][0]+(i*b[f][0]-i*b[f+2][0])/6,b[f+1][1]+(i*b[f][1]-i*b[f+2][1])/6],h[3]=[b[f+1][0],b[f+1][1]],a.bezierCurveTo(h[1][0],h[1][1],h[2][0],h[2][1],h[3][0],h[3][1])}if(d&&e&&2==e.length){var k=this.maxRandomnessOffset||0;a.lineTo(e[0]+this.getOffset(-k,k),e[1]+this.getOffset(-k,k))}c||a.stroke()}else 3==g?this.drawBezier(a,b[0][0],b[0][1],b[1][0],b[1][1],b[2][0],b[2][1],b[2][0],b[2][1],c):2==g&&this.drawLine(a,b[0][0],b[0][1],b[1][0],b[1][1],c)}},{key:"drawBezier",value:function(a,b,c,d,e,f,g,h,i,j){j||a.beginPath(),a.moveTo(b,c);var k=this.maxRandomnessOffset||0;a.moveTo(b+this.getOffset(-k,k),c+this.getOffset(-k,k)),this._drawBezierTo(a,d,e,f,g,h,i),j||a.stroke()}},{key:"_drawBezierTo",value:function(a,b,c,d,e,f,g){var h=this.maxRandomnessOffset||0,i=[f+this.getOffset(-h,h),g+this.getOffset(-h,h)];return a.bezierCurveTo(b+this.getOffset(-h,h),c+this.getOffset(-h,h),d+this.getOffset(-h,h),e+this.getOffset(-h,h),i[0],i[1]),i}},{key:"_drawQuadTo",value:function(a,b,c,d,e){var f=this.maxRandomnessOffset||0,g=[d+this.getOffset(-f,f),e+this.getOffset(-f,f)];return a.quadraticCurveTo(b+this.getOffset(-f,f),c+this.getOffset(-f,f),g[0],g[1]),g}},{key:"getIntersectingLines",value:function(a,b,c){for(var d=[],e=new Segment(a[0],a[1],a[2],a[3]),f=0;f<b.length;f++){var g=new Segment(b[f],c[f],b[(f+1)%b.length],c[(f+1)%b.length]);e.compare(g)==_RELATION_.INTERSECTS&&d.push([e.xi,e.yi])}return d}},{key:"hachureFillShape",value:function(a,b,c){if(b&&c&&b.length&&c.length){for(var d=b[0],e=b[0],f=c[0],g=c[0],h=1;h<b.length;h++)d=Math.min(d,b[h]),e=Math.max(e,b[h]),f=Math.min(f,c[h]),g=Math.max(g,c[h]);var i=this.hachureAngle,j=this.hachureGap;j<0&&(j=4*this.strokeWidth),j=Math.max(j,.1);var k=this.fillWeight;k<0&&(k=this.strokeWidth/2);var l=Math.PI/180,m=i%180*l,n=Math.cos(m),o=Math.sin(m),p=Math.tan(m);a.save(),a.strokeStyle=this.fill,a.lineWidth=k;for(var q,r=new HachureIterator(f-1,g+1,d-1,e+1,j,o,n,p);null!=(q=r.getNextLine());)for(var s=this.getIntersectingLines(q,b,c),t=0;t<s.length;t++)if(t<s.length-1){var u=s[t],v=s[t+1];this.drawLine(a,u[0],u[1],v[0],v[1])}a.restore()}}},{key:"dirty",get:function(){return this._dirty}},{key:"roughness",set:function(a){this._roughness=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._roughness&&this._roughness>=0?this._roughness:this._canvas?this._canvas.roughness:this._roughness}},{key:"bowing",set:function(a){this._bowing=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._bowing&&this._bowing>=0?this._bowing:this._canvas?this._canvas.bowing:this._bowing}},{key:"stroke",set:function(a){this._stroke=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"string"==typeof this._stroke&&this._stroke?this._stroke:this._canvas?this._canvas.stroke:this._stroke}},{key:"strokeWidth",set:function(a){this._strokeWidth=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._strokeWidth&&this._strokeWidth>=0?this._strokeWidth:this._canvas?this._canvas.strokeWidth:this._strokeWidth}},{key:"maxRandomnessOffset",set:function(a){this._maxRandomnessOffset=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._maxRandomnessOffset&&this._maxRandomnessOffset>=0?this._maxRandomnessOffset:this._canvas?this._canvas.maxRandomnessOffset:this._maxRandomnessOffset}},{key:"curveTightness",set:function(a){this._curveTightness=Math.max(Math.min(a,1),0),this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._curveTightness&&this._curveTightness>=0?this._curveTightness:this._canvas?this._canvas.curveTightness||0:this._curveTightness}},{key:"fill",set:function(a){this._fill=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"string"==typeof this._fill&&this._fill?this._fill:this._canvas?this._canvas.fill:this._fill}},{key:"fillStyle",set:function(a){this._fillStyle=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"string"==typeof this._fillStyle&&this._fillStyle?this._fillStyle:this._canvas?this._canvas.fillStyle:this._fillStyle}},{key:"fillWeight",set:function(a){this._fillWeight=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._fillWeight&&this._fillWeight?this._fillWeight:this._canvas?this._canvas.fillWeight:this._fillWeight}},{key:"hachureAngle",set:function(a){this._hachureAngle=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._hachureAngle&&this._hachureAngle>=0?this._hachureAngle:this._canvas?this._canvas.hachureAngle:this._hachureAngle}},{key:"hachureGap",set:function(a){this._hachureGap=a,this._canvas&&this._canvas.requestDraw()},get:function(){return"number"==typeof this._hachureGap&&this._hachureGap>=0?this._hachureGap:this._canvas?this._canvas.hachureGap:this._hachureGap}}]),a}(),Ellipse=function(a){function b(a,c,d,e){_classCallCheck(this,b);var f=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,["x","y","width","height","numSteps"]));return f.x=a,f.y=c,f.width=d,f.height=e||d,f.numSteps=9,f}return _inherits(b,a),_createClass(b,[{key:"draw",value:function(a){this.ellipseInc=2*Math.PI/this.numSteps;var b=Math.abs(this.width/2),c=Math.abs(this.height/2);b+=this.getOffset(.05*-b,.05*b),c+=this.getOffset(.05*-c,.05*c),this.fill&&this._doFill(a,b,c),a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this._ellipse(a,this.x,this.y,b,c,1,this.ellipseInc*this.getOffset(.1,this.getOffset(.4,1))),this._ellipse(a,this.x,this.y,b,c,1.5,0),a.restore()}},{key:"_ellipse",value:function(a,b,c,d,e,f,g,h){var i=this.getOffset(-.5,.5)-Math.PI/2,j=[];j.push([this.getOffset(-f,f)+b+.9*d*Math.cos(i-this.ellipseInc),this.getOffset(-f,f)+c+.9*e*Math.sin(i-this.ellipseInc)]);for(var k=i;k<2*Math.PI+i-.01;k+=this.ellipseInc)j.push([this.getOffset(-f,f)+b+d*Math.cos(k),this.getOffset(-f,f)+c+e*Math.sin(k)]);j.push([this.getOffset(-f,f)+b+d*Math.cos(i+2*Math.PI+.5*g),this.getOffset(-f,f)+c+e*Math.sin(i+2*Math.PI+.5*g)]),j.push([this.getOffset(-f,f)+b+.98*d*Math.cos(i+g),this.getOffset(-f,f)+c+.98*e*Math.sin(i+g)]),j.push([this.getOffset(-f,f)+b+.9*d*Math.cos(i+.5*g),this.getOffset(-f,f)+c+.9*e*Math.sin(i+.5*g)]),this.drawCurve(a,j,h)}},{key:"_doFill",value:function(a,b,c){var d=this.fillStyle||"hachure";switch(d){case"solid":a.save(),a.fillStyle=this.fill,a.strokeStyle=null,a.beginPath(),this._ellipse(a,this.x,this.y,b,c,1,this.ellipseInc*this.getOffset(.1,this.getOffset(.4,1)),!0),a.fill(),a.restore();break;default:var e=this.hachureAngle,f=this.hachureGap;f<=0&&(f=4*this.strokeWidth);var g=this.fillWeight;g<0&&(g=this.strokeWidth/2);var h=Math.PI/180,i=e%180*h,j=Math.tan(i),k=this.x,l=this.y,m=c/b,n=Math.sqrt(m*j*m*j+1),o=m*j/n,p=1/n,q=f/(b*c/Math.sqrt(c*p*(c*p)+b*o*(b*o))/b),r=Math.sqrt(b*b-(k-b+q)*(k-b+q));a.save(),a.strokeStyle=this.fill,a.lineWidth=g;for(var s=k-b+q;s<k+b;s+=q){r=Math.sqrt(b*b-(k-s)*(k-s));var t=this.affine(s,l-r,k,l,o,p,m),u=this.affine(s,l+r,k,l,o,p,m);this.drawLine(a,t[0],t[1],u[0],u[1])}a.restore()}}},{key:"affine",value:function(a,b,c,d,e,f,g){var h=-c*f-d*e+c,i=g*(c*e-d*f)+d,j=f,k=e,l=-g*e,m=g*f;return[h+j*a+k*b,i+l*a+m*b]}}]),b}(Drawable),Arc=function(a){function b(a,c,d,e,f,g,h){_classCallCheck(this,b);var i=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,["x","y","width","height","start","stop","numSteps","closed"]));return i.x=a,i.y=c,i.width=d,i.height=e||d,i.start=f,i.stop=g,i.numSteps=9,i.closed=!!h,i}return _inherits(b,a),_createClass(b,[{key:"draw",value:function(a){var b=this.x,c=this.y,d=Math.abs(this.width/2),e=Math.abs(this.height/2);d+=this.getOffset(.01*-d,.01*d),e+=this.getOffset(.01*-e,.01*e);for(var f=this.start,g=this.stop;f<0;)f+=2*Math.PI,g+=2*Math.PI;g-f>2*Math.PI&&(f=0,g=2*Math.PI);var h=2*Math.PI/this.numSteps,i=Math.min(h/2,(g-f)/2),j=[];j.push([b+d*Math.cos(f),c+e*Math.sin(f)]);for(var k=f;k<=g;k+=i)j.push([b+d*Math.cos(k),c+e*Math.sin(k)]);if(j.push([b+d*Math.cos(g),c+e*Math.sin(g)]),j.push([b+d*Math.cos(g),c+e*Math.sin(g)]),this.fill&&this.closed&&this._doFill(a,j,[b,c]),a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this.drawCurve(a,j),this.closed){var l=j.length-1;this.drawLine(a,j[0][0],j[0][1],b,c),this.drawLine(a,j[l][0],j[l][1],b,c)}a.restore()}},{key:"_doFill",value:function(a,b,c){var d=this,e=this.fillStyle||"hachure";switch(e){case"solid":a.save(),a.fillStyle=this.fill,a.beginPath(),this.drawCurve(a,b,!0,!0,c),a.fill(),a.restore();break;default:var f,g,h=function(){for(var b=d.x,c=d.y,e=d.start,h=d.stop,i=Math.abs(d.width/2),j=Math.abs(d.height/2);e<0;)e+=2*Math.PI,h+=2*Math.PI;h-e>2*Math.PI&&(e=0,h=2*Math.PI);var k=(h-e)/d.numSteps;for(f=[],f.push([b,c]),f.push([b+i*Math.cos(e),c+j*Math.sin(e)]),g=e;g<=h;g+=k)f.push([b+i*Math.cos(g),c+j*Math.sin(g)]);f.push([b+i*Math.cos(h),c+j*Math.sin(h)]);var l=[],m=[];return f.forEach(function(a){l.push(a[0]),m.push(a[1])}),d.hachureFillShape(a,l,m),"break"}();if("break"===h)break}}}]),b}(Drawable),Circle=function(a){function b(a,c,d){return _classCallCheck(this,b),_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,a,c,2*d))}return _inherits(b,a),_createClass(b,[{key:"radius",get:function(){return this.width/2},set:function(a){this.width=2*a,this.height=2*a}}]),b}(Ellipse),Curve=function(a){function b(a){_classCallCheck(this,b);var c=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return c._points=a,c}return _inherits(b,a),_createClass(b,[{key:"setPoint",value:function(a,b,c){this._points[a]=[b,c],this._canvas&&this._canvas.requestDraw()}},{key:"getPoint",value:function(a){return a>0&&a<this._points.length?this._points[a]:null}},{key:"draw",value:function(a){a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth;var b=this.maxRandomnessOffset||0,c=[],d=[];c.push(this._points[0]),c.push(this._points[0]);var e=[this._points[0][0]+this.getOffset(-b,b),this._points[0][1]+this.getOffset(-b,b)];d.push(e),d.push(e);for(var f=this._points.length-1,g=1;g<f;g++)c.push(this._points[g]),g%3==0?d.push([this._points[g][0]+this.getOffset(-b,b),this._points[g][1]+this.getOffset(-b,b)]):d.push(this._points[g]);c.push(this._points[f]),c.push(this._points[f]);var h=[this._points[f][0]+this.getOffset(-b,b),this._points[f][1]+this.getOffset(-b,b)];d.push(h),d.push(h),this.drawCurve(a,c),this.drawCurve(a,d),a.restore()}}]),b}(Drawable),ArcConverter=function(){function a(b,c,d,e,f,g){_classCallCheck(this,a);var h=Math.PI/180;if(this._segIndex=0,this._numSegs=0,b[0]!=c[0]||b[1]!=c[1]){this._rx=Math.abs(d[0]),this._ry=Math.abs(d[1]),this._sinPhi=Math.sin(e*h),this._cosPhi=Math.cos(e*h);var i,j=this._cosPhi*(b[0]-c[0])/2+this._sinPhi*(b[1]-c[1])/2,k=-this._sinPhi*(b[0]-c[0])/2+this._cosPhi*(b[1]-c[1])/2,l=this._rx*this._rx*this._ry*this._ry-this._rx*this._rx*k*k-this._ry*this._ry*j*j;if(l<0){var m=Math.sqrt(1-l/(this._rx*this._rx*this._ry*this._ry));this._rx=m,this._ry=m,i=0}else i=(f==g?-1:1)*Math.sqrt(l/(this._rx*this._rx*k*k+this._ry*this._ry*j*j));var n=i*this._rx*k/this._ry,o=-i*this._ry*j/this._rx;this._C=[0,0],this._C[0]=this._cosPhi*n-this._sinPhi*o+(b[0]+c[0])/2,this._C[1]=this._sinPhi*n+this._cosPhi*o+(b[1]+c[1])/2,this._theta=this.calculateVectorAngle(1,0,(j-n)/this._rx,(k-o)/this._ry);var p=this.calculateVectorAngle((j-n)/this._rx,(k-o)/this._ry,(-j-n)/this._rx,(-k-o)/this._ry);!g&&p>0?p-=2*Math.PI:g&&p<0&&(p+=2*Math.PI),this._numSegs=Math.ceil(Math.abs(p/(Math.PI/2))),this._delta=p/this._numSegs,this._T=8/3*Math.sin(this._delta/4)*Math.sin(this._delta/4)/Math.sin(this._delta/2),this._from=b}}return _createClass(a,[{key:"getNextSegment",value:function(){var a,b,c;if(this._segIndex==this._numSegs)return null;var d=Math.cos(this._theta),e=Math.sin(this._theta),f=this._theta+this._delta,g=Math.cos(f),h=Math.sin(f);return c=[this._cosPhi*this._rx*g-this._sinPhi*this._ry*h+this._C[0],this._sinPhi*this._rx*g+this._cosPhi*this._ry*h+this._C[1]],a=[this._from[0]+this._T*(-this._cosPhi*this._rx*e-this._sinPhi*this._ry*d),this._from[1]+this._T*(-this._sinPhi*this._rx*e+this._cosPhi*this._ry*d)],b=[c[0]+this._T*(this._cosPhi*this._rx*h+this._sinPhi*this._ry*g),c[1]+this._T*(this._sinPhi*this._rx*h-this._cosPhi*this._ry*g)],this._theta=f,this._from=[c[0],c[1]],this._segIndex++,{cp1:a,cp2:b,to:c}}},{key:"calculateVectorAngle",value:function(a,b,c,d){var e=Math.atan2(b,a),f=Math.atan2(d,c);return f>=e?f-e:2*Math.PI-(e-f)}}]),a}();GeomToken.prototype.init=function(a,b){this.type=a,this.text=b},GeomToken.prototype.typeis=function(a){return this.type==a};var GeomPath=function(){function a(b){_classCallCheck(this,a),this.PARAMS={A:["rx","ry","x-axis-rotation","large-arc-flag","sweep-flag","x","y"],a:["rx","ry","x-axis-rotation","large-arc-flag","sweep-flag","x","y"],C:["x1","y1","x2","y2","x","y"],c:["x1","y1","x2","y2","x","y"],H:["x"],h:["x"],L:["x","y"],l:["x","y"],M:["x","y"],m:["x","y"],Q:["x1","y1","x","y"],q:["x1","y1","x","y"],S:["x2","y2","x","y"],s:["x2","y2","x","y"],T:["x","y"],t:["x","y"],V:["y"],v:["y"],Z:[],z:[]},this.COMMAND=0,this.NUMBER=1,this.EOD=2,this.segments=[],this.d=b||"",this.parseData(b)}return _createClass(a,[{key:"parseData",value:function(a){var b=this.tokenize(a),c=0,d=b[c],e="BOD";for(this.segments=new Array;!d.typeis(this.EOD);){var f,g=new Array;if("BOD"==e){if("M"!=d.text&&"m"!=d.text)return void console.error("Path data must begin with a MoveTo command");c++,f=this.PARAMS[d.text].length,e=d.text}else d.typeis(this.NUMBER)?f=this.PARAMS[e].length:(c++,f=this.PARAMS[d.text].length,e=d.text);if(c+f<b.length){for(var h=c;h<c+f;h++){var i=b[h];if(!i.typeis(this.NUMBER))return void console.error("Parameter type is not a number: "+e+","+i.text);g[g.length]=i.text}var j;if(!this.PARAMS[e])return void console.error("Unsupported segment type: "+e);j={key:e,data:g},this.segments.push(j),c+=f,d=b[c],"M"==e&&(e="L"),"m"==e&&(e="l")}else console.error("Path data ended before all parameters were found")}}},{key:"tokenize",value:function(a){for(var b=new Array;""!=a;)if(a.match(/^([ \t\r\n,]+)/))a=a.substr(RegExp.$1.length);else if(a.match(/^([aAcChHlLmMqQsStTvVzZ])/))b[b.length]=new GeomToken(this.COMMAND,RegExp.$1),a=a.substr(RegExp.$1.length);else{if(!a.match(/^(([-+]?[0-9]+(\.[0-9]*)?|[-+]?\.[0-9]+)([eE][-+]?[0-9]+)?)/))return console.error("Unrecognized segment command: "+a),null;b[b.length]=new GeomToken(this.NUMBER,parseFloat(RegExp.$1)),a=a.substr(RegExp.$1.length)}return b[b.length]=new GeomToken(this.EOD,null),b}}]),a}(),HachureIterator=function(){function a(b,c,d,e,f,g,h,i){_classCallCheck(this,a),this.top=b,this.bottom=c,this.left=d,this.right=e,this.gap=f,this.sinAngle=g,this.tanAngle=i,Math.abs(g)<1e-4?this.pos=d+f:Math.abs(g)>.9999?this.pos=b+f:(this.deltaX=(c-b)*Math.abs(i),this.pos=d-Math.abs(this.deltaX),this.hGap=Math.abs(f/h),this.sLeft=new Segment(d,c,d,b),this.sRight=new Segment(e,c,e,b))}return _createClass(a,[{key:"getNextLine",value:function(){if(Math.abs(this.sinAngle)<1e-4){if(this.pos<this.right){var a=[this.pos,this.top,this.pos,this.bottom];return this.pos+=this.gap,a}}else if(Math.abs(this.sinAngle)>.9999){if(this.pos<this.bottom){var b=[this.left,this.pos,this.right,this.pos];return this.pos+=this.gap,b}}else{var c=this.pos-this.deltaX/2,d=this.pos+this.deltaX/2,e=this.bottom,f=this.top;if(this.pos<this.right+this.deltaX){for(;c<this.left&&d<this.left||c>this.right&&d>this.right;)if(this.pos+=this.hGap,c=this.pos-this.deltaX/2,d=this.pos+this.deltaX/2,this.pos>this.right+this.deltaX)return null;var g=new Segment(c,e,d,f);g.compare(this.sLeft)==_RELATION_.INTERSECTS&&(c=g.xi,e=g.yi),g.compare(this.sRight)==_RELATION_.INTERSECTS&&(d=g.xi,f=g.yi),this.tanAngle>0&&(c=this.right-(c-this.left),d=this.right-(d-this.left));var h=[c,e,d,f];return this.pos+=this.hGap,h}}return null}}]),a}(),_RELATION_={LEFT:0,RIGHT:1,INTERSECTS:2,AHEAD:3,BEHIND:4,SEPARATE:5,UNDEFINED:6},Segment=function(){function a(b,c,d,e){_classCallCheck(this,a),this.px1=b,this.py1=c,this.px2=d,this.py2=e,this.xi=Number.MAX_VALUE,this.yi=Number.MAX_VALUE,this.a=e-c,this.b=b-d,this.c=d*c-b*e,this._undefined=0==this.a&&0==this.b&&0==this.c}return _createClass(a,[{key:"isUndefined",value:function(){return this._undefined}},{key:"compare",value:function(a){if(this.isUndefined()||a.isUndefined())return _RELATION_.UNDEFINED;var b=Number.MAX_VALUE,c=Number.MAX_VALUE,d=0,e=0,f=this.a,g=this.b,h=this.c;return Math.abs(g)>1e-5&&(b=-f/g,d=-h/g),Math.abs(a.b)>1e-5&&(c=-a.a/a.b,e=-a.c/a.b),b==Number.MAX_VALUE?c==Number.MAX_VALUE?-h/f!=-a.c/a.a?_RELATION_.SEPARATE:this.py1>=Math.min(a.py1,a.py2)&&this.py1<=Math.max(a.py1,a.py2)?(this.xi=this.px1,this.yi=this.py1,_RELATION_.INTERSECTS):this.py2>=Math.min(a.py1,a.py2)&&this.py2<=Math.max(a.py1,a.py2)?(this.xi=this.px2,this.yi=this.py2,_RELATION_.INTERSECTS):_RELATION_.SEPARATE:(this.xi=this.px1,this.yi=c*this.xi+e,(this.py1-this.yi)*(this.yi-this.py2)<-1e-5||(a.py1-this.yi)*(this.yi-a.py2)<-1e-5?_RELATION_.SEPARATE:Math.abs(a.a)<1e-5&&(a.px1-this.xi)*(this.xi-a.px2)<-1e-5?_RELATION_.SEPARATE:_RELATION_.INTERSECTS):c==Number.MAX_VALUE?(this.xi=a.px1,this.yi=b*this.xi+d,(a.py1-this.yi)*(this.yi-a.py2)<-1e-5||(this.py1-this.yi)*(this.yi-this.py2)<-1e-5?_RELATION_.SEPARATE:Math.abs(f)<1e-5&&(this.px1-this.xi)*(this.xi-this.px2)<-1e-5?_RELATION_.SEPARATE:_RELATION_.INTERSECTS):b==c?d!=e?_RELATION_.SEPARATE:this.px1>=Math.min(a.px1,a.px2)&&this.px1<=Math.max(a.py1,a.py2)?(this.xi=this.px1,this.yi=this.py1,_RELATION_.INTERSECTS):this.px2>=Math.min(a.px1,a.px2)&&this.px2<=Math.max(a.px1,a.px2)?(this.xi=this.px2,this.yi=this.py2,_RELATION_.INTERSECTS):_RELATION_.SEPARATE:(this.xi=(e-d)/(b-c),this.yi=b*this.xi+d,(this.px1-this.xi)*(this.xi-this.px2)<-1e-5||(a.px1-this.xi)*(this.xi-a.px2)<-1e-5?_RELATION_.SEPARATE:_RELATION_.INTERSECTS)}},{key:"getLength",value:function(){return this._getLength(this.px1,this.py1,this.px2,this.py2)}},{key:"_getLength",value:function(a,b,c,d){var e=c-a,f=d-b;return Math.sqrt(e*e+f*f)}}]),a}(),Line=function(a){function b(a,c,d,e){_classCallCheck(this,b);var f=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,["x1","y1","x2","y2"]));return f.x1=a,f.x2=d,f.y1=c,f.y2=e,f}return _inherits(b,a),_createClass(b,[{key:"draw",value:function(a){a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this.drawLine(a,this.x1,this.y1,this.x2,this.y2),a.restore()}}]),b}(Drawable),LinearPath=function(a){function b(a){_classCallCheck(this,b);var c=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return c._points=a,c}return _inherits(b,a),_createClass(b,[{key:"setPoint",value:function(a,b,c){this._points[a]=[b,c],this._canvas&&this._canvas.requestDraw()}},{key:"getPoint",value:function(a){return a>0&&a<this._points.length?this._points[a]:null}},{key:"draw",value:function(a){a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this.drawLinearPath(a,this._points,!1),a.restore()}}]),b}(Drawable),Path=function(a){function b(a){_classCallCheck(this,b);var c=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,["path","numSteps"]));return c.numSteps=9,c.path=a,c._keys=["C","c","Q","q","M","m","L","l","A","a","H","h","V","v","S","s","T","t","Z","z"],c}return _inherits(b,a),_createClass(b,[{key:"draw",value:function(a){if(this.path){var b=(this.path||"").replace(/\n/g," ").replace(/(-)/g," -").replace(/(-\s)/g,"-").replace("/(ss)/g"," ");this.gp=new GeomPath(b);var c=this.gp.segments||[];this._position=[0,0],this._bezierReflectionPoint=null,this._quadReflectionPoint=null,this._first=null,this.fill&&this._doFill(a,b),a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,a.beginPath();for(var d=0;d<c.length;d++){var e=c[d];this._processSegment(a,e,d>0?c[d-1]:null)}a.stroke(),a.restore()}}},{key:"_doFill",value:function(a,b){var c=this.fillStyle||"hachure";switch(c){case"solid":a.save(),a.fillStyle=this.fill;var d=new Path2D(b);a.fill(d),a.restore();break;default:var e=this._canvas.getHiddenCanvas();if(e){var f=e.getContext("2d"),g=[0,e.width,e.width,0],h=[0,0,e.height,e.height];this.hachureFillShape(f,g,h)}a.save(),a.fillStyle=a.createPattern(e,"repeat");var i=new Path2D(b);a.fill(i),a.restore()}}},{key:"_processSegment",value:function(a,b,c){switch(b.key){case"M":case"m":this._moveTo(b);break;case"L":case"l":this._lineTo(a,b);break;case"H":case"h":this._hLineTo(a,b);break;case"V":case"v":this._vLineTo(a,b);break;case"Z":case"z":this._closeShape(a);break;case"C":case"c":this._curveTo(a,b);break;case"S":case"s":this._shortCurveTo(a,b,c);break;case"Q":case"q":this._quadCurveTo(a,b);break;case"T":case"t":this._shortQuadTo(a,b,c);break;case"A":case"a":this._arcTo(a,b)}}},{key:"_setPosition",value:function(a,b){this._position=[a,b],this._first||(this._first=[a,b])}},{key:"_moveTo",value:function(a){var b="m"===a.key;if(a.data.length>=2){var c=+a.data[0],d=+a.data[1];b?this._setPosition(this._position[0]+c,this._position[1]+d):this._setPosition(c,d)}}},{key:"_closeShape",value:function(a){this._first&&this.drawLine(a,this._position[0],this._position[1],this._first[0],this._first[1],!0)}},{key:"_lineTo",value:function(a,b){var c="l"===b.key;if(b.data.length>=2){var d=+b.data[0],e=+b.data[1];c&&(d+=this._position[0],e+=this._position[1]),this.drawLine(a,this._position[0],this._position[1],d,e,!0),this._setPosition(d,e)}}},{key:"_hLineTo",value:function(a,b){var c="h"===b.key;if(b.data.length){var d=+b.data[0];c&&(d+=this._position[0]),this.drawLine(a,this._position[0],this._position[1],d,this._position[1],!0),this._setPosition(d,this._position[1])}}},{key:"_vLineTo",value:function(a,b){var c="v"===b.key;if(b.data.length){var d=+b.data[0];c&&(d+=this._position[1]),this.drawLine(a,this._position[0],this._position[1],this._position[0],d,!0),this._setPosition(this._position[0],d)}}},{key:"_quadCurveTo",value:function(a,b){var c="q"===b.key;if(b.data.length>=4){var d=+b.data[0],e=+b.data[1],f=+b.data[2],g=+b.data[3];c&&(d+=this._position[0],f+=this._position[0],e+=this._position[1],g+=this._position[1]);var h=this.maxRandomnessOffset||0;a.moveTo(this._position[0],this._position[1]),this._drawQuadTo(a,d,e,f,g),a.moveTo(this._position[0]+this.getOffset(-h,h),this._position[1]+this.getOffset(-h,h));var i=this._drawQuadTo(a,d,e,f,g);f=i[0],g=i[1],this._setPosition(f,g),this._quadReflectionPoint=[f+(f-d),g+(g-e)]}}},{key:"_curveTo",value:function(a,b){var c="c"===b.key;if(b.data.length>=6){var d=+b.data[0],e=+b.data[1],f=+b.data[2],g=+b.data[3],h=+b.data[4],i=+b.data[5];c&&(d+=this._position[0],f+=this._position[0],h+=this._position[0],e+=this._position[1],g+=this._position[1],i+=this._position[1]);var j=this.maxRandomnessOffset||0;a.moveTo(this._position[0],this._position[1]),this._drawBezierTo(a,d,e,f,g,h,i),a.moveTo(this._position[0]+this.getOffset(-j,j),this._position[1]+this.getOffset(-j,j));var k=this._drawBezierTo(a,d,e,f,g,h,i);h=k[0],i=k[1],this._setPosition(h,i),this._bezierReflectionPoint=[h+(h-f),i+(i-g)]}}},{key:"_shortCurveTo",value:function(a,b,c){var d="s"===b.key;if(b.data.length>=4){var e=+b.data[0],f=+b.data[1],g=+b.data[2],h=+b.data[3];d&&(e+=this._position[0],g+=this._position[0],f+=this._position[1],h+=this._position[1]);var i=e,j=f,k=c?c.key:"",l=null;"c"!=k&&"C"!=k&&"s"!=k&&"S"!=k||(l=this._bezierReflectionPoint),l&&(i=l[0],j=l[1]),a.moveTo(this._position[0],this._position[1]),this._drawBezierTo(a,i,j,e,f,g,h),a.moveTo(this._position[0],this._position[1]);var m=this._drawBezierTo(a,i,j,e,f,g,h);g=m[0],h=m[1],this._setPosition(g,h),this._bezierReflectionPoint=[g+(g-e),h+(h-f)]}}},{key:"_shortQuadTo",value:function(a,b,c){var d="t"===b.key;if(b.data.length>=2){var e=+b.data[0],f=+b.data[1];d&&(e+=this._position[0],f+=this._position[1]);var g=e,h=f,i=c?c.key:"",j=null;"q"!=i&&"Q"!=i&&"t"!=i&&"T"!=i||(j=this._quadReflectionPoint),j&&(g=j[0],h=j[1]),a.moveTo(this._position[0],this._position[1]),this._drawQuadTo(a,g,h,e,f),a.moveTo(this._position[0],this._position[1]);var k=this._drawQuadTo(a,g,h,e,f);e=k[0],f=k[1],this._setPosition(e,f),this._quadReflectionPoint=[e+(e-g),f+(f-h)]}}},{key:"_arcTo",value:function(a,b){var c="a"===b.key;if(b.data.length>=7){var d=+b.data[0],e=+b.data[1],f=+b.data[2],g=+b.data[3],h=+b.data[4],i=+b.data[5],j=+b.data[6];if(c&&(i+=this._position[0],j+=this._position[1]),i==this._position[0]&&j==this._position[1])return;if(0==d||0==e)this.drawLine(a,this._position[0],this._position[1],i,j,!0),this._setPosition(i,j);else{for(var k,l=0;l<2;l++){a.moveTo(this._position[0],this._position[1]);for(var m=new ArcConverter([this._position[0],this._position[1]],[i,j],[d,e],f,!!g,!!h),n=m.getNextSegment();n;)k=this._drawBezierTo(a,n.cp1[0],n.cp1[1],n.cp2[0],n.cp2[1],n.to[0],n.to[1]),n=m.getNextSegment()}k&&(i=k[0],j=k[1]),this._setPosition(i,j)}}}}]),b}(Drawable),Polygon=function(a){function b(a){_classCallCheck(this,b);var c=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return c._points=a,c}return _inherits(b,a),_createClass(b,[{key:"setPoint",value:function(a,b,c){this._points[a]=[b,c],this._canvas&&this._canvas.requestDraw()}},{key:"getPoint",value:function(a){return a>0&&a<this._points.length?this._points[a]:null}},{key:"draw",value:function(a){this.fill&&this._doFill(a,this._points),a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this.drawLinearPath(a,this._points,!0),a.restore()}},{key:"_doFill",value:function(a,b){var c=this,d=this.fillStyle||"hachure";switch(d){case"solid":a.save(),a.fillStyle=this.fill;var e=this.maxRandomnessOffset||0,f=b.length;if(f>2){a.beginPath(),a.moveTo(b[0][0]+this.getOffset(-e,e),b[0][1]+this.getOffset(-e,e));for(var g=1;g<f;g++)a.lineTo(b[g][0]+this.getOffset(-e,e),b[g][1]+this.getOffset(-e,e));a.fill()}a.restore();break;default:var h=function(){var d=[],e=[];return b.forEach(function(a){d.push(a[0]),e.push(a[1])}),c.hachureFillShape(a,d,e),"break"}();if("break"===h)break}}}]),b}(Drawable),Rectangle=function(a){function b(a,c,d,e){_classCallCheck(this,b);var f=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this,["x","y","width","height"]));return f.x=a,f.y=c,f.width=d,f.height=e,f}return _inherits(b,a),_createClass(b,[{key:"draw",value:function(a){var b=this.x,c=this.x+this.width,d=this.y,e=this.y+this.height;this.fill&&this._doFill(a,b,c,d,e),a.save(),a.strokeStyle=this.stroke,a.lineWidth=this.strokeWidth,this.drawLine(a,b,d,c,d),this.drawLine(a,c,d,c,e),this.drawLine(a,c,e,b,e),this.drawLine(a,b,e,b,d),a.restore()}},{key:"_doFill",value:function(a,b,c,d,e){var f=this.fillStyle||"hachure";switch(f){case"solid":a.save(),a.fillStyle=this.fill;var g=this.maxRandomnessOffset||0,h=[[b+this.getOffset(-g,g),d+this.getOffset(-g,g)],[c+this.getOffset(-g,g),d+this.getOffset(-g,g)],[c+this.getOffset(-g,g),e+this.getOffset(-g,g)],[b+this.getOffset(-g,g),e+this.getOffset(-g,g)]];a.beginPath(),a.moveTo(h[0][0],h[0][1]),a.lineTo(h[1][0],h[1][1]),a.lineTo(h[2][0],h[2][1]),a.lineTo(h[3][0],h[3][1]),a.fill(),a.restore();break;default:var i=[b,c,c,b],j=[d,d,e,e];this.hachureFillShape(a,i,j)}}}]),b}(Drawable),RoughCanvas=function(){function a(b,c,d){_classCallCheck(this,a),this._canvas=b,this.width=c||b.width,this.height=d||b.height,b.width=this.width,b.height=this.height,this._objects=[],this._drawRequested=!1,this.roughness=1,this.bowing=1,this.stroke="#000",this.strokeWidth=1,this.fill=null,this.fillStyle="hachure",this.fillWeight=-1,this.hachureAngle=-41,this.hachureGap=-1,this.maxRandomnessOffset=2}return _createClass(a,[{key:"add",value:function(a){if(a instanceof Drawable){if(a.attached)return;this._objects.push(a),a.attach(this,this._objects.length-1),this.requestDraw()}else console.warn("Ignoring canvas add - the object is not drawable",a)}},{key:"remove",value:function(a){a instanceof Drawable?a.attached&&(this._objects.splice(a.z,1),a.detach(),this.requestDraw()):console.warn("Ignoring canvas remove - the object is not drawable",a)}},{key:"clear",value:function(){this._objects&&this._objects.length&&this._objects.forEach(function(a){a.detach()}),this._objects=[],this.requestDraw()}},{key:"requestDraw",value:function(){var a=this;this._drawRequested||(this._drawRequested=!0,window.requestAnimationFrame(function(){a._drawRequested=!1,a._draw()}))}},{key:"_draw",value:function(){var a=this._canvas.getContext("2d");a.clearRect(0,0,this.width,this.height);
|
|
for(var b=0;b<this._objects.length;b++)try{this._objects[b].draw(a)}catch(a){console.error(a)}}},{key:"getHiddenCanvas",value:function(){if(!this._hiddenCanvas){var a=document.createElement("div");a.setAttribute("id","roughHiddenCanvas"),a.style.overflow="hidden",a.style.position="absolute",a.style.left="-1px",a.style.top="-1px",a.style.width="0px",a.style.height="0px",a.style.opacity=0,a.style.pointerEvents="none",document.body.appendChild(a),this._hiddenCanvas=document.createElement("canvas"),a.appendChild(this._hiddenCanvas)}var b=this._hiddenCanvas;b.width=this.width,b.height=this.height;var c=b.getContext("2d");return c.clearRect(0,0,this.width,this.height),b}},{key:"arc",value:function(a,b,c,d,e,f,g){var h=new Arc(a,b,c,d,e,f,g);return this.add(h),h}},{key:"circle",value:function(a,b,c){var d=new Circle(a,b,c);return this.add(d),d}},{key:"ellipse",value:function(a,b,c,d){var e=new Ellipse(a,b,c,d);return this.add(e),e}},{key:"curve",value:function(a){var b=new Curve(a);return this.add(b),b}},{key:"line",value:function(a,b,c,d){var e=new Line(a,b,c,d);return this.add(e),e}},{key:"rectangle",value:function(a,b,c,d){var e=new Rectangle(a,b,c,d);return this.add(e),e}},{key:"linearPath",value:function(a){var b=new LinearPath(a);return this.add(b),b}},{key:"polygon",value:function(a){var b=new Polygon(a);return this.add(b),b}},{key:"path",value:function(a){var b=new Path(a);return this.add(b),b}}]),a}();
|
|
//# sourceMappingURL=rough.min.js.map
|