diff --git a/src/CanvasRenderingContext2d.cc b/src/CanvasRenderingContext2d.cc index 78e28e8..163cef1 100755 --- a/src/CanvasRenderingContext2d.cc +++ b/src/CanvasRenderingContext2d.cc @@ -876,9 +876,10 @@ NAN_METHOD(Context2d::DrawImage) { cairo_save(ctx); // Scale src + float fx = (float) dw / sw; + float fy = (float) dh / sh; + if (dw != sw || dh != sh) { - float fx = (float) dw / sw; - float fy = (float) dh / sh; cairo_scale(ctx, fx, fy); dx /= fx; dy /= fy; @@ -886,6 +887,7 @@ NAN_METHOD(Context2d::DrawImage) { dh /= fy; } + // apply shadow if there is one if (context->hasShadow()) { if(context->state->shadowBlur) { // we need to create a new surface in order to blur @@ -896,7 +898,7 @@ NAN_METHOD(Context2d::DrawImage) { // mask and blur context->setSourceRGBA(shadow_context, context->state->shadow); cairo_mask_surface(shadow_context, surface, pad, pad); - context->blur(shadow_surface, context->state->shadowBlur / 2); + context->blur(shadow_surface, context->state->shadowBlur); // paint // @note: ShadowBlur looks different in each browser. This implementation matches chrome as close as possible. @@ -904,8 +906,8 @@ NAN_METHOD(Context2d::DrawImage) { // implementation, and its not immediately clear why an offset is necessary, but without it, the result // in chrome is different. cairo_set_source_surface(ctx, shadow_surface, - dx - sx + context->state->shadowOffsetX - pad + 1.4, - dx - sx + context->state->shadowOffsetY - pad + 1.4); + dx - sx + (context->state->shadowOffsetX / fx) - pad + 1.4, + dy - sy + (context->state->shadowOffsetY / fy) - pad + 1.4); cairo_paint(ctx); // cleanup @@ -914,8 +916,8 @@ NAN_METHOD(Context2d::DrawImage) { } else { context->setSourceRGBA(context->state->shadow); cairo_mask_surface(ctx, surface, - dx - sx + context->state->shadowOffsetX, - dy - sy + context->state->shadowOffsetY); + dx - sx + (context->state->shadowOffsetX / fx), + dy - sy + (context->state->shadowOffsetY / fy)); } } diff --git a/test/public/tests.js b/test/public/tests.js index cc2beb1..7b22c5e 100644 --- a/test/public/tests.js +++ b/test/public/tests.js @@ -1537,6 +1537,20 @@ tests['shadow image'] = function(ctx, done){ img.src = 'star.png'; }; +tests['scaled shadow image'] = function(ctx, done){ + var img = new Image; + img.onload = function(){ + ctx.shadowColor = '#f3ac22'; + ctx.shadowBlur = 2; + ctx.shadowOffsetX = 8; + ctx.shadowOffsetY = 8; + ctx.drawImage(img, 10, 10, 80, 80); + done(); + }; + img.onerror = function(){} + img.src = 'star.png'; +}; + tests['shadow integration'] = function(ctx){ ctx.shadowBlur = 5; ctx.shadowOffsetX = 10;