Raw texture step 1

Improving renderloop management

Babylon/Materials/textures/babylon.rawTexture.js

@@ -0,0 +1,19 @@
+var __extends = this.__extends || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    __.prototype = b.prototype;
+    d.prototype = new __();
+};
+var BABYLON;
+(function (BABYLON) {
+    var RawTexture = (function (_super) {
+        __extends(RawTexture, _super);
+        function RawTexture(scene, samplingMode) {
+            if (typeof samplingMode === "undefined") { samplingMode = BABYLON.Texture.TRILINEAR_SAMPLINGMODE; }
+            _super.call(this, null, scene, false, false);
+        }
+        return RawTexture;
+    })(BABYLON.Texture);
+    BABYLON.RawTexture = RawTexture;
+})(BABYLON || (BABYLON = {}));
+//# sourceMappingURL=babylon.rawTexture.js.map

Babylon/Materials/textures/babylon.rawTexture.ts

@@ -0,0 +1,7 @@
+module BABYLON {
+    export class RawTexture extends Texture {
+        constructor(scene: Scene, samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE) {
+            super(null, scene, false, false);
+        }
+    }
+}

Babylon/babylon.engine.js

@@ -368,9 +368,10 @@
             this.renderEvenInBackground = true;
             this.scenes = new Array();
             this._windowIsBackground = false;
-            this._runningLoop = false;
             this._loadingDivBackgroundColor = "black";
             this._drawCalls = 0;
+            this._renderingQueueLaunched = false;
+            this._activeRenderLoops = [];
             // FPS
             this.fpsRange = 60;
             this.previousFramesDuration = [];
@@ -625,9 +626,17 @@
             this._depthCullingState.depthFunc = this._gl.LEQUAL;
         };
 
-        Engine.prototype.stopRenderLoop = function () {
-            this._renderFunction = null;
-            this._runningLoop = false;
+        Engine.prototype.stopRenderLoop = function (renderFunction) {
+            if (!renderFunction) {
+                this._activeRenderLoops = [];
+                return;
+            }
+
+            var index = this._activeRenderLoops.indexOf(renderFunction);
+
+            if (index >= 0) {
+                this._activeRenderLoops.splice(index, 1);
+            }
         };
 
         Engine.prototype._renderLoop = function () {
@@ -641,31 +650,40 @@
                 // Start new frame
                 this.beginFrame();
 
-                if (this._renderFunction) {
-                    this._renderFunction();
+                for (var index = 0; index < this._activeRenderLoops.length; index++) {
+                    var renderFunction = this._activeRenderLoops[index];
+
+                    renderFunction();
                 }
 
                 // Present
                 this.endFrame();
             }
 
-            if (this._runningLoop) {
+            if (this._activeRenderLoops.length > 0) {
                 // Register new frame
                 BABYLON.Tools.QueueNewFrame(function () {
                     _this._renderLoop();
                 });
+            } else {
+                this._renderingQueueLaunched = false;
             }
         };
 
         Engine.prototype.runRenderLoop = function (renderFunction) {
             var _this = this;
-            this._runningLoop = true;
+            if (this._activeRenderLoops.indexOf(renderFunction) !== -1) {
+                return;
+            }
 
-            this._renderFunction = renderFunction;
+            this._activeRenderLoops.push(renderFunction);
 
-            BABYLON.Tools.QueueNewFrame(function () {
-                _this._renderLoop();
-            });
+            if (!this._renderingQueueLaunched) {
+                this._renderingQueueLaunched = true;
+                BABYLON.Tools.QueueNewFrame(function () {
+                    _this._renderLoop();
+                });
+            }
         };
 
         Engine.prototype.switchFullscreen = function (requestPointerLock) {

Babylon/babylon.engine.ts

@@ -415,9 +415,6 @@
         private _pointerLockRequested: boolean;
         private _alphaTest: boolean;
 
-        private _runningLoop = false;
-        private _renderFunction: () => void;
-
         private _resizeLoadingUI: () => void;
         private _loadingDiv: HTMLDivElement;
         private _loadingTextDiv: HTMLDivElement;
@@ -425,6 +422,9 @@
 
         private _drawCalls = 0;
 
+        private _renderingQueueLaunched = false;
+        private _activeRenderLoops = [];
+
         // FPS
         private fpsRange = 60;
         private previousFramesDuration = [];
@@ -636,9 +636,17 @@
             this._depthCullingState.depthFunc = this._gl.LEQUAL;
         }
 
-        public stopRenderLoop(): void {
-            this._renderFunction = null;
-            this._runningLoop = false;
+        public stopRenderLoop(renderFunction?: () => void): void {
+            if (!renderFunction) {
+                this._activeRenderLoops = [];
+                return;
+            }
+
+            var index = this._activeRenderLoops.indexOf(renderFunction);
+
+            if (index >= 0) {
+                this._activeRenderLoops.splice(index, 1);
+            }
         }
 
         public _renderLoop(): void {
@@ -651,30 +659,39 @@
                 // Start new frame
                 this.beginFrame();
 
-                if (this._renderFunction) {
-                    this._renderFunction();
+                for (var index = 0; index < this._activeRenderLoops.length; index++) {
+                    var renderFunction = this._activeRenderLoops[index];
+
+                    renderFunction();
                 }
 
                 // Present
                 this.endFrame();
             }
 
-            if (this._runningLoop) {
+            if (this._activeRenderLoops.length > 0) {
                 // Register new frame
                 BABYLON.Tools.QueueNewFrame(() => {
                     this._renderLoop();
                 });
+            } else {
+                this._renderingQueueLaunched = false;
             }
         }
 
         public runRenderLoop(renderFunction: () => void): void {
-            this._runningLoop = true;
+            if (this._activeRenderLoops.indexOf(renderFunction) !== -1) {
+                return;
+            }
 
-            this._renderFunction = renderFunction;
+            this._activeRenderLoops.push(renderFunction);
 
-            BABYLON.Tools.QueueNewFrame(() => {
-                this._renderLoop();
-            });
+            if (!this._renderingQueueLaunched) {
+                this._renderingQueueLaunched = true;
+                BABYLON.Tools.QueueNewFrame(() => {
+                    this._renderLoop();
+                });
+            }
         }
 
         public switchFullscreen(requestPointerLock: boolean): void {

Tools/BuildOurOwnBabylonJS/BuildOurOwnBabylonJS/babylonJS.xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <files xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="babylonJS.xsd">
+  <script src="Babylon/Materials/Textures/babylon.rawTexture.js"></script>
   <script src="Babylon/Audio/babylon.audioengine.js"></script>
   <script src="Babylon/Audio/babylon.sound.js"></script>
   <script src="Babylon/Audio/babylon.soundtrack.js"></script>

Tools/Gulp/gulpfile.js

@@ -165,7 +165,8 @@ gulp.task('scripts', ['shaders'] ,function() {
       '../../Babylon/Audio/babylon.audioengine.js',
       '../../Babylon/Audio/babylon.sound.js',
       '../../Babylon/Audio/babylon.soundtrack.js',
-      '../../Babylon/Debug/babylon.debugLayer.js'
+      '../../Babylon/Debug/babylon.debugLayer.js',
+      '../../Babylon/Materials/Textures/babylon.rawTexture.js'
     ])
     .pipe(concat('babylon.js'))
     .pipe(gulp.dest('build/'))

babylon.2.0.d.ts

@@ -79,13 +79,17 @@ declare module BABYLON {
         private _caps;
         private _pointerLockRequested;
         private _alphaTest;
-        private _runningLoop;
-        private _renderFunction;
         private _resizeLoadingUI;
         private _loadingDiv;
         private _loadingTextDiv;
         private _loadingDivBackgroundColor;
         private _drawCalls;
+        private _renderingQueueLaunched;
+        private _activeRenderLoops;
+        private fpsRange;
+        private previousFramesDuration;
+        private fps;
+        private deltaTime;
         private _depthCullingState;
         private _alphaState;
         private _alphaMode;
@@ -120,7 +124,7 @@ declare module BABYLON {
         public setDepthFunctionToGreaterOrEqual(): void;
         public setDepthFunctionToLess(): void;
         public setDepthFunctionToLessOrEqual(): void;
-        public stopRenderLoop(): void;
+        public stopRenderLoop(renderFunction?: () => void): void;
         public _renderLoop(): void;
         public runRenderLoop(renderFunction: () => void): void;
         public switchFullscreen(requestPointerLock: boolean): void;
@@ -197,6 +201,9 @@ declare module BABYLON {
         public loadingUIText : string;
         public loadingUIBackgroundColor : string;
         public hideLoadingUI(): void;
+        public getFps(): number;
+        public getDeltaTime(): number;
+        private _measureFps();
         static isSupported(): boolean;
     }
 }
@@ -2024,6 +2031,11 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+    class RawTexture extends Texture {
+        constructor(scene: Scene, samplingMode?: number);
+    }
+}
+declare module BABYLON {
     class RenderTargetTexture extends Texture {
         public renderList: AbstractMesh[];
         public renderParticles: boolean;
@@ -3246,6 +3258,7 @@ declare module BABYLON {
         public maxAngularSpeed: number;
         public particleTexture: Texture;
         public onDispose: () => void;
+        public updateFunction: (particles: Particle[]) => void;
         public blendMode: number;
         public forceDepthWrite: boolean;
         public gravity: Vector3;
@@ -4118,9 +4131,6 @@ declare module BABYLON {
             name: string;
             handler: EventListener;
         }[]): void;
-        static GetFps(): number;
-        static GetDeltaTime(): number;
-        static _MeasureFps(): void;
         static CreateScreenshot(engine: Engine, camera: Camera, size: any): void;
         static ValidateXHRData(xhr: XMLHttpRequest, dataType?: number): boolean;
         private static _NoneLogLevel;
@@ -4164,6 +4174,7 @@ declare module BABYLON {
         static StartPerformanceCounter: (counterName: string, condition?: boolean) => void;
         static EndPerformanceCounter: (counterName: string, condition?: boolean) => void;
         static Now : number;
+        static GetFps(): number;
     }
 }
 declare module BABYLON.Internals {