Fixed a bug that is ClippingNode draw error if inverted == true

Author: VisualSJ

cocos2d/clipping-nodes/CCClippingNodeCanvasRenderCmd.js

@@ -60,10 +60,8 @@
                 scaleX = scaleX || cc.view.getScaleX();
                 scaleY = scaleY ||cc.view.getScaleY();
                 var wrapper = ctx || cc._renderContext, context = wrapper.getContext();
-                var t = this._transform;                                              //note: use local transform
-                wrapper.save();
-                context.transform(t.a, t.b, t.c, t.d, t.tx * scaleX, -t.ty * scaleY);
-                context.beginPath();
+
+                wrapper.setTransform(this._transform, scaleX, scaleY);
                 for (var i = 0; i < stencil._buffer.length; i++) {
                     var vertices = stencil._buffer[i].verts;
                     //TODO: need support circle etc
@@ -75,7 +73,6 @@
                     for (var j = 1, len = vertices.length; j < len; j++)
                         context.lineTo(vertices[j].x * scaleX, -vertices[j].y * scaleY);
                 }
-                wrapper.restore();
             };
         }else{
             stencil._parent = this._node;
@@ -94,9 +91,15 @@
             locCacheCtx.drawImage(canvas, 0, 0);                //save the result to shareCache canvas
         } else {
             wrapper.save();
-            wrapper.save();                                                               //save for clip
+            context.beginPath();                                                         //save for clip
             //Because drawNode's content size is zero
             wrapper.setTransform(this._worldTransform, scaleX, scaleY);
+
+            if (this._node.inverted) {
+                context.setTransform(1, 0, 0, 1, 0, 0);
+                context.rect(0, 0, context.canvas.width, context.canvas.height);
+                context.clip();
+            }
         }
     };
 
@@ -123,21 +126,6 @@
             //hack
             this._setStencilCompositionOperation(node._stencil);
         } else {
-            wrapper.restore();                                 //it use for
-            if (node.inverted) {
-                var canvas = context.canvas;
-                wrapper.save();
-                context.setTransform(1, 0, 0, 1, 0, 0);
-
-                context.moveTo(0, 0);
-                context.lineTo(0, canvas.height);
-                context.lineTo(canvas.width, canvas.height);
-                context.lineTo(canvas.width, 0);
-                context.lineTo(0, 0);
-
-                wrapper.restore();
-            }
-            context.closePath();
             context.clip();
         }
     };