Merge pull request #1078 from BabylonJS/pr/1077

Observable now gets a mask value (Pr/1077)

dist/preview release/what's new.md

@@ -30,6 +30,7 @@
     - LinesMesh class now supports Intersection. Added the intersectionThreshold property to set a tolerance margin during intersection with wire lines. ([nockawa](https://github.com/nockawa))
     - Geometry.boundingBias property to enlarge the boundingInfo objects ([nockawa](https://github.com/nockawa))
     - Tools.ExtractMinAndMax & ExtractMinAndMaxIndexed now supports an optional Bias for Extent computation.
+	- Scene.onPointerObservable property added to enable a unique Observable event for user input (see ArcRotateCamera inputs for examples) ([nockawa](https://github.com/nockawa))
 
   - **API doc**
     - class `SolidParticleSystem` documented

src/Cameras/Inputs/babylon.arcrotatecamera.input.mousewheel.ts

@@ -11,7 +11,7 @@ module BABYLON {
         public attachControl(element: HTMLElement, noPreventDefault?: boolean) {
             this._wheel = (p, s) => {
                 //sanity check - this should be a PointerWheel event.
-                if (p.type !== PointerEventType.PointerWheel) return;
+                if (p.type !== PointerEventTypes.POINTERWHEEL) return;
                 var event = <MouseWheelEvent>p.event;
                 var delta = 0;
                 if (event.wheelDelta) {
@@ -30,7 +30,7 @@ module BABYLON {
                 }
             };
 
-            this._observer = this.camera.getScene().onPointerObservable.add(this._wheel);
+            this._observer = this.camera.getScene().onPointerObservable.add(this._wheel, PointerEventTypes.POINTERWHEEL);
         }
 
         public detachControl(element: HTMLElement) {

src/Cameras/Inputs/babylon.arcrotatecamera.input.pointers.ts

@@ -39,8 +39,8 @@ module BABYLON {
 
             this._pointerInput = (p, s) => {
                 var evt = <PointerEvent>p.event;
-                if (p.type === PointerEventType.PointerDown) {
-                   // evt.srcElement.setPointerCapture(evt.pointerId);
+                if (p.type === PointerEventTypes.POINTERDOWN) {
+//                    evt.srcElement.setPointerCapture(evt.pointerId);
 
                     // Manage panning with right click
                     this._isRightClick = evt.button === 2;
@@ -51,8 +51,8 @@ module BABYLON {
                     if (!noPreventDefault) {
                         evt.preventDefault();
                     }
-                } else if (p.type === PointerEventType.PointerUp) {
-                   // evt.srcElement.releasePointerCapture(evt.pointerId);
+                } else if (p.type === PointerEventTypes.POINTERUP) {
+//                    evt.srcElement.releasePointerCapture(evt.pointerId);
 
                     cacheSoloPointer = null;
                     previousPinchDistance = 0;
@@ -66,7 +66,7 @@ module BABYLON {
                     if (!noPreventDefault) {
                         evt.preventDefault();
                     }
-                } else if (p.type === PointerEventType.PointerMove) {
+                } else if (p.type === PointerEventTypes.POINTERMOVE) {
                     if (!noPreventDefault) {
                         evt.preventDefault();
                     }
@@ -114,7 +114,7 @@ module BABYLON {
                 }
             }
 
-            this._observer = this.camera.getScene().onPointerObservable.add(this._pointerInput);
+            this._observer = this.camera.getScene().onPointerObservable.add(this._pointerInput, PointerEventTypes.POINTERDOWN | PointerEventTypes.POINTERUP | PointerEventTypes.POINTERMOVE);
 
             this._onContextMenu = evt => {
                 evt.preventDefault();

src/Cameras/Inputs/babylon.freecamera.input.mouse.ts

@@ -17,8 +17,8 @@ module BABYLON {
                 var engine = this.camera.getEngine();
                 this._pointerInput = (p, s) => {
                     var evt = <PointerEvent>p.event;
-                    if (p.type === PointerEventType.PointerDown) {
-                     //   evt.srcElement.setPointerCapture(evt.pointerId);
+                    if (p.type === PointerEventTypes.POINTERDOWN) {
+//                        evt.srcElement.setPointerCapture(evt.pointerId);
 
                         this.previousPosition = {
                             x: evt.clientX,
@@ -29,15 +29,15 @@ module BABYLON {
                             evt.preventDefault();
                         }
                     }
-                    else if (p.type === PointerEventType.PointerUp) {
-                      //  evt.srcElement.releasePointerCapture(evt.pointerId);
+                    else if (p.type === PointerEventTypes.POINTERUP) {
+//                        evt.srcElement.releasePointerCapture(evt.pointerId);
                         this.previousPosition = null;
                         if (!noPreventDefault) {
                             evt.preventDefault();
                         }
                     }
 
-                    else if (p.type === PointerEventType.PointerMove) {
+                    else if (p.type === PointerEventTypes.POINTERMOVE) {
                         if (!this.previousPosition && !engine.isPointerLock) {
                             return;
                         }
@@ -68,7 +68,7 @@ module BABYLON {
                 }
             }
 
-            this._observer = this.camera.getScene().onPointerObservable.add(this._pointerInput);
+            this._observer = this.camera.getScene().onPointerObservable.add(this._pointerInput, PointerEventTypes.POINTERDOWN | PointerEventTypes.POINTERUP | PointerEventTypes.POINTERMOVE);
         }
 
         detachControl(element: HTMLElement) {

src/Cameras/Inputs/babylon.freecamera.input.touch.ts

@@ -27,7 +27,7 @@ module BABYLON {
 
                 this._pointerInput = (p, s) => {
                     var evt = <PointerEvent>p.event;
-                    if (p.type === PointerEventType.PointerDown) {
+                    if (p.type === PointerEventTypes.POINTERDOWN) {
                         if (evt.pointerType === "mouse") {
                             return;
                         }
@@ -49,7 +49,7 @@ module BABYLON {
                         };
                     }
 
-                    else if (p.type === PointerEventType.PointerUp) {
+                    else if (p.type === PointerEventTypes.POINTERUP) {
                         if (evt.pointerType === "mouse") {
                             return;
                         }
@@ -74,7 +74,7 @@ module BABYLON {
                         this._offsetY = null;
                     }
 
-                    else if (p.type === PointerEventType.PointerMove) {
+                    else if (p.type === PointerEventTypes.POINTERMOVE) {
                         if (evt.pointerType === "mouse") {
                             return;
                         }
@@ -99,6 +99,8 @@ module BABYLON {
                 }
             }
 
+            this._observer = this.camera.getScene().onPointerObservable.add(this._pointerInput, PointerEventTypes.POINTERDOWN | PointerEventTypes.POINTERUP | PointerEventTypes.POINTERMOVE);
+
             element.addEventListener("blur", this._onLostFocus);
         }
 

src/Tools/babylon.observable.ts

@@ -13,7 +13,7 @@
     }
 
     export class Observer<T> {
-        constructor(public callback: (eventData: T, eventState: EventState) => void) {
+        constructor(public callback: (eventData: T, eventState: EventState) => void, public mask:number) {
         }
     }
 
@@ -25,12 +25,12 @@
          * @param callback the callback that will be executed for that Observer
          * @param insertFirst if true the callback will be inserted at the first position, hence executed before the others ones. If false (default behavior) the callback will be inserted at the last position, executed after all the others already present.
          */
-        public add(callback: (eventData: T, eventState: EventState) => void, insertFirst = false): Observer<T> {
+        public add(callback: (eventData: T, eventState: EventState) => void, mask: number = -1, insertFirst = false): Observer<T> {
             if (!callback) {
                 return null;
             }
 
-            var observer = new Observer(callback);
+            var observer = new Observer(callback, mask);
 
             if (insertFirst) {
                 this._observers.unshift(observer);
@@ -78,11 +78,13 @@
          * Notify all Observers by calling their respective callback with the given data
          * @param eventData
          */
-        public notifyObservers(eventData: T): void {
+        public notifyObservers(eventData: T, mask:number = -1): void {
             var state = new EventState();
 
             for (var obs of this._observers) {
-                obs.callback(eventData, state);
+                if (obs.mask & mask) {
+                    obs.callback(eventData, state);
+                }
                 if (state.skipNextObervers) {
                     break;
                 }

src/babylon.scene.ts

@@ -3,19 +3,40 @@
         dispose(): void;
     }
 
-    /**
-     * Different type of pointer event, enumerations are self explanatory
-     */
-    export const enum PointerEventType {
-        None, PointerDown, PointerUp, PointerMove, PointerWheel, PointerPick
+    export class PointerEventTypes {
+        static _POINTERDOWN  = 0x01;
+        static _POINTERUP    = 0x02;
+        static _POINTERMOVE  = 0x04;
+        static _POINTERWHEEL = 0x08;
+        static _POINTERPICK  = 0x10;
+
+        public static get POINTERDOWN() : number {
+            return PointerEventTypes._POINTERDOWN;
+        }
+
+        public static get POINTERUP(): number {
+            return PointerEventTypes._POINTERUP;
+        }
+
+        public static get POINTERMOVE(): number {
+            return PointerEventTypes._POINTERMOVE;
+        }
+
+        public static get POINTERWHEEL(): number {
+            return PointerEventTypes._POINTERWHEEL;
+        }
+
+        public static get POINTERPICK(): number {
+            return PointerEventTypes._POINTERPICK;
+        }
     }
 
     /**
      * This type contains all the data related to a pointer event in Babylon.js.
-     * The event member is an instnce of PointerEvent for all types except PointerWheel and is of type MouseWheelEvent when type equals PointerWheel
+     * The event member is an instance of PointerEvent for all types except PointerWheel and is of type MouseWheelEvent when type equals PointerWheel. The differents event types can be found in the PointerEventTypes class.
      */
     export class PointerInfo {
-        constructor(public type: PointerEventType, public event: PointerEvent | MouseWheelEvent, public pickInfo: PickingInfo) {
+        constructor(public type: number, public event: PointerEvent | MouseWheelEvent, public pickInfo: PickingInfo) {
         }
     }
 
@@ -660,8 +681,9 @@
                 }
 
                 if (this.onPointerObservable.hasObservers()) {
-                    let pi = new PointerInfo(evt.type === "mousewheel" ? PointerEventType.PointerWheel : PointerEventType.PointerMove, evt, pickResult);
-                    this.onPointerObservable.notifyObservers(pi);
+                    let type = evt.type === "mousewheel" ? PointerEventTypes.POINTERWHEEL : PointerEventTypes.POINTERMOVE;
+                    let pi = new PointerInfo(type, evt, pickResult);
+                    this.onPointerObservable.notifyObservers(pi, type);
                 }
             };
 
@@ -728,8 +750,9 @@
                 }
 
                 if (this.onPointerObservable.hasObservers()) {
-                    let pi = new PointerInfo(PointerEventType.PointerDown, evt, pickResult);
-                    this.onPointerObservable.notifyObservers(pi);
+                    let type = PointerEventTypes.POINTERDOWN;
+                    let pi = new PointerInfo(type, evt, pickResult);
+                    this.onPointerObservable.notifyObservers(pi, type);
                 }
 
                 // Sprites
@@ -779,8 +802,9 @@
                             this.onPointerPick(evt, pickResult);
                         }
                         if (this.onPointerObservable.hasObservers()) {
-                            let pi = new PointerInfo(PointerEventType.PointerPick, evt, pickResult);
-                            this.onPointerObservable.notifyObservers(pi);
+                            let type = PointerEventTypes.POINTERPICK;
+                            let pi = new PointerInfo(type, evt, pickResult);
+                            this.onPointerObservable.notifyObservers(pi, type);
                         }
                     }
                     if (pickResult.pickedMesh.actionManager) {
@@ -800,8 +824,9 @@
                 }
 
                 if (this.onPointerObservable.hasObservers()) {
-                    let pi = new PointerInfo(PointerEventType.PointerUp, evt, pickResult);
-                    this.onPointerObservable.notifyObservers(pi);
+                    let type = PointerEventTypes.POINTERUP;
+                    let pi = new PointerInfo(type, evt, pickResult);
+                    this.onPointerObservable.notifyObservers(pi, type);
                 }
 
                 this._startingPointerTime = 0;