Merge pull request #669 from inssein/fix-shadow

fix incorrect Y offset for shadows, and also fix scaled shadows

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->shadowOffsetX / fx) - pad + 1.4,
-        dx - sx + context->state->shadowOffsetY - 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,
+        dx - sx + (context->state->shadowOffsetX / fx),
-        dy - sy + context->state->shadowOffsetY);
+        dy - sy + (context->state->shadowOffsetY / fy));
     }
   }
 

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;