adding map between lifetime and indexes

src/Particles/babylon.particle.ts

@@ -11,26 +11,53 @@
         public angle = 0;
         public angularSpeed = 0;
 
-        constructor(private particleSystem: ParticleSystem, public cellIndex: number = 0, private _loopAnimation = false, private _fromIndex = 0, private _toIndex = 0, private disposeWhenFinishedAnimating = false) {
+        private _currentFrameCounter = 0;
+
+        constructor(private particleSystem: ParticleSystem, public cellIndex: number = 0, private _loopAnimation = false, private _fromIndex = 0, private _toIndex = 0) {
+            this.cellIndex = this._fromIndex;
+
+            if (this.particleSystem.spriteCellChangeSpeed == 0) {
+                this.updateCellIndex = this.updateCellIndexWithSpeedCalculated;
+            }
+            else {
+                this.updateCellIndex = this.updateCellIndexWithCustomSpeed;
+            }
+        }
+
+        public updateCellIndex: (scaledUpdateSpeed: number) => void;
+
+        private updateCellIndexWithSpeedCalculated(scaledUpdateSpeed: number): void {
+            var ageOffset = this.lifeTime - this.age;
+            var numberOfScaledSlots = ageOffset / scaledUpdateSpeed;
+            var availableIndexes = this._toIndex +1 - this.cellIndex;
+            var incrementAt = numberOfScaledSlots / availableIndexes;
+
+            this._currentFrameCounter += scaledUpdateSpeed;
+            if (this._currentFrameCounter >= incrementAt * scaledUpdateSpeed) {
+                this._currentFrameCounter = 0;
+                this.cellIndex++;
+                if (this.cellIndex > this._toIndex) {
+                    this.cellIndex = this._toIndex;
+                }
+            }
         }
 
-        public updateCellIndex(deltaTime: number): void {
-            // this._time += deltaTime;
-            // if (this._time > this._delay) {
-            //     this._time = this._time % this._delay;
-            //     this.cellIndex += this._sheetDirection;
-            //     if (this.cellIndex > this._toIndex) {
-            //         if (this._loopAnimation) {
-            //             this.cellIndex = this._fromIndex;
-            //         }
-            //         else {
-            //             this.cellIndex = this._toIndex;
-            //             if (this.disposeWhenFinishedAnimating) {
-            //                 this.readyForRecycling();
-            //             }
-            //         }
-            //     }
-            // }
+        private updateCellIndexWithCustomSpeed(): void {
+            if (this._currentFrameCounter >= this.particleSystem.spriteCellChangeSpeed) {
+                this.cellIndex++;
+                this._currentFrameCounter = 0;
+                if (this.cellIndex > this._toIndex) {
+                    if (this._loopAnimation) {
+                        this.cellIndex = this._fromIndex;
+                    }
+                    else {
+                        this.cellIndex = this._toIndex;
+                    }
+                }
+            }
+            else {
+                this._currentFrameCounter++;
+            }
         }
 
         public copyTo(other: Particle) {
@@ -48,7 +75,6 @@
             other._loopAnimation = this._loopAnimation;
             other._fromIndex = this._fromIndex;
             other._toIndex = this._toIndex;
-            other.disposeWhenFinishedAnimating = this.disposeWhenFinishedAnimating;
         }
 
         public readyForRecycling() {

src/Particles/babylon.particleSystem.ts

@@ -60,7 +60,6 @@
         public customShader: any = null;
         public preventAutoStart: boolean = false;
 
-        public disposeParticlesWhenFinishedAnimating = false;
         private _epsilon: number;
 
 
@@ -193,7 +192,6 @@
             }
 
             this.updateFunction = (particles: Particle[]): void => {
-                var deltaTime = this._scene.getEngine().getDeltaTime();
                 for (var index = 0; index < particles.length; index++) {
                     var particle = particles[index];
                     particle.age += this._scaledUpdateSpeed;
@@ -219,7 +217,7 @@
                         particle.direction.addInPlace(this._scaledGravity);
 
                         if (this.spriteCellSize) {
-                            particle.updateCellIndex(deltaTime);
+                            particle.updateCellIndex(this._scaledUpdateSpeed);
                         }
                     }
                 }
@@ -290,7 +288,7 @@
             this._vertexData[offset + 10] = offsetY;
         }
 
-        public _appendParticleVertexWithAnimation(index: number, particle: Particle, offsetX: number, offsetY: number, rowSize: number): void {
+        public _appendParticleVertexWithAnimation(index: number, particle: Particle, offsetX: number, offsetY: number): void {
 
             if (offsetX === 0)
                 offsetX = this._epsilon;
@@ -302,9 +300,6 @@
             else if (offsetY === 1)
                 offsetY = 1 - this._epsilon;
 
-            // var rowOffset = (particle.cellIndex / rowSize) >> 0;
-            // var columnOffset = particle.cellIndex - rowOffset * rowSize;
-
             var offset = index * this._vertexBufferSize;
             this._vertexData[offset] = particle.position.x;
             this._vertexData[offset + 1] = particle.position.y;
@@ -317,10 +312,7 @@
             this._vertexData[offset + 8] = particle.size;
             this._vertexData[offset + 9] = offsetX;
             this._vertexData[offset + 10] = offsetY;
-            this._vertexData[offset + 11] = 0;
-            // this._vertexData[offset + 12] = interV;
-            // this._vertexData[offset + 13] = columnOffset;
-            // this._vertexData[offset + 14] = rowOffset;
+            this._vertexData[offset + 11] = particle.cellIndex;
         }
 
         private _update(newParticles: number): void {
@@ -352,7 +344,7 @@
                     particle.cellIndex = this.startSpriteCellID;
                 } else {
                     if (this.spriteCellSize) {
-                        particle = new Particle(this, this.startSpriteCellID, this.spriteCellLoop, this.startSpriteCellID, this.endSpriteCellID, this.disposeParticlesWhenFinishedAnimating);
+                        particle = new Particle(this, this.startSpriteCellID, this.spriteCellLoop, this.startSpriteCellID, this.endSpriteCellID);
                     }
                     else {
                         particle = new Particle(this);
@@ -406,7 +398,7 @@
 
                 if (this.spriteCellSize) {
                     attributesNamesOrOptions = [VertexBuffer.PositionKind, VertexBuffer.ColorKind, "options", "cellIndex"];
-                    effectCreationOption = ["invView", "view", "projection", "textureInfos", "vClipPlane", "textureMask"];
+                    effectCreationOption = ["invView", "view", "projection", "particlesInfos", "vClipPlane", "textureMask"];
                 }
                 else {
                     attributesNamesOrOptions = [VertexBuffer.PositionKind, VertexBuffer.ColorKind, "options"];
@@ -485,10 +477,7 @@
             }
 
             // Animation sheet
-            var rowSize = 0;
             if (this.spriteCellSize) {
-                var baseSize = this.particleTexture.getBaseSize();
-                rowSize = baseSize.width / this._spriteCellWidth;
                 this.appendParticleVertexes = this.appenedParticleVertexesWithSheet;
             }
             else {
@@ -499,23 +488,23 @@
             var offset = 0;
             for (var index = 0; index < this.particles.length; index++) {
                 var particle = this.particles[index];
-                this.appendParticleVertexes(offset, particle, rowSize);
+                this.appendParticleVertexes(offset, particle);
                 offset += 4;
             }
 
             this._vertexBuffer.update(this._vertexData);
         }
 
-        public appendParticleVertexes: (offset: number, particle: Particle, rowSize: number) => void = null;
+        public appendParticleVertexes: (offset: number, particle: Particle) => void = null;
 
-        private appenedParticleVertexesWithSheet(offset: number, particle: Particle, rowSize: number) {
-            this._appendParticleVertexWithAnimation(offset++, particle, 0, 0, rowSize);
-            this._appendParticleVertexWithAnimation(offset++, particle, 1, 0, rowSize);
-            this._appendParticleVertexWithAnimation(offset++, particle, 1, 1, rowSize);
-            this._appendParticleVertexWithAnimation(offset++, particle, 0, 1, rowSize);
+        private appenedParticleVertexesWithSheet(offset: number, particle: Particle) {
+            this._appendParticleVertexWithAnimation(offset++, particle, 0, 0);
+            this._appendParticleVertexWithAnimation(offset++, particle, 1, 0);
+            this._appendParticleVertexWithAnimation(offset++, particle, 1, 1);
+            this._appendParticleVertexWithAnimation(offset++, particle, 0, 1);
         }
 
-        private appenedParticleVertexesNoSheet(offset: number, particle: Particle, rowSize: number) {
+        private appenedParticleVertexesNoSheet(offset: number, particle: Particle) {
             this._appendParticleVertex(offset++, particle, 0, 0);
             this._appendParticleVertex(offset++, particle, 1, 0);
             this._appendParticleVertex(offset++, particle, 1, 1);
@@ -548,7 +537,7 @@
 
             if (this.spriteCellSize) {
                 var baseSize = this.particleTexture.getBaseSize();
-                effect.setFloat3("textureInfos", this._spriteCellWidth / baseSize.width, this._spriteCellHeight / baseSize.height, baseSize.width / this._spriteCellWidth);
+                effect.setFloat3("particlesInfos", this._spriteCellWidth / baseSize.width, this._spriteCellHeight / baseSize.height, baseSize.width / this._spriteCellWidth);
             }
 
             effect.setFloat4("textureMask", this.textureMask.r, this.textureMask.g, this.textureMask.b, this.textureMask.a);

src/Shaders/particles.vertex.fx

@@ -7,7 +7,7 @@ attribute float cellIndex;
 // Uniforms
 uniform mat4 view;
 uniform mat4 projection;
-uniform vec3 textureInfos; // x (number of rows) y(number of columns) z(rowSize)
+uniform vec3 particlesInfos; // x (number of rows) y(number of columns) z(rowSize)
 
 // Output
 varying vec2 vUV;
@@ -41,10 +41,10 @@ void main(void) {
 	vColor = color;
 
 	#ifdef ANIMATESHEET
-	float rowOffset = (cellIndex / textureInfos.z);
-    float columnOffset = cellIndex - rowOffset * textureInfos.z;
+	float rowOffset = floor(cellIndex / particlesInfos.z);
+    float columnOffset = cellIndex - rowOffset * particlesInfos.z;
 
-	vec2 uvScale = textureInfos.xy;
+	vec2 uvScale = particlesInfos.xy;
 	vec2 uvOffset = vec2(offset.x , 1.0 - offset.y);
 	vUV = (uvOffset + vec2(columnOffset, rowOffset)) * uvScale;
 	#else