diff --git a/filters.js b/filters.js index be6ab7e..54afeb7 100644 --- a/filters.js +++ b/filters.js @@ -7,22 +7,25 @@ const { createCanvas, Image } = Canvas; const filters = { pride: (canvas, source, x, y, props) => { _.each(canvas.frames, frame => { + const basicProps = { width: props.width, height: props.height }; + const tmpCanvas = createCanvas(frame.canvas.width, frame.canvas.height); const tmpCtx = tmpCanvas.getContext('2d'); - _drawImage(tmpCtx, frame.canvas, x, y, props); + _drawImage(tmpCtx, frame.canvas, x, y, basicProps); const multiplyProps = _.extend({}, props, { attributes: { globalCompositeOperation: 'multiply' } }); + console.log('multiply props:', multiplyProps); _drawImage(tmpCtx, source.frames[0].canvas, x, y, multiplyProps); const tmpCanvas2 = createCanvas(frame.canvas.width, frame.canvas.height); const tmpCtx2 = tmpCanvas2.getContext('2d'); - _drawImage(tmpCtx2, frame.canvas, x, y, props); + _drawImage(tmpCtx2, frame.canvas, x, y, basicProps); const sourceInProps = _.extend({}, props, { attributes: { globalCompositeOperation: 'source-in' } }); _drawImage(tmpCtx2, source.frames[0].canvas, x, y, sourceInProps); - const combineProps2 = _.extend({}, props, { attributes: { globalCompositeOperation: 'source-atop', globalAlpha: 0.9 } }); + const combineProps2 = _.extend({}, basicProps, { attributes: { globalCompositeOperation: 'source-atop', globalAlpha: 1 } }); _drawImage(frame.ctx, tmpCanvas2, x, y, combineProps2); - const combineProps = _.extend({}, props, { attributes: { globalCompositeOperation: 'source-atop', globalAlpha: 0.8 } }); + const combineProps = _.extend({}, basicProps, { attributes: { globalCompositeOperation: 'source-atop', globalAlpha: 0.6 } }); _drawImage(frame.ctx, tmpCanvas, x, y, combineProps); }); return canvas; diff --git a/imageex.js b/imageex.js index 3c46b22..f9c0a4a 100644 --- a/imageex.js +++ b/imageex.js @@ -33,6 +33,7 @@ function _drawImage(ctx, img, x, y, args = {}) { ctx.save(); if (args.transform) { _.each(args.transform, (val, prop) => { + console.log(`Transforming ${prop} by ${val}`); ctx[prop](...val); }); }