Intersection/Interaction with Cached Group, WIP.

src/Canvas2d/babylon.canvas2d.ts

@@ -510,7 +510,22 @@
                 return;
             }
 
-            this.intersect(ii);
+            // Special case __cachedCanvasSprite__ (WIP)
+            if (this.id.indexOf("__cachedCanvasSprite__") === 0) {
+                
+            }
+
+
+            // Special case __cachedSpriteOfGroup__
+            else if (this.id.indexOf("__cachedSpriteOfGroup__") === 0) {
+                let ownerGroup = this.getExternalData<Group2D>("__cachedGroup__");
+                ownerGroup.intersect(ii);
+            }
+
+            // Common case
+            else {
+                this.intersect(ii);
+            }
 
             this._previousIntersectionList = this._actualIntersectionList;
             this._actualIntersectionList = ii.intersectedPrimitives;
@@ -1326,7 +1341,8 @@
                 }
 
                 let id = `groupsMapChache${this._mapCounter}forCanvas${this.id}`;
-                map = new MapTexture(id, this._scene, mapSize, useMipMap ? Texture.TRILINEAR_SAMPLINGMODE:Texture.BILINEAR_SAMPLINGMODE, useMipMap);
+                map = new MapTexture(id, this._scene, mapSize, useMipMap ? Texture.TRILINEAR_SAMPLINGMODE : Texture.BILINEAR_SAMPLINGMODE, useMipMap);
+                map.hasAlpha = true;
                 map.anisotropicFilteringLevel = 4;
                 mapArray.splice(0, 0, map);
 
@@ -1351,6 +1367,12 @@
                 else {
                     let sprite = new Sprite2D(map, { parent: parent, id: `__cachedSpriteOfGroup__${group.id}`, x: group.actualPosition.x, y: group.actualPosition.y, spriteSize: node.contentSize, spriteLocation: node.pos });
                     sprite.origin = group.origin.clone();
+                    sprite.addExternalData("__cachedGroup__", group);
+                    sprite.pointerEventObservable.add((e, s) => {
+                        if (group.pointerEventObservable !== null) {
+                            group.pointerEventObservable.notifyObservers(e, s.mask);
+                        }
+                    });
                     res.sprite = sprite;
                 }
             }

src/Canvas2d/babylon.group2d.ts

@@ -833,23 +833,30 @@
         protected handleGroupChanged(prop: Prim2DPropInfo) {
             // This method is only for cachedGroup
             let rd = this._renderableData;
+            if (!rd) {
+                return;
+            }
 
-            if (!this.isCachedGroup || !rd._cacheRenderSprite) {
+            let cachedSprite = rd._cacheRenderSprite;
+            if (!this.isCachedGroup || !cachedSprite) {
                 return;
             }
 
             // For now we only support these property changes
             // TODO: add more! :)
             if (prop.id === Prim2DBase.actualPositionProperty.id) {
-                rd._cacheRenderSprite.actualPosition = this.actualPosition.clone();
+                cachedSprite.actualPosition = this.actualPosition.clone();
+                if (cachedSprite.position != null) {
+                    cachedSprite.position = cachedSprite.actualPosition.clone();
+                }
             } else if (prop.id === Prim2DBase.rotationProperty.id) {
-                rd._cacheRenderSprite.rotation = this.rotation;
+                cachedSprite.rotation = this.rotation;
             } else if (prop.id === Prim2DBase.scaleProperty.id) {
-                rd._cacheRenderSprite.scale = this.scale;
+                cachedSprite.scale = this.scale;
             } else if (prop.id === Prim2DBase.originProperty.id) {
-                rd._cacheRenderSprite.origin = this.origin.clone();
+                cachedSprite.origin = this.origin.clone();
             } else if (prop.id === Group2D.actualSizeProperty.id) {
-                rd._cacheRenderSprite.size = this.actualSize.clone();
+                cachedSprite.size = this.actualSize.clone();
                 //console.log(`[${this._globalTransformProcessStep}] Sync Sprite ${this.id}, width: ${this.actualSize.width}, height: ${this.actualSize.height}`);
             }
         }

src/Canvas2d/babylon.prim2dBase.ts

@@ -2213,6 +2213,7 @@
          * Get the global transformation matrix of the primitive
          */
         public get globalTransform(): Matrix {
+            this._updateLocalTransform();
             return this._globalTransform;
         }
 
@@ -2238,6 +2239,7 @@
          * Get invert of the global transformation matrix of the primitive
          */
         public get invGlobalTransform(): Matrix {
+            this._updateLocalTransform();
             return this._invGlobalTransform;
         }
 
@@ -2385,6 +2387,12 @@
                 return false;
             }
 
+            let id = this.id;
+            if (id!=null && id.indexOf("__cachedSpriteOfGroup__") === 0) {
+                let ownerGroup = this.getExternalData<Group2D>("__cachedGroup__");
+                return ownerGroup.intersect(intersectInfo);
+            }
+
             // Fast rejection test with boundingInfo
             if (this.isPickable && !this.boundingInfo.doesIntersect(intersectInfo._localPickPosition)) {
                 // Important to call this before each return to allow a good recursion next time this intersectInfo is reused