Procedural textures - step 3

Babylon/Audio/babylon.sound.js

@@ -14,7 +14,7 @@
             this.autoplay = false;
             this.loop = false;
             this._position = BABYLON.Vector3.Zero();
-            this._direction = BABYLON.Vector3.Zero();
+            this._localDirection = new BABYLON.Vector3(1, 0, 0);
             this._isLoaded = false;
             this._isReadyToPlay = false;
             this._isPlaying = false;
@@ -41,11 +41,20 @@
             }
 
             if (this._audioEngine.canUseWebAudio) {
+                this._soundGain = this._audioEngine.audioContext.createGain();
+                this._soundGain.connect(this._audioEngine.masterGain);
+                this._soundPanner = this._audioEngine.audioContext.createPanner();
+                this._soundPanner.connect(this._soundGain);
                 BABYLON.Tools.LoadFile(url, function (data) {
                     _this._soundLoaded(data);
                 }, null, null, true);
             }
         }
+        Sound.prototype.connectToSoundTrackAudioNode = function (soundTrackAudioNode) {
+            this._soundGain.disconnect();
+            this._soundGain.connect(soundTrackAudioNode);
+        };
+
         /**
         * Transform this sound into a directional source
         * @param coneInnerAngle Size of the inner cone in degree
@@ -76,34 +85,41 @@
             }
         };
 
-        Sound.prototype.setDirection = function (newDirection) {
-            this._direction = newDirection;
+        Sound.prototype.setLocalDirectionToMesh = function (newLocalDirection) {
+            this._localDirection = newLocalDirection;
 
-            if (this._isPlaying) {
-                console.log(this._direction.x + " " + this._direction.y + " " + this._direction.z);
-                this._soundPanner.setOrientation(this._direction.x, this._direction.y, this._direction.z);
+            if (this._connectedMesh && this._isPlaying) {
+                this._updateDirection();
             }
         };
 
-        Sound.prototype.play = function () {
+        Sound.prototype._updateDirection = function () {
+            var mat = this._connectedMesh.getWorldMatrix();
+            var direction = BABYLON.Vector3.TransformNormal(this._localDirection, mat);
+            direction.normalize();
+            this._soundPanner.setOrientation(direction.x, direction.y, direction.z);
+        };
+
+        /**
+        * Play the sound
+        * @param time (optional) Start the sound after X seconds. Start immediately (0) by default.
+        */
+        Sound.prototype.play = function (time) {
             if (this._isReadyToPlay) {
                 try  {
+                    var startTime = time ? this._audioEngine.audioContext.currentTime + time : 0;
                     this._soundSource = this._audioEngine.audioContext.createBufferSource();
                     this._soundSource.buffer = this._audioBuffer;
-                    this._soundPanner = this._audioEngine.audioContext.createPanner();
                     this._soundPanner.setPosition(this._position.x, this._position.y, this._position.z);
-
-                    //this._soundPanner.maxDistance = this.maxDistance;
                     if (this._isDirectional) {
                         this._soundPanner.coneInnerAngle = this._coneInnerAngle;
                         this._soundPanner.coneOuterAngle = this._coneOuterAngle;
                         this._soundPanner.coneOuterGain = this._coneOuterGain;
-                        this._soundPanner.setOrientation(this._direction.x, this._direction.y, this._direction.z);
+                        this._soundPanner.setOrientation(this._localDirection.x, this._localDirection.y, this._localDirection.z);
                     }
-                    this._soundPanner.connect(this._audioEngine.masterGain);
                     this._soundSource.connect(this._soundPanner);
                     this._soundSource.loop = this.loop;
-                    this._soundSource.start(0);
+                    this._soundSource.start(startTime);
                     this._isPlaying = true;
                 } catch (ex) {
                     BABYLON.Tools.Error("Error while trying to play audio: " + this._name + ", " + ex.message);
@@ -111,16 +127,23 @@
             }
         };
 
-        Sound.prototype.stop = function () {
-            this._soundSource.stop(0);
+        /**
+        * Stop the sound
+        * @param time (optional) Stop the sound after X seconds. Stop immediately (0) by default.
+        */
+        Sound.prototype.stop = function (time) {
+            var stopTime = time ? this._audioEngine.audioContext.currentTime + time : 0;
+            this._soundSource.stop(stopTime);
             this._isPlaying = false;
         };
 
         Sound.prototype.pause = function () {
+            //this._soundSource.p
         };
 
         Sound.prototype.attachToMesh = function (meshToConnectTo) {
             var _this = this;
+            this._connectedMesh = meshToConnectTo;
             meshToConnectTo.registerAfterWorldMatrixUpdate(function (connectedMesh) {
                 return _this._onRegisterAfterWorldMatrixUpdate(connectedMesh);
             });
@@ -128,11 +151,8 @@
 
         Sound.prototype._onRegisterAfterWorldMatrixUpdate = function (connectedMesh) {
             this.setPosition(connectedMesh.position);
-            if (this._isDirectional) {
-                var mat = connectedMesh.getWorldMatrix();
-                var direction = BABYLON.Vector3.TransformNormal(new BABYLON.Vector3(0, 0, 1), mat);
-                direction.normalize();
-                this.setDirection(direction);
+            if (this._isDirectional && this._isPlaying) {
+                this._updateDirection();
             }
         };
 

Babylon/Audio/babylon.sound.ts

@@ -1,11 +1,10 @@
 module BABYLON {
     export class Sound {
-        private _audioBuffer;
         public maxDistance: number = 10;
         public autoplay: boolean = false;
         public loop: boolean = false;
         private _position: Vector3 = Vector3.Zero();
-        private _direction: Vector3 = Vector3.Zero();
+        private _localDirection: Vector3 = new Vector3(1,0,0);
         private _volume: number;
         private _currentVolume: number;
         private _isLoaded: boolean = false;
@@ -14,8 +13,10 @@
         private _isDirectional: boolean = false;
         private _audioEngine: BABYLON.AudioEngine;
         private _readyToPlayCallback;
+        private _audioBuffer;
         private _soundSource: AudioBufferSourceNode;
         private _soundPanner: PannerNode;
+        private _soundGain: GainNode;
         // Used if you'd like to create a directional sound.
         // If not set, the sound will be omnidirectional
         private _coneInnerAngle: number = null;
@@ -23,6 +24,7 @@
         private _coneOuterGain: number = null;
         private _scene: BABYLON.Scene;
         private _name: string;
+        private _connectedMesh: BABYLON.AbstractMesh;
 
         /**
         * Create a sound and attach it to a scene
@@ -43,10 +45,19 @@
             }
 
             if (this._audioEngine.canUseWebAudio) {
+                this._soundGain = this._audioEngine.audioContext.createGain();
+                this._soundGain.connect(this._audioEngine.masterGain);
+                this._soundPanner = this._audioEngine.audioContext.createPanner();
+                this._soundPanner.connect(this._soundGain);
                 BABYLON.Tools.LoadFile(url, (data) => { this._soundLoaded(data); }, null, null, true);
             }
         }
 
+        public connectToSoundTrackAudioNode(soundTrackAudioNode: AudioNode) {
+            this._soundGain.disconnect();
+            this._soundGain.connect(soundTrackAudioNode);
+        }
+
         /**
         * Transform this sound into a directional source
         * @param coneInnerAngle Size of the inner cone in degree
@@ -77,33 +88,41 @@
             }
         }
 
-        public setDirection(newDirection: Vector3) {
-            this._direction = newDirection;
+        public setLocalDirectionToMesh(newLocalDirection: Vector3) {
+            this._localDirection = newLocalDirection;
 
-            if (this._isPlaying) {
-                console.log(this._direction.x + " " + this._direction.y + " " + this._direction.z);
-                this._soundPanner.setOrientation(this._direction.x, this._direction.y, this._direction.z);
+            if (this._connectedMesh && this._isPlaying) {
+                this._updateDirection();
             }
         }
 
-        public play() {
+        private _updateDirection() {
+            var mat = this._connectedMesh.getWorldMatrix();
+            var direction = BABYLON.Vector3.TransformNormal(this._localDirection, mat);
+            direction.normalize();
+            this._soundPanner.setOrientation(direction.x, direction.y, direction.z);
+        }
+
+        /**
+        * Play the sound
+        * @param time (optional) Start the sound after X seconds. Start immediately (0) by default.
+        */
+        public play(time?: number) {
             if (this._isReadyToPlay) {
                 try {
+                    var startTime = time ? this._audioEngine.audioContext.currentTime + time : 0;
                     this._soundSource = this._audioEngine.audioContext.createBufferSource();
                     this._soundSource.buffer = this._audioBuffer;
-                    this._soundPanner = this._audioEngine.audioContext.createPanner();
                     this._soundPanner.setPosition(this._position.x, this._position.y, this._position.z);
-                    //this._soundPanner.maxDistance = this.maxDistance;
                     if (this._isDirectional) {
                         this._soundPanner.coneInnerAngle = this._coneInnerAngle;
                         this._soundPanner.coneOuterAngle = this._coneOuterAngle;
                         this._soundPanner.coneOuterGain = this._coneOuterGain;
-                        this._soundPanner.setOrientation(this._direction.x, this._direction.y, this._direction.z);
+                        this._soundPanner.setOrientation(this._localDirection.x, this._localDirection.y, this._localDirection.z);
                     }
-                    this._soundPanner.connect(this._audioEngine.masterGain);
                     this._soundSource.connect(this._soundPanner);
                     this._soundSource.loop = this.loop;
-                    this._soundSource.start(0);
+                    this._soundSource.start(startTime);
                     this._isPlaying = true;
                 }
                 catch (ex) {
@@ -112,25 +131,29 @@
             }
         }
 
-        public stop() {
-            this._soundSource.stop(0);
+        /**
+        * Stop the sound
+        * @param time (optional) Stop the sound after X seconds. Stop immediately (0) by default.
+        */
+        public stop(time?: number) {
+            var stopTime = time ? this._audioEngine.audioContext.currentTime + time : 0;
+            this._soundSource.stop(stopTime);
             this._isPlaying = false;
         }
 
         public pause() {
+            //this._soundSource.p
         }
 
         public attachToMesh(meshToConnectTo: BABYLON.AbstractMesh) {
+            this._connectedMesh = meshToConnectTo;
             meshToConnectTo.registerAfterWorldMatrixUpdate((connectedMesh: BABYLON.AbstractMesh) => this._onRegisterAfterWorldMatrixUpdate(connectedMesh));
         }
 
         private _onRegisterAfterWorldMatrixUpdate(connectedMesh: BABYLON.AbstractMesh) {
             this.setPosition(connectedMesh.position);
-            if (this._isDirectional) {
-                var mat = connectedMesh.getWorldMatrix();
-                var direction = BABYLON.Vector3.TransformNormal(new BABYLON.Vector3(0, 0, 1), mat);
-                direction.normalize();
-                this.setDirection(direction);
+            if (this._isDirectional && this._isPlaying) {
+                this._updateDirection();
             }
         }
 

Babylon/Audio/babylon.soundtrack.js

@@ -0,0 +1,31 @@
+var BABYLON;
+(function (BABYLON) {
+    var SoundTrack = (function () {
+        function SoundTrack(scene, options) {
+            this._scene = scene;
+            this._audioEngine = scene.getEngine().getAudioEngine();
+            this._trackGain = this._audioEngine.audioContext.createGain();
+            this._trackConvolver = this._audioEngine.audioContext.createConvolver();
+            this._trackConvolver.connect(this._trackGain);
+            this._trackGain.connect(this._audioEngine.masterGain);
+            this._soundCollection = new Array();
+            this._scene._soundTracks.push(this);
+        }
+        SoundTrack.prototype.AddSound = function (newSound) {
+            newSound.connectToSoundTrackAudioNode(this._trackConvolver);
+            this._soundCollection.push(newSound);
+        };
+
+        SoundTrack.prototype.RemoveSound = function (sound) {
+        };
+
+        SoundTrack.prototype.setVolume = function (newVolume) {
+            if (this._audioEngine.canUseWebAudio) {
+                this._trackGain.gain.value = newVolume;
+            }
+        };
+        return SoundTrack;
+    })();
+    BABYLON.SoundTrack = SoundTrack;
+})(BABYLON || (BABYLON = {}));
+//# sourceMappingURL=babylon.soundtrack.js.map

Babylon/Audio/babylon.soundtrack.ts

@@ -0,0 +1,37 @@
+module BABYLON {
+    export class SoundTrack {
+        private _audioEngine: BABYLON.AudioEngine;
+        private _trackGain: GainNode;
+        private _trackConvolver: ConvolverNode;
+        private _scene: BABYLON.Scene;
+        private _id: number;
+        private _soundCollection: Array<BABYLON.Sound>;
+
+        constructor(scene: BABYLON.Scene, options?) {
+            this._scene = scene;
+            this._audioEngine = scene.getEngine().getAudioEngine();
+            this._trackGain = this._audioEngine.audioContext.createGain();
+            this._trackConvolver = this._audioEngine.audioContext.createConvolver();
+            this._trackConvolver.connect(this._trackGain);
+            this._trackGain.connect(this._audioEngine.masterGain);
+            this._soundCollection = new Array();
+            this._scene._soundTracks.push(this);
+        }
+
+        public AddSound(newSound: BABYLON.Sound) {
+            newSound.connectToSoundTrackAudioNode(this._trackConvolver);
+            this._soundCollection.push(newSound);
+        }
+
+        public RemoveSound(sound: BABYLON.Sound) {
+            
+        }
+
+        public setVolume(newVolume: number) {
+            if (this._audioEngine.canUseWebAudio) {
+                this._trackGain.gain.value = newVolume;
+            }
+        }
+     
+    }
+}

Babylon/Materials/textures/Procedurals/babylon.customProceduralTexture.js

@@ -9,28 +9,25 @@ var BABYLON;
     var CustomProceduralTexture = (function (_super) {
         __extends(CustomProceduralTexture, _super);
         function CustomProceduralTexture(name, texturePath, size, scene, fallbackTexture, generateMipMaps) {
-            _super.call(this, name, size, "empty", scene, fallbackTexture, generateMipMaps);
+            _super.call(this, name, size, null, scene, fallbackTexture, generateMipMaps);
             this._animate = true;
             this._time = 0;
-            this._shaderLoaded = false;
-            this._updateTexture = false;
             this._texturePath = texturePath;
 
-            //readJson
+            //Try to load json
             this.loadJson(texturePath);
             this.refreshRate = 1;
         }
         CustomProceduralTexture.prototype.loadJson = function (jsonUrl) {
+            var _this = this;
             var that = this;
 
             function noConfigFile() {
-                BABYLON.Tools.Log("No config file found in " + jsonUrl + " trying as a shaderstore or dom");
+                BABYLON.Tools.Log("No config file found in " + jsonUrl + " trying to use ShaderStore or DOM element");
                 try  {
-                    that._customFragment = that._texturePath;
-                    that._updateTexture = true;
-                    that._shaderLoaded = true;
+                    that.setFragment(that._texturePath);
                 } catch (ex) {
-                    BABYLON.Tools.Error("No json or shaderStore or Dom element found for the Custom Procedural Texture");
+                    BABYLON.Tools.Error("No json or ShaderStore or DOM element found for CustomProceduralTexture");
                 }
             }
 
@@ -41,10 +38,14 @@ var BABYLON;
             xhr.addEventListener("load", function () {
                 if (xhr.status === 200 || BABYLON.Tools.ValidateXHRData(xhr, 1)) {
                     try  {
-                        that._config = JSON.parse(xhr.response);
-                        that._customFragment = that._texturePath + "/custom";
-                        that._updateTexture = true;
-                        that._shaderLoaded = true;
+                        _this._config = JSON.parse(xhr.response);
+
+                        _this.updateShaderUniforms();
+                        _this.updateTextures();
+                        _this.setFragment(_this._texturePath + "/custom");
+
+                        _this._animate = _this._config.animate;
+                        _this.refreshRate = _this._config.refreshrate;
                     } catch (ex) {
                         noConfigFile();
                     }
@@ -60,30 +61,27 @@ var BABYLON;
             try  {
                 xhr.send();
             } catch (ex) {
-                BABYLON.Tools.Error("Error on XHR send request.");
+                BABYLON.Tools.Error("CustomProceduralTexture: Error on XHR send request.");
             }
         };
 
-        CustomProceduralTexture.prototype.render = function (useCameraPostProcess) {
-            //if config and shader not loaded, do not render
-            if (!this._shaderLoaded)
-                return;
-
-            if (this._updateTexture) {
-                this.reset();
-                this.setFragment(this._customFragment);
-                this.updateTextures();
-                this.updateShaderUniforms();
-                this._shaderLoaded = true;
-                if (this._config) {
-                    this._animate = this._config.animate;
-                    this.refreshRate = this._config.refreshrate;
+        CustomProceduralTexture.prototype.isReady = function () {
+            if (!_super.prototype.isReady.call(this)) {
+                return false;
+            }
+
+            for (var name in this._textures) {
+                var texture = this._textures[name];
+
+                if (!texture.isReady()) {
+                    return false;
                 }
-                this.isReady();
-                this._updateTexture = false;
-                return;
             }
 
+            return true;
+        };
+
+        CustomProceduralTexture.prototype.render = function (useCameraPostProcess) {
             if (this._animate) {
                 this._time += this.getScene().getAnimationRatio() * 0.03;
                 this.updateShaderUniforms();
@@ -93,10 +91,8 @@ var BABYLON;
         };
 
         CustomProceduralTexture.prototype.updateTextures = function () {
-            if (this._config) {
-                for (var i = 0; i < this._config.texture2Ds.length; i++) {
-                    this.setTexture(this._config.texture2Ds[i].textureName, new BABYLON.Texture(this._texturePath + "/" + this._config.texture2Ds[i].textureRelativeUrl, this.getScene(), false, false, BABYLON.Texture.TRILINEAR_SAMPLINGMODE, null, null, null, true));
-                }
+            for (var i = 0; i < this._config.sampler2Ds.length; i++) {
+                this.setTexture(this._config.sampler2Ds[i].sample2Dname, new BABYLON.Texture(this._texturePath + "/" + this._config.sampler2Ds[i].textureRelativeUrl, this.getScene()));
             }
         };
 
@@ -134,7 +130,6 @@ var BABYLON;
             },
             set: function (value) {
                 this._animate = value;
-                this.updateShaderUniforms();
             },
             enumerable: true,
             configurable: true

Babylon/Materials/textures/Procedurals/babylon.customProceduralTexture.ts

@@ -2,33 +2,28 @@
     export class CustomProceduralTexture extends ProceduralTexture {
         private _animate: boolean = true;
         private _time: number = 0;
-        private _shaderLoaded: boolean = false;
         private _config: any;
         private _texturePath: any;
-        private _updateTexture: boolean = false;
-        private _customFragment: string;
 
         constructor(name: string, texturePath: any, size: number, scene: Scene, fallbackTexture?: Texture, generateMipMaps?: boolean) {
-            super(name, size, "empty", scene, fallbackTexture, generateMipMaps);
+            super(name, size, null, scene, fallbackTexture, generateMipMaps);
             this._texturePath = texturePath;
 
-            //readJson
+            //Try to load json
             this.loadJson(texturePath);
             this.refreshRate = 1;
         }
 
-        private loadJson(jsonUrl: string) {
+        private loadJson(jsonUrl: string): void {
             var that = this;
 
             function noConfigFile() {
-                BABYLON.Tools.Log("No config file found in " + jsonUrl + " trying as a shaderstore or dom");
+                BABYLON.Tools.Log("No config file found in " + jsonUrl + " trying to use ShaderStore or DOM element");
                 try {
-                    that._customFragment = that._texturePath;
-                    that._updateTexture = true;
-                    that._shaderLoaded = true;
+                    that.setFragment(that._texturePath);
                 }
                 catch (ex) {
-                    BABYLON.Tools.Error("No json or shaderStore or Dom element found for the Custom Procedural Texture");
+                    BABYLON.Tools.Error("No json or ShaderStore or DOM element found for CustomProceduralTexture");
                 }
             }
 
@@ -36,13 +31,17 @@
             var xhr: XMLHttpRequest = new XMLHttpRequest();
 
             xhr.open("GET", configFileUrl, true);
-            xhr.addEventListener("load", function () {
+            xhr.addEventListener("load", () => {
                 if (xhr.status === 200 || BABYLON.Tools.ValidateXHRData(xhr, 1)) {
                     try {
-                        that._config = JSON.parse(xhr.response);
-                        that._customFragment = that._texturePath + "/custom";
-                        that._updateTexture = true;
-                        that._shaderLoaded = true;
+                        this._config = JSON.parse(xhr.response);
+
+                        this.updateShaderUniforms();
+                        this.updateTextures();
+                        this.setFragment(this._texturePath + "/custom");
+
+                        this._animate = this._config.animate;
+                        this.refreshRate = this._config.refreshrate;
                     }
                     catch (ex) {
                         noConfigFile();
@@ -61,30 +60,27 @@
                 xhr.send();
             }
             catch (ex) {
-                BABYLON.Tools.Error("Error on XHR send request.");
+                BABYLON.Tools.Error("CustomProceduralTexture: Error on XHR send request.");
             }
         }
 
-        public render(useCameraPostProcess?: boolean) {
-            //if config and shader not loaded, do not render
-            if (!this._shaderLoaded)
-                return;
+        public isReady(): boolean {
+            if (!super.isReady()) {
+                return false;
+            }
 
-            if (this._updateTexture) {
-                this.reset();
-                this.setFragment(this._customFragment);
-                this.updateTextures();
-                this.updateShaderUniforms();
-                this._shaderLoaded = true;
-                if (this._config) {
-                    this._animate = this._config.animate;
-                    this.refreshRate = this._config.refreshrate;
+            for (var name in this._textures) {
+                var texture = this._textures[name];
+
+                if (!texture.isReady()) {
+                    return false;
                 }
-                this.isReady();
-                this._updateTexture = false;
-                return;
             }
 
+            return true;
+        }
+
+        public render(useCameraPostProcess?: boolean): void {
             if (this._animate) {
                 this._time += this.getScene().getAnimationRatio() * 0.03;
                 this.updateShaderUniforms();
@@ -93,15 +89,13 @@
             super.render(useCameraPostProcess);
         }
 
-        public updateTextures() {
-            if (this._config) {
-                for (var i = 0; i < this._config.texture2Ds.length; i++) {
-                    this.setTexture(this._config.texture2Ds[i].textureName, new BABYLON.Texture(this._texturePath + "/" + this._config.texture2Ds[i].textureRelativeUrl, this.getScene(), false, false, Texture.TRILINEAR_SAMPLINGMODE, null, null, null, true));
-                }
+        public updateTextures(): void {
+            for (var i = 0; i < this._config.sampler2Ds.length; i++) {
+                this.setTexture(this._config.sampler2Ds[i].sample2Dname, new Texture(this._texturePath + "/" + this._config.sampler2Ds[i].textureRelativeUrl, this.getScene()));
             }
         }
 
-        public updateShaderUniforms() {
+        public updateShaderUniforms(): void {
             if (this._config) {
                 for (var j = 0; j < this._config.uniforms.length; j++) {
                     var uniform = this._config.uniforms[j];
@@ -111,16 +105,16 @@
                             this.setFloat(uniform.name, uniform.value);
                             break;
                         case "color3":
-                            this.setColor3(uniform.name, new BABYLON.Color3(uniform.r, uniform.g, uniform.b));
+                            this.setColor3(uniform.name, new Color3(uniform.r, uniform.g, uniform.b));
                             break;
                         case "color4":
-                            this.setColor4(uniform.name, new BABYLON.Color4(uniform.r, uniform.g, uniform.b, uniform.a));
+                            this.setColor4(uniform.name, new Color4(uniform.r, uniform.g, uniform.b, uniform.a));
                             break;
                         case "vector2":
-                            this.setVector2(uniform.name, new BABYLON.Vector2(uniform.x, uniform.y));
+                            this.setVector2(uniform.name, new Vector2(uniform.x, uniform.y));
                             break;
                         case "vector3":
-                            this.setVector3(uniform.name, new BABYLON.Vector3(uniform.x, uniform.y, uniform.z));
+                            this.setVector3(uniform.name, new Vector3(uniform.x, uniform.y, uniform.z));
                             break;
                     }
                 }
@@ -135,7 +129,6 @@
 
         public set animate(value: boolean) {
             this._animate = value;
-            this.updateShaderUniforms();
         }
     }
 }

Babylon/Materials/textures/Procedurals/babylon.proceduralTexture.js

@@ -9,6 +9,7 @@ var BABYLON;
     var ProceduralTexture = (function (_super) {
         __extends(ProceduralTexture, _super);
         function ProceduralTexture(name, size, fragment, scene, fallbackTexture, generateMipMaps) {
+            if (typeof generateMipMaps === "undefined") { generateMipMaps = true; }
             _super.call(this, null, scene, !generateMipMaps);
             this._currentRefreshId = -1;
             this._refreshRate = 1;
@@ -32,7 +33,7 @@ var BABYLON;
             this._size = size;
             this._generateMipMaps = generateMipMaps;
 
-            this._fragment = fragment;
+            this.setFragment(fragment);
 
             this._fallbackTexture = fallbackTexture;
 
@@ -60,6 +61,9 @@ var BABYLON;
             this._indexBuffer = scene.getEngine().createIndexBuffer(indices);
         }
         ProceduralTexture.prototype.reset = function () {
+            if (this._effect === undefined) {
+                return;
+            }
             var engine = this.getScene().getEngine();
             engine._releaseEffect(this._effect);
         };
@@ -69,10 +73,14 @@ var BABYLON;
             var engine = this.getScene().getEngine();
             var shaders;
 
-            if (this._fragment.fragmentElement == undefined) {
-                shaders = { vertex: "procedural", fragment: this._fragment };
-            } else {
+            if (!this._fragment) {
+                return false;
+            }
+
+            if (this._fragment.fragmentElement !== undefined) {
                 shaders = { vertex: "procedural", fragmentElement: this._fragment.fragmentElement };
+            } else {
+                shaders = { vertex: "procedural", fragment: this._fragment };
             }
 
             this._effect = engine.createEffect(shaders, ["position"], this._uniforms, this._samplers, "", null, null, function () {

Babylon/Materials/textures/Procedurals/babylon.proceduralTexture.ts

@@ -17,7 +17,7 @@
         private _samplers = new Array<string>();
         private _fragment: any;
 
-        private _textures = new Array<Texture>();
+        public _textures = new Array<Texture>();
         private _floats = new Array<number>();
         private _floatsArrays = {};
         private _colors3 = new Array<Color3>();
@@ -28,7 +28,7 @@
 
         private _fallbackTexture: Texture;
 
-        constructor(name: string, size: any, fragment: any, scene: Scene, fallbackTexture?: Texture, generateMipMaps?: boolean) {
+        constructor(name: string, size: any, fragment: any, scene: Scene, fallbackTexture?: Texture, generateMipMaps = true) {
             super(null, scene, !generateMipMaps);
 
             scene._proceduralTextures.push(this);
@@ -38,7 +38,7 @@
             this._size = size;
             this._generateMipMaps = generateMipMaps;
 
-            this._fragment = fragment;
+            this.setFragment(fragment);
 
             this._fallbackTexture = fallbackTexture;
 
@@ -67,6 +67,9 @@
         }
 
         public reset(): void {
+            if (this._effect === undefined) {
+                return;
+            }
             var engine = this.getScene().getEngine();
             engine._releaseEffect(this._effect);
         }
@@ -76,12 +79,16 @@
             var engine = this.getScene().getEngine();
             var shaders;
 
-            if (this._fragment.fragmentElement == undefined) {
-                shaders = { vertex: "procedural", fragment: this._fragment };
+            if (!this._fragment) {
+                return false;
             }
-            else {
+
+            if (this._fragment.fragmentElement !== undefined) {
                 shaders = { vertex: "procedural", fragmentElement: this._fragment.fragmentElement };
             }
+            else {
+                shaders = { vertex: "procedural", fragment: this._fragment };
+            }
 
             this._effect = engine.createEffect(shaders,
                 ["position"],
@@ -230,7 +237,7 @@
                 this._effect.setFloat(name, this._floats[name]);
             }
 
-            // Float s   
+            // Floats   
             for (name in this._floatsArrays) {
                 this._effect.setArray(name, this._floatsArrays[name]);
             }

Babylon/babylon.scene.js

@@ -60,6 +60,8 @@
             // Procedural textures
             this.proceduralTexturesEnabled = true;
             this._proceduralTextures = new Array();
+            // Sound Tracks
+            this._soundTracks = new Array();
             this._totalVertices = 0;
             this._activeVertices = 0;
             this._activeParticles = 0;
@@ -1172,7 +1174,7 @@
             this._boundingBoxRenderer.dispose();
 
             // Debug layer
-            this.debugLayer.enabled = false;
+            this.debugLayer.hide();
 
             // Events
             if (this.onDispose) {

Babylon/babylon.scene.ts

@@ -118,6 +118,9 @@
         public proceduralTexturesEnabled = true;
         public _proceduralTextures = new Array<ProceduralTexture>();
 
+        // Sound Tracks
+        public _soundTracks = new Array<SoundTrack>();
+
         // Private
         private _engine: Engine;
         private _totalVertices = 0;
@@ -1251,7 +1254,7 @@
             this._boundingBoxRenderer.dispose();
 
             // Debug layer
-            this.debugLayer.enabled = false;
+            this.debugLayer.hide();
 
             // Events
             if (this.onDispose) {

babylon.2.0.d.ts

@@ -390,6 +390,7 @@ declare module BABYLON {
         private _meshesForIntersections;
         public proceduralTexturesEnabled: boolean;
         public _proceduralTextures: ProceduralTexture[];
+        public _soundTracks: SoundTrack[];
         private _engine;
         private _totalVertices;
         public _activeVertices: number;
@@ -874,12 +875,11 @@ declare module BABYLON {
 }
 declare module BABYLON {
     class Sound {
-        private _audioBuffer;
         public maxDistance: number;
         public autoplay: boolean;
         public loop: boolean;
         private _position;
-        private _direction;
+        private _localDirection;
         private _volume;
         private _currentVolume;
         private _isLoaded;
@@ -888,13 +888,16 @@ declare module BABYLON {
         private _isDirectional;
         private _audioEngine;
         private _readyToPlayCallback;
+        private _audioBuffer;
         private _soundSource;
         private _soundPanner;
+        private _soundGain;
         private _coneInnerAngle;
         private _coneOuterAngle;
         private _coneOuterGain;
         private _scene;
         private _name;
+        private _connectedMesh;
         /**
         * Create a sound and attach it to a scene
         * @param name Name of your sound
@@ -903,6 +906,7 @@ declare module BABYLON {
         * @param options Objects to provide with the current available options: autoplay, loop, distanceMax
         */
         constructor(name: string, url: string, scene: Scene, readyToPlayCallback?: () => void, options?: any);
+        public connectToSoundTrackAudioNode(soundTrackAudioNode: AudioNode): void;
         /**
         * Transform this sound into a directional source
         * @param coneInnerAngle Size of the inner cone in degree
@@ -911,9 +915,18 @@ declare module BABYLON {
         */
         public setDirectionalCone(coneInnerAngle: number, coneOuterAngle: number, coneOuterGain: number): void;
         public setPosition(newPosition: Vector3): void;
-        public setDirection(newDirection: Vector3): void;
-        public play(): void;
-        public stop(): void;
+        public setLocalDirectionToMesh(newLocalDirection: Vector3): void;
+        private _updateDirection();
+        /**
+        * Play the sound
+        * @param time (optional) Start the sound after X seconds. Start immediately (0) by default.
+        */
+        public play(time?: number): void;
+        /**
+        * Stop the sound
+        * @param time (optional) Stop the sound after X seconds. Stop immediately (0) by default.
+        */
+        public stop(time?: number): void;
         public pause(): void;
         public attachToMesh(meshToConnectTo: AbstractMesh): void;
         private _onRegisterAfterWorldMatrixUpdate(connectedMesh);
@@ -921,6 +934,20 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+    class SoundTrack {
+        private _audioEngine;
+        private _trackGain;
+        private _trackConvolver;
+        private _scene;
+        private _id;
+        private _soundCollection;
+        constructor(scene: Scene, options?: any);
+        public AddSound(newSound: Sound): void;
+        public RemoveSound(sound: Sound): void;
+        public setVolume(newVolume: number): void;
+    }
+}
+declare module BABYLON {
     class Bone {
         public name: string;
         public children: Bone[];
@@ -1475,12 +1502,17 @@ declare module BABYLON {
         private _clickPosition;
         private _ratio;
         private _identityMatrix;
+        private _showUI;
+        public shouldDisplayLabel: (node: Node) => boolean;
+        public shouldDisplayAxis: (mesh: Mesh) => boolean;
         constructor(scene: Scene);
         private _renderSingleAxis(zero, unit, unitText, label, color);
         private _renderAxis(projectedPosition, mesh, globalViewport);
         private _renderLabel(text, projectedPosition, labelOffset, onClick, getFillStyle);
         private _isClickInsideRect(x, y, width, height);
-        public enabled : boolean;
+        public isVisible(): boolean;
+        public hide(): void;
+        public show(showUI?: boolean): void;
         private _clearLabels();
         private _generateTexBox(root, title);
         private _generateCheckBox(root, title, initialState, task);
@@ -2093,13 +2125,11 @@ declare module BABYLON {
     class CustomProceduralTexture extends ProceduralTexture {
         private _animate;
         private _time;
-        private _shaderLoaded;
         private _config;
         private _texturePath;
-        private _updateTexture;
-        private _customFragment;
         constructor(name: string, texturePath: any, size: number, scene: Scene, fallbackTexture?: Texture, generateMipMaps?: boolean);
         private loadJson(jsonUrl);
+        public isReady(): boolean;
         public render(useCameraPostProcess?: boolean): void;
         public updateTextures(): void;
         public updateShaderUniforms(): void;
@@ -2121,7 +2151,7 @@ declare module BABYLON {
         private _uniforms;
         private _samplers;
         private _fragment;
-        private _textures;
+        public _textures: Texture[];
         private _floats;
         private _floatsArrays;
         private _colors3;