Merge pull request #980 from julien-moreau/master

Fixed glTF file loader to work withY is UP and homogeneous coordinates

loaders/glTF/README.md

@@ -26,8 +26,12 @@ BABYLON.SceneLoader.ImportMesh(["myMesh1", "myMesh2", "..."], "./", "duck.gltf",
 
 In order the fix the UP vector (Y with Babylon.js) if you want to play with physics, you can customize the loader:
 ```
-var plugin = BABYLON.SceneLoader.GetPluginForExtension(".gltf");
-plugin.MakeYUP = true; // Which is false by default
+BABYLON.GLTFFileLoader.MakeYUP = true; // false by default
+```
+
+In order to work with homogeneous coordinates (that can be available with some converters and exporters):
+```
+BABYLON.GLTFFileLoader.HomogeneousCoordinates = true; // false by default
 ```
 
 ## Supported features

loaders/glTF/babylon.glTFFileLoader.ts

@@ -860,9 +860,17 @@
                     }
                     else if (semantic === "POSITION") {
                         tempVertexData.positions = [];
-                        for (var j = 0; j < buffer.length; j++) {
+
+                        var count = 3;
+                        if (GLTFFileLoader.HomogeneousCoordinates) {
+                            count = 4;
+                        }
+                        for (var j = 0; j < buffer.length; j += count) {
                             (<number[]>tempVertexData.positions).push(buffer[j]);
+                            (<number[]>tempVertexData.positions).push(buffer[j+1]);
+                            (<number[]>tempVertexData.positions).push(buffer[j+2]);
                         }
+
                         verticesCounts.push(tempVertexData.positions.length);
                     }
                     else if (semantic.indexOf("TEXCOORD_") !== -1) {
@@ -1658,6 +1666,7 @@
         * Static members
         */
         public static MakeYUP: boolean = false;
+        public static HomogeneousCoordinates: boolean = false;
 
         /**
         * Import meshes

materialsLibrary/dist/babylon.simpleMaterial.js

@@ -1,5 +1,13 @@
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
 
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") return Reflect.decorate(decorators, target, key, desc);
+    switch (arguments.length) {
+        case 2: return decorators.reduceRight(function(o, d) { return (d && d(o)) || o; }, target);
+        case 3: return decorators.reduceRight(function(o, d) { return (d && d(target, key)), void 0; }, void 0);
+        case 4: return decorators.reduceRight(function(o, d) { return (d && d(target, key, o)) || o; }, desc);
+    }
+};
 var BABYLON;
 (function (BABYLON) {
     var maxSimultaneousLights = 4;
@@ -278,15 +286,8 @@ var BABYLON;
             _super.prototype.dispose.call(this, forceDisposeEffect);
         };
         SimpleMaterial.prototype.clone = function (name) {
-            var newMaterial = new SimpleMaterial(name, this.getScene());
-            // Base material
-            this.copyTo(newMaterial);
-            // Simple material
-            if (this.diffuseTexture && this.diffuseTexture.clone) {
-                newMaterial.diffuseTexture = this.diffuseTexture.clone();
-            }
-            newMaterial.diffuseColor = this.diffuseColor.clone();
-            return newMaterial;
+            var _this = this;
+            return BABYLON.SerializationHelper.Clone(function () { return new SimpleMaterial(name, _this.getScene()); }, this);
         };
         SimpleMaterial.prototype.serialize = function () {
             var serializationObject = _super.prototype.serialize.call(this);
@@ -315,6 +316,12 @@ var BABYLON;
             }
             return material;
         };
+        __decorate([
+            BABYLON.serializeAsTexture()
+        ], SimpleMaterial.prototype, "diffuseTexture");
+        __decorate([
+            BABYLON.serializeAsColor3("diffuseColor")
+        ], SimpleMaterial.prototype, "diffuseColor");
         return SimpleMaterial;
     })(BABYLON.Material);
     BABYLON.SimpleMaterial = SimpleMaterial;

materialsLibrary/dist/dts/babylon.fireMaterial.d.ts

@@ -5,7 +5,6 @@ declare module BABYLON {
         distortionTexture: BaseTexture;
         opacityTexture: BaseTexture;
         diffuseColor: Color3;
-        disableLighting: boolean;
         speed: number;
         private _scaledDiffuse;
         private _renderId;

materialsLibrary/gulpfile.js

@@ -33,7 +33,8 @@ gulp.task('default', ["copyReference"], function () {
                 noExternalResolve: false,
                 target: 'ES5',
                 declarationFiles: true,
-                typescript: require('typescript')
+                typescript: require('typescript'),
+                experimentalDecorators: true
             }));
 
         var js = compilOutput.js;

materialsLibrary/materials/fire/babylon.fireMaterial.ts

@@ -10,12 +10,10 @@ module BABYLON {
         public POINTSIZE = false;
         public FOG = false;
         public UV1 = false;
-        public NORMAL = false;
         public VERTEXCOLOR = false;
         public VERTEXALPHA = false;
-        public BONES = false;
-        public BONES4 = false;
         public BonesPerMesh = 0;
+        public NUM_BONE_INFLUENCERS = 0;
         public INSTANCES = false;
 
         constructor() {
@@ -25,13 +23,19 @@ module BABYLON {
     }
 
     export class FireMaterial extends Material {
+        @serializeAsTexture()
         public diffuseTexture: BaseTexture;
+        
+        @serializeAsTexture()
         public distortionTexture: BaseTexture;
+        
+        @serializeAsTexture()
         public opacityTexture: BaseTexture;
-
+        
+        @serialize("diffuseColor")
         public diffuseColor = new Color3(1, 1, 1);
-        public disableLighting = false;
         
+        @serialize()
         public speed = 1.0;
         
         private _scaledDiffuse = new Color3();
@@ -131,9 +135,6 @@ module BABYLON {
             
             // Attribs
             if (mesh) {
-                if (needNormals && mesh.isVerticesDataPresent(VertexBuffer.NormalKind)) {
-                    this._defines.NORMAL = true;
-                }
                 if (needUVs) {
                     if (mesh.isVerticesDataPresent(VertexBuffer.UVKind)) {
                         this._defines.UV1 = true;
@@ -147,9 +148,8 @@ module BABYLON {
                     }
                 }
                 if (mesh.useBones && mesh.computeBonesUsingShaders) {
-                    this._defines.BONES = true;
+                    this._defines.NUM_BONE_INFLUENCERS = mesh.numBoneInfluencers;
                     this._defines.BonesPerMesh = (mesh.skeleton.bones.length + 1);
-                    this._defines.BONES4 = true;
                 }
 
                 // Instances
@@ -169,18 +169,14 @@ module BABYLON {
                 if (this._defines.FOG) {
                     fallbacks.addFallback(1, "FOG");
                 }
-             
-                if (this._defines.BONES4) {
-                    fallbacks.addFallback(0, "BONES4");
+                
+                if (this._defines.NUM_BONE_INFLUENCERS > 0) {
+                    fallbacks.addCPUSkinningFallback(0, mesh);
                 }
 
                 //Attributes
                 var attribs = [VertexBuffer.PositionKind];
 
-                if (this._defines.NORMAL) {
-                    attribs.push(VertexBuffer.NormalKind);
-                }
-
                 if (this._defines.UV1) {
                     attribs.push(VertexBuffer.UVKind);
                 }
@@ -189,17 +185,8 @@ module BABYLON {
                     attribs.push(VertexBuffer.ColorKind);
                 }
 
-                if (this._defines.BONES) {
-                    attribs.push(VertexBuffer.MatricesIndicesKind);
-                    attribs.push(VertexBuffer.MatricesWeightsKind);
-                }
-
-                if (this._defines.INSTANCES) {
-                    attribs.push("world0");
-                    attribs.push("world1");
-                    attribs.push("world2");
-                    attribs.push("world3");
-                }
+                MaterialHelper.PrepareAttributesForBones(attribs, mesh, this._defines, fallbacks);
+                MaterialHelper.PrepareAttributesForInstances(attribs, this._defines);
 
                 // Legacy browser patch
                 var shaderName = "fire";
@@ -252,9 +239,7 @@ module BABYLON {
             this._effect.setMatrix("viewProjection", scene.getTransformMatrix());
 
             // Bones
-            if (mesh && mesh.useBones && mesh.computeBonesUsingShaders) {
-                this._effect.setMatrices("mBones", mesh.skeleton.getTransformMatrices(mesh));
-            }
+            MaterialHelper.BindBonesParameters(mesh, this._effect);
 
             if (scene.getCachedMaterial() !== this) {
                 // Textures        
@@ -290,10 +275,7 @@ module BABYLON {
             }
             
             // Fog
-            if (scene.fogEnabled && mesh.applyFog && scene.fogMode !== Scene.FOGMODE_NONE) {
-                this._effect.setFloat4("vFogInfos", scene.fogMode, scene.fogStart, scene.fogEnd, scene.fogDensity);
-                this._effect.setColor3("vFogColor", scene.fogColor);
-            }
+            MaterialHelper.BindFogParameters(scene, mesh, this._effect);
             
             // Time
             this._lastTime += scene.getEngine().getDeltaTime();
@@ -333,24 +315,7 @@ module BABYLON {
         }
 
         public clone(name: string): FireMaterial {
-            var newMaterial = new FireMaterial(name, this.getScene());
-
-            // Base material
-            this.copyTo(newMaterial);
-
-            // Fire material
-            if (this.diffuseTexture && this.diffuseTexture.clone) {
-                newMaterial.diffuseTexture = this.diffuseTexture.clone();
-            }
-            if (this.distortionTexture && this.distortionTexture.clone) {
-                newMaterial.distortionTexture = this.distortionTexture.clone();
-            }
-            if (this.opacityTexture && this.opacityTexture.clone) {
-                newMaterial.opacityTexture = this.opacityTexture.clone();
-            }
-
-            newMaterial.diffuseColor = this.diffuseColor.clone();
-            return newMaterial;
+            return SerializationHelper.Clone<FireMaterial>(() => new FireMaterial(name, this.getScene()), this);
         }
 		
 		public serialize(): any {
@@ -359,7 +324,6 @@ module BABYLON {
             serializationObject.customType      = "BABYLON.FireMaterial";
             serializationObject.diffuseColor    = this.diffuseColor.asArray();
             serializationObject.speed           = this.speed;
-            serializationObject.disableLighting = this.disableLighting;
 
             if (this.diffuseTexture) {
                 serializationObject.diffuseTexture = this.diffuseTexture.serialize();
@@ -381,7 +345,6 @@ module BABYLON {
 
             material.diffuseColor   = Color3.FromArray(source.diffuseColor);
             material.speed          = source.speed;
-            material.disableLighting    = source.disableLighting;
 
             material.alpha          = source.alpha;
 

materialsLibrary/materials/fire/fire.fragment.fx

@@ -6,10 +6,6 @@ uniform vec3 vEyePosition;
 // Input
 varying vec3 vPositionW;
 
-#ifdef NORMAL
-varying vec3 vNormalW;
-#endif
-
 #ifdef VERTEXCOLOR
 varying vec4 vColor;
 #endif
@@ -29,46 +25,10 @@ varying vec2 vDistortionCoords1;
 varying vec2 vDistortionCoords2;
 varying vec2 vDistortionCoords3;
 
-#ifdef CLIPPLANE
-varying float fClipDistance;
-#endif
+#include<clipPlaneFragmentDeclaration>
 
 // Fog
-#ifdef FOG
-
-#define FOGMODE_NONE    0.
-#define FOGMODE_EXP     1.
-#define FOGMODE_EXP2    2.
-#define FOGMODE_LINEAR  3.
-#define E 2.71828
-
-uniform vec4 vFogInfos;
-uniform vec3 vFogColor;
-varying float fFogDistance;
-
-float CalcFogFactor()
-{
-	float fogCoeff = 1.0;
-	float fogStart = vFogInfos.y;
-	float fogEnd = vFogInfos.z;
-	float fogDensity = vFogInfos.w;
-
-	if (FOGMODE_LINEAR == vFogInfos.x)
-	{
-		fogCoeff = (fogEnd - fFogDistance) / (fogEnd - fogStart);
-	}
-	else if (FOGMODE_EXP == vFogInfos.x)
-	{
-		fogCoeff = 1.0 / pow(E, fFogDistance * fogDensity);
-	}
-	else if (FOGMODE_EXP2 == vFogInfos.x)
-	{
-		fogCoeff = 1.0 / pow(E, fFogDistance * fFogDistance * fogDensity * fogDensity);
-	}
-
-	return clamp(fogCoeff, 0.0, 1.0);
-}
-#endif
+#include<fogFragmentDeclaration>
 
 vec4 bx2(vec4 x)
 {
@@ -77,10 +37,7 @@ vec4 bx2(vec4 x)
 
 void main(void) {
 	// Clip plane
-#ifdef CLIPPLANE
-	if (fClipDistance > 0.0)
-		discard;
-#endif
+#include<clipPlaneFragment>
 
 	vec3 viewDirectionW = normalize(vEyePosition - vPositionW);
 
@@ -123,13 +80,6 @@ void main(void) {
 	baseColor.rgb *= vColor.rgb;
 #endif
 
-	// Bump
-#ifdef NORMAL
-	vec3 normalW = normalize(vNormalW);
-#else
-	vec3 normalW = vec3(1.0, 1.0, 1.0);
-#endif
-
 	// Lighting
 	vec3 diffuseBase = vec3(1.0, 1.0, 1.0);
 
@@ -140,10 +90,7 @@ void main(void) {
 	// Composition
 	vec4 color = vec4(baseColor.rgb, alpha);
 
-#ifdef FOG
-	float fog = CalcFogFactor();
-	color.rgb = fog * color.rgb + (1.0 - fog) * vFogColor;
-#endif
+#include<fogFragment>
 
 	gl_FragColor = color;
 }

materialsLibrary/materials/fire/fire.vertex.fx

@@ -2,9 +2,6 @@ precision highp float;
 
 // Attributes
 attribute vec3 position;
-#ifdef NORMAL
-attribute vec3 normal;
-#endif
 #ifdef UV1
 attribute vec2 uv;
 #endif
@@ -14,21 +11,11 @@ attribute vec2 uv2;
 #ifdef VERTEXCOLOR
 attribute vec4 color;
 #endif
-#ifdef BONES
-attribute vec4 matricesIndices;
-attribute vec4 matricesWeights;
-#endif
 
-// Uniforms
+#include<bonesDeclaration>
 
-#ifdef INSTANCES
-attribute vec4 world0;
-attribute vec4 world1;
-attribute vec4 world2;
-attribute vec4 world3;
-#else
-uniform mat4 world;
-#endif
+// Uniforms
+#include<instancesDeclaration>
 
 uniform mat4 view;
 uniform mat4 viewProjection;
@@ -37,32 +24,21 @@ uniform mat4 viewProjection;
 varying vec2 vDiffuseUV;
 #endif
 
-#ifdef BONES
-uniform mat4 mBones[BonesPerMesh];
-#endif
-
 #ifdef POINTSIZE
 uniform float pointSize;
 #endif
 
 // Output
 varying vec3 vPositionW;
-#ifdef NORMAL
-varying vec3 vNormalW;
-#endif
 
 #ifdef VERTEXCOLOR
 varying vec4 vColor;
 #endif
 
-#ifdef CLIPPLANE
-uniform vec4 vClipPlane;
-varying float fClipDistance;
-#endif
+#include<clipPlaneVertexDeclaration>
 
-#ifdef FOG
-varying float fFogDistance;
-#endif
+#include<fogVertexDeclaration>
+#include<shadowsVertexDeclaration>
 
 // Fire
 uniform float time;
@@ -73,36 +49,15 @@ varying vec2 vDistortionCoords2;
 varying vec2 vDistortionCoords3;
 
 void main(void) {
-	mat4 finalWorld;
-
-#ifdef INSTANCES
-	finalWorld = mat4(world0, world1, world2, world3);
-#else
-	finalWorld = world;
-#endif
 
-#ifdef BONES
-	mat4 m0 = mBones[int(matricesIndices.x)] * matricesWeights.x;
-	mat4 m1 = mBones[int(matricesIndices.y)] * matricesWeights.y;
-	mat4 m2 = mBones[int(matricesIndices.z)] * matricesWeights.z;
+#include<instancesVertex>
+#include<bonesVertex>
 
-#ifdef BONES4
-	mat4 m3 = mBones[int(matricesIndices.w)] * matricesWeights.w;
-	finalWorld = finalWorld * (m0 + m1 + m2 + m3);
-#else
-	finalWorld = finalWorld * (m0 + m1 + m2);
-#endif 
-
-#endif
 	gl_Position = viewProjection * finalWorld * vec4(position, 1.0);
 
 	vec4 worldPos = finalWorld * vec4(position, 1.0);
 	vPositionW = vec3(worldPos);
 
-#ifdef NORMAL
-	vNormalW = normalize(vec3(finalWorld * vec4(normal, 0.0)));
-#endif
-
 	// Texture coordinates
 #ifdef DIFFUSE
 	vDiffuseUV = uv;
@@ -110,14 +65,10 @@ void main(void) {
 #endif
 
 	// Clip plane
-#ifdef CLIPPLANE
-	fClipDistance = dot(worldPos, vClipPlane);
-#endif
+#include<clipPlaneVertex>
 
 	// Fog
-#ifdef FOG
-	fFogDistance = (view * worldPos).z;
-#endif
+#include<fogVertex>
 
 	// Vertex color
 #ifdef VERTEXCOLOR

materialsLibrary/materials/simple/babylon.simpleMaterial.ts

@@ -58,8 +58,10 @@ module BABYLON {
     }
 
     export class SimpleMaterial extends Material {
+        @serializeAsTexture()
         public diffuseTexture: BaseTexture;
 
+        @serializeAsColor3("diffuseColor")
         public diffuseColor = new Color3(1, 1, 1);
         public disableLighting = false;
 
@@ -344,18 +346,7 @@ module BABYLON {
         }
 
         public clone(name: string): SimpleMaterial {
-            var newMaterial = new SimpleMaterial(name, this.getScene());
-
-            // Base material
-            this.copyTo(newMaterial);
-
-            // Simple material
-            if (this.diffuseTexture && this.diffuseTexture.clone) {
-                newMaterial.diffuseTexture = this.diffuseTexture.clone();
-            }
-
-            newMaterial.diffuseColor = this.diffuseColor.clone();
-            return newMaterial;
+            return SerializationHelper.Clone<SimpleMaterial>(() => new SimpleMaterial(name, this.getScene()), this);
         }
         
         public serialize(): any {		

materialsLibrary/materials/sky/babylon.skyMaterial.ts

@@ -16,15 +16,28 @@ module BABYLON {
     
     export class SkyMaterial extends Material {
         // Public members
+        @serialize()
         public luminance: number = 1.0;
+        
+        @serialize()
 		public turbidity: number = 10.0;
+        
+        @serialize()
 		public rayleigh: number = 2.0;
-		public mieCoefficient: number = 0.005;
-		public mieDirectionalG: number = 0.8;
+		
+        @serialize()
+        public mieCoefficient: number = 0.005;
+		
+        @serialize()
+        public mieDirectionalG: number = 0.8;
         
         public distance: number = 500;
+        
+        @serialize()
         public inclination: number = 0.49;
-		public azimuth: number = 0.25;
+		
+        @serialize()
+        public azimuth: number = 0.25;
         
         // Private members
         private _sunPosition: Vector3 = Vector3.Zero();
@@ -134,7 +147,7 @@ module BABYLON {
                 var join = this._defines.toString();
                 this._effect = scene.getEngine().createEffect(shaderName,
                     attribs,
-                    ["world", "viewProjection",
+                    ["world", "viewProjection", "view",
                         "vFogInfos", "vFogColor", "pointSize", "vClipPlane",
                         "luminance", "turbidity", "rayleigh", "mieCoefficient", "mieDirectionalG", "sunPosition"
                     ],
@@ -190,10 +203,7 @@ module BABYLON {
             }
             
             // Fog
-            if (scene.fogEnabled && mesh.applyFog && scene.fogMode !== Scene.FOGMODE_NONE) {
-                this._effect.setFloat4("vFogInfos", scene.fogMode, scene.fogStart, scene.fogEnd, scene.fogDensity);
-                this._effect.setColor3("vFogColor", scene.fogColor);
-            }
+            MaterialHelper.BindFogParameters(scene, mesh, this._effect);
             
             // Sky
             this._effect.setFloat("luminance", this.luminance);
@@ -223,21 +233,7 @@ module BABYLON {
         }
 
         public clone(name: string): SkyMaterial {
-            var newMaterial = new SkyMaterial(name, this.getScene());
-
-            // Base material
-            this.copyTo(newMaterial);
-            
-            newMaterial.luminance = this.luminance;
-            newMaterial.turbidity = this.turbidity;
-            newMaterial.rayleigh = this.rayleigh;
-            newMaterial.mieCoefficient = this.mieCoefficient;
-            newMaterial.mieDirectionalG = this.mieDirectionalG;
-            newMaterial.distance = this.distance;
-            newMaterial.inclination = this.inclination;
-            newMaterial.azimuth = this.azimuth;
-            
-            return newMaterial;
+            return SerializationHelper.Clone<SkyMaterial>(() => new SkyMaterial(name, this.getScene()), this);
         }
 		
 		public serialize(): any {

materialsLibrary/materials/sky/sky.fragment.fx

@@ -7,9 +7,7 @@ varying vec3 vPositionW;
 varying vec4 vColor;
 #endif
 
-#ifdef CLIPPLANE
-varying float fClipDistance;
-#endif
+#include<clipPlaneFragmentDeclaration>
 
 // Sky
 uniform float luminance;
@@ -20,40 +18,7 @@ uniform float mieDirectionalG;
 uniform vec3 sunPosition;
 
 // Fog
-#ifdef FOG
-#define FOGMODE_NONE    0.
-#define FOGMODE_EXP     1.
-#define FOGMODE_EXP2    2.
-#define FOGMODE_LINEAR  3.
-#define E 2.71828
-
-uniform vec4 vFogInfos;
-uniform vec3 vFogColor;
-varying float fFogDistance;
-
-float CalcFogFactor()
-{
-	float fogCoeff = 1.0;
-	float fogStart = vFogInfos.y;
-	float fogEnd = vFogInfos.z;
-	float fogDensity = vFogInfos.w;
-
-	if (FOGMODE_LINEAR == vFogInfos.x)
-	{
-		fogCoeff = (fogEnd - fFogDistance) / (fogEnd - fogStart);
-	}
-	else if (FOGMODE_EXP == vFogInfos.x)
-	{
-		fogCoeff = 1.0 / pow(E, fFogDistance * fogDensity);
-	}
-	else if (FOGMODE_EXP2 == vFogInfos.x)
-	{
-		fogCoeff = 1.0 / pow(E, fFogDistance * fFogDistance * fogDensity * fogDensity);
-	}
-
-	return clamp(fogCoeff, 0.0, 1.0);
-}
-#endif
+#include<fogFragmentDeclaration>
 
 // Constants
 const float e = 2.71828182845904523536028747135266249775724709369995957;
@@ -112,21 +77,18 @@ float A = 0.15;
 float B = 0.50;
 float C = 0.10;
 float D = 0.20;
-float E = 0.02;
+float EEE = 0.02;
 float F = 0.30;
 float W = 1000.0;
 
 vec3 Uncharted2Tonemap(vec3 x)
 {
-	return ((x*(A*x+C*B)+D*E)/(x*(A*x+B)+D*F))-E/F;
+	return ((x*(A*x+C*B)+D*EEE)/(x*(A*x+B)+D*F))-EEE/F;
 }
 
 void main(void) {
 	// Clip plane
-#ifdef CLIPPLANE
-	if (fClipDistance > 0.0)
-		discard;
-#endif
+#include<clipPlaneFragment>
 
 	/**
 	*--------------------------------------------------------------------------------------------------
@@ -202,10 +164,8 @@ void main(void) {
 	// Composition
 	vec4 color = vec4(baseColor.rgb, alpha);
 
-#ifdef FOG
-	float fog = CalcFogFactor();
-	color.rgb = fog * color.rgb + (1.0 - fog) * vFogColor;
-#endif
+    // Fog
+#include<fogFragment>
 
 	gl_FragColor = color;
 }

materialsLibrary/materials/sky/sky.vertex.fx

@@ -9,6 +9,7 @@ attribute vec4 color;
 
 // Uniforms
 uniform mat4 world;
+uniform mat4 view;
 uniform mat4 viewProjection;
 
 #ifdef POINTSIZE
@@ -22,14 +23,8 @@ varying vec3 vPositionW;
 varying vec4 vColor;
 #endif
 
-#ifdef CLIPPLANE
-uniform vec4 vClipPlane;
-varying float fClipDistance;
-#endif
-
-#ifdef FOG
-varying float fFogDistance;
-#endif
+#include<clipPlaneVertexDeclaration>
+#include<fogVertexDeclaration>
 
 void main(void) {
 	gl_Position = viewProjection * world * vec4(position, 1.0);
@@ -38,14 +33,10 @@ void main(void) {
 	vPositionW = vec3(worldPos);
 
 	// Clip plane
-#ifdef CLIPPLANE
-	fClipDistance = dot(worldPos, vClipPlane);
-#endif
+#include<clipPlaneVertex>
 
 	// Fog
-#ifdef FOG
-	fFogDistance = (view * worldPos).z;
-#endif
+#include<fogVertex>
 
 	// Vertex color
 #ifdef VERTEXCOLOR