(function(root) { "use strict";
root.toolkit.register("brush.spirograph", function (conf) {
var contract = true; // expansion or contraction
var theta = 0; // theta
var thetaIncrement = 1;
var lastX; // previous coord.x
var lastY; // previous coord.y
var distance = 0;
// Construct the brush.
this.construct = function (conf) {
this.lineWidth = conf.lineWidth || 1;
this.distance = conf.distance || 30;
this.spacing = conf.spacing || [ 0, 10 ];
this.contract = conf.contract || 0;
this.increment = conf.increment || 1;
this.outerRadius = conf.outerRadius || 10.2; // rolling circle
this.innerRadius = conf.innerRadius || 3.2; // fixed circle
this.speed = Math.round(conf.speed || 100); // fixed circle
conf.callback(this);
};
// Brush logic.
this.prepare = function() {
this.useGlobalAlpha = !root.detect.localAlpha.stamp;
if (this.isRecording && this.useGlobalAlpha && !this.isGhost) {
return this.renderTo = this.cache;
} else if (this.isGhost || this.isRecording) {
var ctx = this.renderTo = this.active;
if (this.isGhost) {
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
ctx.drawImage(root.ctx.canvas, 0, 0);
}
return ctx;
} else {
return this.renderTo = this.ctx;
}
};
this.drawStart = function() {
distance = 0;
theta = 0; // theta
thetaIncrement = this.increment;
lastX = undefined;
lastY = undefined;
};
this.draw = function () {
var ctx = this.isRecording ? this.active : this.ctx;
var path = this.path;
var colors = this.fill.__colors;
var innerRadius = this.innerRadius;
var outerRadius = this.outerRadius;
///
if (this.contract === 0) distance = this.distance;
///
ctx.globalAlpha = this.opacity / 100;
// ctx.globalCompositeOperation = "lighter";
ctx.lineWidth = this.lineWidth;
// ctx.lineCap = "round";
// loops through the amount of intervals per timeout
var i = this.speed; while (i--) {
// toggle contraction/expansion animation
if (distance > this.distance || distance < 0) {
contract = !contract;
}
if (contract) { // handle contraction
theta -= thetaIncrement;
distance -= this.contract;
} else { // handle expansion
theta += thetaIncrement;
distance += this.contract;
}
// create hypotrochoid (http://en.wikipedia.org/wiki/Hypotrochoid)
var q = ((outerRadius - innerRadius) / innerRadius) * theta;
var x = (outerRadius - innerRadius) * Math.cos(theta) + distance * Math.cos(q);
var y = (outerRadius - innerRadius) * Math.sin(theta) - distance * Math.sin(q);
// center on mouse-xy coordinates
x += this.x;
y += this.y;
// draw once two points are available
if (lastX) {
ctx.beginPath();
ctx.moveTo(lastX, lastY);
ctx.lineTo(x, y);
var length = colors.length;
var interval = (this.interval * 2 + 1);
var color = colors[Math.abs(interval % (length * 2) - length) ];
ctx.strokeStyle = color;
ctx.stroke();
}
// set previous coords
lastX = x;
lastY = y;
}
};
///
this.construct(conf);
});
没学过JS，里面的this都把我搞昏了。急需这段代码的java版