4.1.0-alpha.23

dist/preview release/glTF2Interface/package.json

@@ -1,7 +1,7 @@
 {
     "name": "babylonjs-gltf2interface",
     "description": "A typescript declaration of babylon's gltf2 inteface.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/gui/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-gui",
     "description": "The Babylon.js GUI library is an extension you can use to generate interactive user interface. It is build on top of the DynamicTexture.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,7 +28,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

dist/preview release/inspector/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-inspector",
     "description": "The Babylon.js inspector.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -29,12 +29,12 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22",
-        "babylonjs-gui": "4.1.0-alpha.22",
-        "babylonjs-loaders": "4.1.0-alpha.22",
-        "babylonjs-materials": "4.1.0-alpha.22",
-        "babylonjs-serializers": "4.1.0-alpha.22",
-        "babylonjs-gltf2interface": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23",
+        "babylonjs-gui": "4.1.0-alpha.23",
+        "babylonjs-loaders": "4.1.0-alpha.23",
+        "babylonjs-materials": "4.1.0-alpha.23",
+        "babylonjs-serializers": "4.1.0-alpha.23",
+        "babylonjs-gltf2interface": "4.1.0-alpha.23"
     },
     "devDependencies": {
         "@types/react": "~16.7.3",

dist/preview release/loaders/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-loaders",
     "description": "The Babylon.js file loaders library is an extension you can use to load different 3D file types into a Babylon scene.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,8 +28,8 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs-gltf2interface": "4.1.0-alpha.22",
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs-gltf2interface": "4.1.0-alpha.23",
+        "babylonjs": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

dist/preview release/materialsLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-materials",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,7 +28,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

dist/preview release/nodeEditor/package.json

@@ -4,14 +4,14 @@
     },
     "name": "babylonjs-node-editor",
     "description": "The Babylon.js node material editor.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
     },
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23"
     },
     "files": [
         "babylon.nodeEditor.max.js.map",

dist/preview release/package.json

@@ -7,7 +7,7 @@
     ],
     "name": "babylonjs",
     "description": "Babylon.js is a JavaScript 3D engine based on webgl.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

dist/preview release/packagesSizeBaseLine.json

@@ -1 +1 @@
-{"thinEngineOnly":126863,"engineOnly":163772,"sceneOnly":507659,"minGridMaterial":638123,"minStandardMaterial":769282}
+{"thinEngineOnly":127189,"engineOnly":164058,"sceneOnly":508079,"minGridMaterial":638543,"minStandardMaterial":762401}

dist/preview release/postProcessesLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-post-process",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,7 +28,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

dist/preview release/proceduralTexturesLibrary/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-procedural-textures",
     "description": "The Babylon.js materials library is a collection of advanced materials to be used in a Babylon.js scene.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,7 +28,7 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

dist/preview release/serializers/package.json

@@ -4,7 +4,7 @@
     },
     "name": "babylonjs-serializers",
     "description": "The Babylon.js serializers library is an extension you can use to serialize Babylon scenes.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -28,8 +28,8 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "babylonjs": "4.1.0-alpha.22",
-        "babylonjs-gltf2interface": "4.1.0-alpha.22"
+        "babylonjs": "4.1.0-alpha.23",
+        "babylonjs-gltf2interface": "4.1.0-alpha.23"
     },
     "engines": {
         "node": "*"

nodeEditor/src/components/diagram/diagram.scss

@@ -52,6 +52,34 @@
         .outputs {
             transform: translateY(5px);
         }
+
+        &.Float {
+            background: #ca9e27;
+        }
+
+        &.Vector2 {
+            background: #16bcb1;
+        }      
+        
+        &.Vector3 {
+            background: #b786cb;
+        }          
+
+        &.Color3 {
+            background: #b786cb;
+        }          
+
+        &.Vector4 {
+            background: #be5126;
+        }          
+
+        &.Color4 {
+            background: #be5126;
+        }          
+
+        &.Matrix {
+            background: #591990;
+        }
     }
 
     &.trigonometry {
@@ -88,7 +116,7 @@
     }
 
     &.constant {
-        background: gray;
+        background: gray !important;
     }
 
     &.output {

nodeEditor/src/components/diagram/input/inputNodePropertyComponent.tsx

@@ -179,7 +179,10 @@ export class InputPropertyTabComponentProps extends React.Component<IInputProper
                     {
                         inputBlock.isUniform && !inputBlock.isSystemValue && inputBlock.animationType === AnimatedInputBlockTypes.None &&
                         <CheckBoxLineComponent label="IsConstant" target={inputBlock} propertyName="isConstant"
-                            onValueChanged={() => this.props.globalState.onRebuildRequiredObservable.notifyObservers()}
+                            onValueChanged={() => {
+                                this.props.globalState.onRebuildRequiredObservable.notifyObservers();
+                                this.props.globalState.onUpdateRequiredObservable.notifyObservers();
+                            }}
                         />
                     }                             
                     <OptionsLineComponent label="Mode" options={modeOptions} target={inputBlock} 

nodeEditor/src/components/diagram/input/inputNodeWidget.tsx

@@ -130,7 +130,7 @@ export class InputNodeWidget extends React.Component<IInputNodeWidgetProps> {
         }
 
         return (
-            <div className={"diagramBlock input" + (inputBlock && inputBlock.isAttribute ? " attribute" : "")+ (inputBlock && inputBlock.isConstant ? " constant" : "")} style={{
+            <div className={"diagramBlock input" + (inputBlock ? " " + NodeMaterialBlockConnectionPointTypes[inputBlock.type] : "")+ (inputBlock && inputBlock.isConstant ? " constant" : "")} style={{
                 background: color
             }}>
                 <div className="header">

nodeEditor/src/components/diagram/texture/texturePropertyTabComponent.tsx

@@ -74,7 +74,7 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
         if (!texture) {
 
             if (!this.state.loadAsCubeTexture) {
-                this.props.node.texture = new Texture(null, this.props.globalState.nodeMaterial.getScene(), false, false);
+                this.props.node.texture = new Texture(null, this.props.globalState.nodeMaterial.getScene(), false, this.props.node instanceof ReflectionTextureNodeModel);
                 texture = this.props.node.texture;
                 texture.coordinatesMode = Texture.EQUIRECTANGULAR_MODE;
             } else {

nodeEditor/src/components/nodeList/nodeListComponent.tsx

@@ -29,14 +29,14 @@ export class NodeListComponent extends React.Component<INodeListComponentProps,
             Basic_Math: ["AddBlock",  "DivideBlock", "MultiplyBlock", "ScaleBlock", "SubtractBlock", "OneMinusBlock", "MaxBlock", "MinBlock", "LengthBlock", "DistanceBlock", "NegateBlock", "RandomNumberBlock", "ReciprocalBlock"],
             Color_Management: ["ReplaceColorBlock", "PosterizeBlock", "GradientBlock"],
             Conversion_Blocks: ["ColorMergerBlock", "ColorSplitterBlock", "VectorMergerBlock", "VectorSplitterBlock"],
-            Inputs: ["Float", "Vector2", "Vector3", "Vector4", "Color3", "Color4", "TextureBlock", "TimeBlock", "DeltaTimeBlock"],
+            Inputs: ["Float", "Vector2", "Vector3", "Vector4", "Color3", "Color4", "TextureBlock", "ReflectionTextureBlock", "TimeBlock", "DeltaTimeBlock"],
             Interpolation: ["LerpBlock", "SmoothStepBlock", "NLerpBlock"],
             Matrices: ["Matrix", "WorldMatrixBlock", "WorldViewMatrixBlock", "WorldViewProjectionMatrixBlock", "ViewMatrixBlock", "ViewProjectionMatrixBlock", "ProjectionMatrixBlock"],
             Mesh_Attributes: ["InstancesBlock", "PositionBlock", "UVBlock", "ColorBlock", "NormalBlock", "TangentBlock", "MatrixIndicesBlock", "MatrixWeightsBlock", "WorldPositionBlock", "WorldNormalBlock"], 
             Output_Blocks: ["VertexOutputBlock", "FragmentOutputBlock", "DiscardBlock"],
             Range: ["ClampBlock", "RemapBlock", "NormalizeBlock"],
             Round: ["StepBlock", "RoundBlock", "CeilingBlock", "FloorBlock"],
-            Scene_Attributes: ["FogBlock", "CameraPositionBlock", "FogColorBlock", "ImageProcessingBlock", "LightBlock", "LightInformationBlock", "ReflectionTextureBlock", "ViewDirectionBlock", "PerturbNormalBlock"],
+            Scene_Attributes: ["FogBlock", "CameraPositionBlock", "FogColorBlock", "ImageProcessingBlock", "LightBlock", "LightInformationBlock", "ViewDirectionBlock", "PerturbNormalBlock"],
             Trigonometry: ["CosBlock", "SinBlock", "AbsBlock", "ExpBlock", "Exp2Block", "SqrtBlock", "PowBlock", "LogBlock", "ArcCosBlock", "ArcSinBlock", "TanBlock", "ArcTanBlock", "FractBlock", "SignBlock", "ArcTan2Block", "DegreesToRadiansBlock", "RadiansToDegreesBlock", "SawToothWaveBlock", "TriangleWaveBlock", "SquareWaveBlock"],
             Vector_Math: ["CrossBlock", "DotBlock", "TransformBlock", "FresnelBlock"],
         }

nodeEditor/src/components/preview/previewManager.ts

@@ -15,6 +15,7 @@ import { TransformNode } from 'babylonjs/Meshes/transformNode';
 import { AbstractMesh } from 'babylonjs/Meshes/abstractMesh';
 import { FramingBehavior } from 'babylonjs/Behaviors/Cameras/framingBehavior';
 import { DirectionalLight } from 'babylonjs/Lights/directionalLight';
+import { LogEntry } from '../log/logComponent';
 
 export class PreviewManager {
     private _nodeMaterial: NodeMaterial;
@@ -127,6 +128,8 @@ export class PreviewManager {
     }
 
     private _prepareMeshes() {
+        this._engine.hideLoadingUI();
+
         this._prepareLights();
 
         // Framing
@@ -175,6 +178,10 @@ export class PreviewManager {
             }
 
             this._engine.releaseEffects();
+
+            SceneLoader.ShowLoadingScreen = false;
+
+            this._engine.displayLoadingUI();
         
             switch (this._globalState.previewMeshType) {
                 case PreviewMeshType.Box:
@@ -240,6 +247,8 @@ export class PreviewManager {
                     }      
         
                     this._material = tempMaterial;  
+                }).catch(reason => {
+                    this._globalState.onLogRequiredObservable.notifyObservers(new LogEntry("Shader compilation error:\r\n" + reason, true));
                 });
             } else {
                 this._material = tempMaterial;    

package.json

@@ -7,7 +7,7 @@
     ],
     "name": "babylonjs",
     "description": "Babylon.js is a JavaScript 3D engine based on webgl.",
-    "version": "4.1.0-alpha.22",
+    "version": "4.1.0-alpha.23",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"

src/Engines/thinEngine.ts

@@ -128,14 +128,14 @@ export class ThinEngine {
      */
     // Not mixed with Version for tooling purpose.
     public static get NpmPackage(): string {
-        return "babylonjs@4.1.0-alpha.22";
+        return "babylonjs@4.1.0-alpha.23";
     }
 
     /**
      * Returns the current version of the framework
      */
     public static get Version(): string {
-        return "4.1.0-alpha.22";
+        return "4.1.0-alpha.23";
     }
 
     /**

src/Materials/Node/Blocks/Fragment/perturbNormalBlock.ts

@@ -134,10 +134,12 @@ export class PerturbNormalBlock extends NodeMaterialBlock {
 
         state._emitUniformFromString(this._tangentSpaceParameterName, "vec2");
 
+        let replaceForBumpInfos = this.strength.isConnectedToInputBlock && this.strength.connectInputBlock!.isConstant ? `${state._emitFloat(1.0 / this.strength.connectInputBlock!.value)}` : `1.0 / ${this.strength.associatedVariableName}`;
+
         state._emitExtension("bump", "#extension GL_OES_standard_derivatives : enable");
         state._emitFunctionFromInclude("bumpFragmentFunctions", comments, {
             replaceStrings: [
-                { search: /vBumpInfos.y/g, replace: `1.0 / ${this.strength.associatedVariableName}`},
+                { search: /vBumpInfos.y/g, replace: replaceForBumpInfos},
                 { search: /vTangentSpaceParams/g, replace: this._tangentSpaceParameterName},
                 { search: /vPositionW/g, replace: worldPosition.associatedVariableName + ".xyz"},
                 { search: /defined\(TANGENT\)/g, replace: "defined(IGNORE)" }
@@ -147,7 +149,7 @@ export class PerturbNormalBlock extends NodeMaterialBlock {
         state.compilationString += state._emitCodeFromInclude("bumpFragment", comments, {
             replaceStrings: [
                 { search: /perturbNormal\(TBN,vBumpUV\+uvOffset\)/g, replace: `perturbNormal(TBN, ${this.normalMapColor.associatedVariableName})` },
-                { search: /vBumpInfos.y/g, replace: `1.0 / ${this.strength.associatedVariableName}`},
+                { search: /vBumpInfos.y/g, replace: replaceForBumpInfos},
                 { search: /vBumpUV/g, replace: uv.associatedVariableName},
                 { search: /vPositionW/g, replace: worldPosition.associatedVariableName + ".xyz"},
                 { search: /normalW=/g, replace: this.output.associatedVariableName + ".xyz = " },

src/Materials/effect.ts

@@ -134,6 +134,7 @@ export class Effect implements IDisposable {
     private _samplers: { [key: string]: number } = {};
     private _isReady = false;
     private _compilationError = "";
+    private _allFallbacksProcessed = false;
     private _attributesNames: string[];
     private _attributes: number[];
     private _uniforms: { [key: string]: Nullable<WebGLUniformLocation> } = {};
@@ -394,6 +395,14 @@ export class Effect implements IDisposable {
     }
 
     /**
+     * Gets a boolean indicating that all fallbacks were used during compilation
+     * @returns true if all fallbacks were used
+     */
+    public allFallbacksProcessed(): boolean {
+        return this._allFallbacksProcessed;
+    }
+
+    /**
      * Adds a callback to the onCompiled observable and call the callback imediatly if already ready.
      * @param func The callback to be used.
      */
@@ -686,11 +695,12 @@ export class Effect implements IDisposable {
         if (fallbacks) {
             this._pipelineContext = null;
             if (fallbacks.hasMoreFallbacks) {
+                this._allFallbacksProcessed = false;
                 Logger.Error("Trying next fallback.");
                 this.defines = fallbacks.reduce(this.defines, this);
                 this._prepareEffect();
             } else { // Sorry we did everything we can
-
+                this._allFallbacksProcessed = true;
                 if (this.onError) {
                     this.onError(this, this._compilationError);
                 }
@@ -702,6 +712,8 @@ export class Effect implements IDisposable {
                     this._fallbacks.unBindMesh();
                 }
             }
+        } else {
+            this._allFallbacksProcessed = true;
         }
     }
 

src/Materials/material.ts

@@ -852,8 +852,9 @@ export class Material implements IAnimatable {
      * @param mesh defines the mesh associated with this material
      * @param onCompiled defines a function to execute once the material is compiled
      * @param options defines the options to configure the compilation
+     * @param onError defines a function to execute if the material fails compiling
      */
-    public forceCompilation(mesh: AbstractMesh, onCompiled?: (material: Material) => void, options?: Partial<{ clipPlane: boolean }>): void {
+    public forceCompilation(mesh: AbstractMesh, onCompiled?: (material: Material) => void, options?: Partial<{ clipPlane: boolean }>, onError?: (reason: string) => void): void {
         let localOptions = {
             clipPlane: false,
             ...options
@@ -884,7 +885,13 @@ export class Material implements IAnimatable {
                     }
                 }
                 else {
-                    setTimeout(checkReady, 16);
+                    if (subMesh.effect && subMesh.effect.getCompilationError() && subMesh.effect.allFallbacksProcessed()) {
+                        if (onError) {
+                            onError(subMesh.effect.getCompilationError());
+                        }
+                    } else {
+                        setTimeout(checkReady, 16);
+                    }
                 }
             } else {
                 if (this.isReady()) {
@@ -912,10 +919,12 @@ export class Material implements IAnimatable {
      * @returns a promise that resolves when the compilation completes
      */
     public forceCompilationAsync(mesh: AbstractMesh, options?: Partial<{ clipPlane: boolean }>): Promise<void> {
-        return new Promise((resolve) => {
+        return new Promise((resolve, reject) => {
             this.forceCompilation(mesh, () => {
                 resolve();
-            }, options);
+            }, options, (reason) => {
+                reject(reason);
+            });
         });
     }