Example of fireMaterial?? (SOLVED)

[JCPalmer]

I looked around for an example of FireMaterial, but no luck.  I see a candle, but not a place where the source for this exists.  I know there is a search-able playground list, but saw no search button on the PG.

I coded something up based on setting properties based on what its Parse loaded.  I did not do any adds of textures.  Is it absolutely required?  Basically, I wanted to a special effect where a mesh appears on a scene briefly on fire.  The mesh may or may not have a UV.

For this all I get is a white solid (with 50% alpha) for 250 millis.  Does this even sound doable?

/// <reference path="./Mesh.ts"/>
/// <reference path="./queue/MotionEvent.ts"/>
/// <reference path="./queue/EventSeries.ts"/>
module QI {
    export class FireEntrance extends QI.Mesh{
        // nothing to do in constructor, so leave it to super
        
        private _inlineSound : BABYLON.Sound; // todo
        
        /** @override */
        public performCustomGrandEntrance() : void {
            if (!BABYLON.FireMaterial) throw "QI.FireEntrance:  Fire Material library not found";
            var materialHold = this.material;
            
            var fire = new BABYLON.FireMaterial("Fire Entrance", this.getScene() );
            fire.diffuseColor = new BABYLON.Color3(0.8, 0.1, 0);
            fire.speed = 1.0;
            fire.alpha = 0.5;
//            fire.checkReadyOnlyOnce = true;
            
            // diffuseTexture, distortionTexture, opacityTexture
            
            this.material = fire;
            
            // queue a return to actual material
            var ref = this;
            var series = new EventSeries([
                function(){ref.isVisible = true;},   // make visible
                new Stall(250, this._inlineSound),  // stall for a while, starting sound
                function(){
                    // resume with original material & make any children visible as well
                    ref.material = materialHold;
                    ref.makeVisible(true);

                    // eliminate resources
                    fire.dispose();                  
                    // this._inlineSound.dispose();
                }
            ]);
            this.queueEventSeries(series);
        }
    }
}

 

[JohnK]

You will find information and examples in the BJS documentation under the Extensions heading. The PG search facility is found using the Playground heading in the BJS documentation. Note as fireMaterial is an extension you need to add the code to your project.

[JCPalmer]

Thanks.  Yes, I knew FireMaterial was its own JS file, hence the check & throwing exception above.  I thought 'Extensions' was something else, so I never clicked it before.  Have it now.

[JCPalmer]

Epilogue:

I got the 3 fire textures from the repo. I converted them to jpegs,  then to base64, and in-lined them into source code.  When I applied the fire material to the mesh, it was kind of spotty, shown at bottom.  I also tried adding a plane to display the fire.  The fire was opaque, so the plane was placed in front of mesh, but even with billboard mode did not always cover.  Here is a video fire entrance.avi  (length due to operating controls)

Perhaps if I did not just rip off the textures, I could have something that was worthy of publishing.  Either way it would not be in QueuedInterpolation extension itself, as it doubled the min.js file to 87 kb due to the textures.