Browse Source

Allowing extending more than one configuration
Also added different light types

Raanan Weber 7 years ago
parent
commit
10d1ab0c4c

+ 1 - 8
Viewer/dist/ufoExample.html

@@ -18,22 +18,15 @@
     </head>
 
     <body>
-        <babylon id="babylon-viewer" extends="extended" templates.nav-bar.params.disable-on-fullscreen="true">
+        <babylon extends="extended, shadowSpotLight" templates.nav-bar.params.disable-on-fullscreen="true">
             <scene glow="true">
                 <main-color r="0.5" g="0.2" b="0.2"></main-color>
             </scene>
             <model url="https://models.babylonjs.com/ufo.glb">
                 <animation auto-start="true"></animation>
             </model>
-            <lights>
-                <light2 shadow-ortho-scale="0.5">
-                    <position y="1.2"></position>
-                </light2>
-            </lights>
         </babylon>
         <script src="viewer.js"></script>
-        <script>
-        </script>
     </body>
 
 </html>

+ 0 - 18
Viewer/src/configuration/types/extended.ts

@@ -23,24 +23,6 @@ export let extendedConfiguration: ViewerConfiguration = {
             radius: 0.135,
             spotAngle: 59.9967,
         },
-        "light2": {
-            type: 1,
-            shadowEnabled: true,
-            target: { x: 0, y: 0, z: 1 },
-            position: { x: 1.49, y: 2.39, z: -1.33 },
-            diffuse: { r: 0.867, g: 0.816, b: 0.788 },
-            intensity: 2.887,
-            intensityMode: 0,
-            shadowBufferSize: 1024,
-            shadowFrustumSize: 4.0,
-            shadowFieldOfView: 80.977,
-            shadowMinZ: 0.1,
-            shadowMaxZ: 12.0,
-            shadowConfig: {
-                blurKernel: 32,
-                useBlurExponentialShadowMap: true
-            }
-        },
         "light3": {
             type: 2,
             shadowEnabled: false,

+ 29 - 22
Viewer/src/configuration/types/index.ts

@@ -2,31 +2,38 @@ import { minimalConfiguration } from './minimal';
 import { defaultConfiguration } from './default';
 import { extendedConfiguration } from './extended';
 import { ViewerConfiguration } from '../configuration';
+import { shadowDirectionalLightConfiguration, shadowSpotlLightConfiguration } from './shadowLight';
 import * as deepmerge from '../../../assets/deepmerge.min.js';
 
-let getConfigurationType = function (type: string): ViewerConfiguration {
-    let config: ViewerConfiguration;
-    switch (type) {
-        case 'default':
-            config = defaultConfiguration;
-            break;
-        case 'extended':
-            config = extendedConfiguration;
-            break;
-        case 'minimal':
-            config = minimalConfiguration;
-            break;
-        case 'none':
-            config = {};
-            break;
-        default:
-            config = defaultConfiguration;
-    }
-
-    if (config.extends) {
-        config = deepmerge(config, getConfigurationType(config.extends));
-    }
+let getConfigurationType = function (types: string): ViewerConfiguration {
+    let config: ViewerConfiguration = {};
+    let typesSeparated = types.split(",");
+    typesSeparated.forEach(type => {
+        switch (type.trim()) {
+            case 'shadowDirectionalLight':
+                config = deepmerge(config, shadowDirectionalLightConfiguration);
+                break;
+            case 'shadowSpotLight':
+                config = deepmerge(config, shadowSpotlLightConfiguration);
+                break;
+            case 'extended':
+                config = deepmerge(config, extendedConfiguration);
+                break;
+            case 'minimal':
+                config = deepmerge(config, minimalConfiguration);
+                break;
+            case 'none':
+                break;
+            case 'default':
+            default:
+                config = deepmerge(config, defaultConfiguration);
+                break;
+        }
 
+        if (config.extends) {
+            config = deepmerge(config, getConfigurationType(config.extends));
+        }
+    });
     return config;
 
 }

+ 45 - 0
Viewer/src/configuration/types/shadowLight.ts

@@ -0,0 +1,45 @@
+import { ViewerConfiguration } from './../configuration';
+
+export const shadowDirectionalLightConfiguration: ViewerConfiguration = {
+    lights: {
+        shadowDirectionalLight: {
+            type: 1,
+            shadowEnabled: true,
+            target: { x: 0, y: 0, z: 1 },
+            position: { x: 1.49, y: 2.39, z: -1.33 },
+            diffuse: { r: 0.867, g: 0.816, b: 0.788 },
+            intensity: 2.887,
+            intensityMode: 0,
+            shadowBufferSize: 1024,
+            shadowFrustumSize: 4.0,
+            shadowFieldOfView: 80.977,
+            shadowMinZ: 0.1,
+            shadowMaxZ: 12.0,
+            shadowConfig: {
+                blurKernel: 32,
+                useBlurExponentialShadowMap: true
+            }
+        }
+    }
+}
+
+export const shadowSpotlLightConfiguration: ViewerConfiguration = {
+    lights: {
+        shadowSpotLight: {
+            type: 2,
+            shadowEnabled: true,
+            target: { x: 0, y: 0, z: 0 },
+            position: { x: 0, y: 2.1, z: 2.7 },
+            angle: 1,
+            shadowOrthoScale: 0.1,
+            shadowBufferSize: 1024,
+            shadowMinZ: 0.1,
+            shadowMaxZ: 50.0,
+            shadowConfig: {
+                frustumEdgeFalloff: 0.5,
+                blurKernel: 32,
+                useBlurExponentialShadowMap: true
+            }
+        }
+    }
+}

+ 9 - 8
Viewer/src/viewer/sceneManager.ts

@@ -349,13 +349,6 @@ export class SceneManager {
         if (!this.scene) {
             return;
         }
-        if (sceneConfig.debug) {
-            this.scene.debugLayer.show();
-        } else {
-            if (this.scene.debugLayer.isVisible()) {
-                this.scene.debugLayer.hide();
-            }
-        }
 
         let cc = sceneConfig.clearColor || { r: 0.9, g: 0.9, b: 0.9, a: 1.0 };
         let oldcc = this.scene.clearColor;
@@ -388,6 +381,14 @@ export class SceneManager {
             this.scene.environmentTexture = environmentTexture;
         }
 
+        if (sceneConfig.debug) {
+            this.scene.debugLayer.show();
+        } else {
+            if (this.scene.debugLayer.isVisible()) {
+                this.scene.debugLayer.hide();
+            }
+        }
+
         this.onSceneConfiguredObservable.notifyObservers({
             sceneManager: this,
             object: this.scene,
@@ -731,7 +732,7 @@ export class SceneManager {
             if (light instanceof ShadowLight) {
                 // set default values
                 light.shadowMinZ = light.shadowMinZ || 0.2;
-                light.shadowMaxZ = Math.min(10, light.shadowMaxZ); //large far clips reduce shadow depth precision
+                light.shadowMaxZ = Math.min(100, light.shadowMaxZ); //large far clips reduce shadow depth precision
 
                 if (lightConfig.target) {
                     if (light.setDirectionToTarget) {