siriusfox/foxy-moxy
1
0
Fork 0
mirror of https://git.sleeping.town/mirrors/foxy-moxy synced 2025-11-03 18:12:17 -08:00
Code Issues Projects Releases Packages Wiki Activity

Experiment with the pattern thing.

Browse source
This commit is contained in:
lucaswadedavis 2016-12-15 15:52:19 -08:00
parent 38410a4c98
commit 8260a829fd
2 changed files with 13 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
js/fox.js
View file

@ -15,7 +15,7 @@ var Fox = function (IMG_WIDTH, IMG_HEIGHT) {
var headHeight = IMG_HEIGHT / 2;
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 lightness = chance.integer({min: 40, max: 60});
var headColor = hsl(hue, saturation, lightness);

13
server.js
View file

@ -53,10 +53,21 @@ var renderFox = function (canvas, opts) {
};
function renderHead(ctx, opts) {
ctx.save();
ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
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();
}