From e89c9c84bd4173049c016e073d72c954f21c9e9a Mon Sep 17 00:00:00 2001
From: kreig <mrkreig@gmail.com>
Date: Sun, 16 Feb 2014 19:00:53 +0200
Subject: [PATCH] fabric.Object.fillRule support using globalCompositeOperation

Full support for the fabric.Object.fillRule option for any visual objects.
_setupFillRule(ctx) is used to set CanvasRenderingContext2D.globalCompositeOperation (from fillRule property).
_restorFillRule(ctx) restores previously saved globalCompositeOperation.
Both methods are called form the render() method, so individual blending settings for each object can be specified.
---
 src/shapes/object.class.js | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/src/shapes/object.class.js b/src/shapes/object.class.js
index c695b9e7..7f02a09e 100644
--- a/src/shapes/object.class.js
+++ b/src/shapes/object.class.js
@@ -930,6 +930,8 @@
       if (this.width === 0 || this.height === 0 || !this.visible) return;
 
       ctx.save();
+      //setup fill rule for current object
+      this._setupFillRule(ctx);
 
       this._transform(ctx, noTransform);
       this._setStrokeStyles(ctx);
@@ -946,11 +948,14 @@
       this._render(ctx, noTransform);
       this.clipTo && ctx.restore();
       this._removeShadow(ctx);
+      
+      this._restorFillRule(ctx);
 
       if (this.active && !noTransform) {
         this.drawBorders(ctx);
         this.drawControls(ctx);
       }
+      
       ctx.restore();
     },
 
@@ -1359,6 +1364,27 @@
         x: pointer.x - objectLeftTop.x,
         y: pointer.y - objectLeftTop.y
       };
+    },
+    
+    /**
+     * Sets canvas globalCompositeOperation for specific object
+     * custom composition operation for the particular object can be specifed using fillRule property
+     * @param {CanvasRenderingContext2D} ctx Rendering canvas context
+     */
+    _setupFillRule: function (ctx) {
+        if (this.fillRule) {
+          this._prevFillRule = ctx.globalCompositeOperation;
+          ctx.globalCompositeOperation = this.fillRule;
+        }
+    },
+    /**
+     * Restores previously saved canvas globalCompositeOperation after obeject rendering
+     * @param {CanvasRenderingContext2D} ctx Rendering canvas context
+     */
+    _restorFillRule: function (ctx) {
+        if (this.fillRule && this._prevFillRule) {
+          ctx.globalCompositeOperation = this._prevFillRule;
+        }
     }
   });