gui: pick works on mesh mode

gui/readme.md

@@ -13,4 +13,4 @@ The Babylon.js GUI library is an extension you can use to generate interactive u
 * Text wrapping
 
 ==> ideas
-* lines (with cap)
+* pick on mesh

gui/src/advancedDynamicTexture.ts

@@ -132,6 +132,7 @@ module BABYLON.GUI {
             }
 
             // Render
+            context.font = "18px Arial";
             var measure = new Measure(0, 0, renderWidth, renderHeight);
             this._rootContainer._draw(measure, context);
         }
@@ -171,11 +172,24 @@ module BABYLON.GUI {
 
             var material = new BABYLON.StandardMaterial("AdvancedDynamicTextureMaterial", mesh.getScene());
             material.backFaceCulling = false;
+            material.diffuseColor = BABYLON.Color3.Black();
+            material.specularColor = BABYLON.Color3.Black();
             material.emissiveTexture = result;
             material.opacityTexture = result;
 
             mesh.material = material;
 
+            mesh.getScene().onPointerObservable.add(function(pi, state) {
+                if (pi.type !== BABYLON.PointerEventTypes.POINTERUP && pi.type !== BABYLON.PointerEventTypes.POINTERDOWN) {
+                    return;
+                }
+
+                if (pi.pickInfo.hit && pi.pickInfo.pickedMesh === mesh) {
+                    var uv = pi.pickInfo.getTextureCoordinates();
+                    result._doPicking(uv.x * width, (1.0 - uv.y) * height, pi.type);
+                }
+            });
+
             return result;
         }
 

gui/src/controls/button.ts

@@ -20,15 +20,12 @@ module BABYLON.GUI {
         }
 
         protected _onPointerEnter(): void {
-            this.scaleX += 0.01;
-            this.scaleY += 0.01;
+            this.alpha -= 0.2;
             super._onPointerEnter();
         }
 
         protected _onPointerOut(): void {
-            this.scaleX -= 0.01;
-            this.scaleY -= 0.01;
-
+            this.alpha += 0.2;
             super._onPointerOut();
         }
 

gui/src/controls/control.ts

@@ -7,8 +7,8 @@ module BABYLON.GUI {
         public _root: Container;
         public _host: AdvancedDynamicTexture;
         public _currentMeasure = Measure.Empty();
-        private _fontFamily: string;
-        private _fontSize = 18;
+        private _fontFamily = "Arial";
+        private _fontSize: number;
         private _font: string;
         private _width = new ValueAndUnit(1, ValueAndUnit.UNITMODE_PERCENTAGE, false);
         private _height = new ValueAndUnit(1, ValueAndUnit.UNITMODE_PERCENTAGE, false);
@@ -348,7 +348,6 @@ module BABYLON.GUI {
 
         // Functions
         constructor(public name: string) {
-            this.fontFamily = "Arial";
         }
 
         public linkWithMesh(mesh: AbstractMesh): void {

gui/src/controls/line.ts

@@ -12,7 +12,6 @@ module BABYLON.GUI {
         private _y2 = 0;
         private _dash = new Array<number>();
         private _connectedControl: Control;
-        private _connectedControlDirtyObserver: Observer<Control>;
 
         public get dash(): Array<number> {
             return this._dash;
@@ -36,15 +35,6 @@ module BABYLON.GUI {
                 return;
             }
 
-            if (this._connectedControlDirtyObserver && this._connectedControl) {
-                this._connectedControl.onDirtyObservable.remove(this._connectedControlDirtyObserver);
-                this._connectedControlDirtyObserver = null;
-            }
-
-            if (value) {
-                this._connectedControlDirtyObserver = value.onDirtyObservable.add(() => this._markAsDirty());
-            }
-
             this._connectedControl = value;
             this._markAsDirty();
         }              

gui/src/controls/stackPanel.ts

@@ -10,6 +10,7 @@ module BABYLON.GUI {
         protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void {
             var top = 0;
             for (var child of this._children) {
+                child._currentMeasure.copyFrom(parentMeasure);
                 child._measure();
                 child.top = top + "px";
                 top += child._currentMeasure.height;