mirror of
https://git.sleeping.town/mirrors/foxy-moxy
synced 2024-11-14 16:17:44 +00:00
Merge pull request #3 from Patreon/luke---draw-mask
Experiment with the pattern thing.
This commit is contained in:
commit
571c8e9342
2 changed files with 13 additions and 2 deletions
|
@ -15,7 +15,7 @@ var Fox = function (IMG_WIDTH, IMG_HEIGHT) {
|
||||||
var headHeight = IMG_HEIGHT / 2;
|
var headHeight = IMG_HEIGHT / 2;
|
||||||
var kappa = chance.floating({min: 0.2, max: 0.45})
|
var kappa = chance.floating({min: 0.2, max: 0.45})
|
||||||
|
|
||||||
var hue = chance.integer({min: 70, max: 90});
|
var hue = chance.integer({min: 5, max: 55});
|
||||||
var saturation = chance.integer({min: 70, max: 90});
|
var saturation = chance.integer({min: 70, max: 90});
|
||||||
var lightness = chance.integer({min: 40, max: 60});
|
var lightness = chance.integer({min: 40, max: 60});
|
||||||
var headColor = hsl(hue, saturation, lightness);
|
var headColor = hsl(hue, saturation, lightness);
|
||||||
|
|
13
server.js
13
server.js
|
@ -53,10 +53,21 @@ var renderFox = function (canvas, opts) {
|
||||||
};
|
};
|
||||||
|
|
||||||
function renderHead(ctx, opts) {
|
function renderHead(ctx, opts) {
|
||||||
|
|
||||||
ctx.save();
|
ctx.save();
|
||||||
ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
|
ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
|
||||||
ctx.rotate(Math.PI / 4);
|
ctx.rotate(Math.PI / 4);
|
||||||
drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, null, opts.kappa);
|
var tempCanvas = new Canvas(ctx.canvas.width, ctx.canvas.height);
|
||||||
|
var tempCtx = tempCanvas.getContext('2d');
|
||||||
|
tempCtx.save();
|
||||||
|
tempCtx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
|
||||||
|
tempCtx.rotate(Math.PI / 4);
|
||||||
|
tempCtx.fillStyle = opts.color;
|
||||||
|
tempCtx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
|
||||||
|
tempCtx.fill();
|
||||||
|
drawEllipseByCenter(tempCtx, ctx.canvas.width / 2, ctx.canvas.height, 0.1 * ctx.canvas.width, 0 * ctx.canvas.height, '#fff', null, 0.5);
|
||||||
|
var pattern = ctx.createPattern(tempCanvas);
|
||||||
|
drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, pattern, opts.kappa);
|
||||||
ctx.restore();
|
ctx.restore();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue