Home Explore Help
Register Sign In
zhangyupeng
/
Babylon.js
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Allowing extending more than one configuration
Also added different light types

Raanan Weber 7 years ago
parent
8624cc4f94
commit
10d1ab0c4c
5 changed files with 84 additions and 56 deletions
Unified View Show Diff Stats
  1. 1 8
      Viewer/dist/ufoExample.html
  2. 0 18
      Viewer/src/configuration/types/extended.ts
  3. 29 22
      Viewer/src/configuration/types/index.ts
  4. 45 0
      Viewer/src/configuration/types/shadowLight.ts
  5. 9 8
      Viewer/src/viewer/sceneManager.ts

+ 1 - 8
Viewer/dist/ufoExample.html
View File 

@@ -18,22 +18,15 @@
 
     </head>

     </head>

 

 

     <body>

     <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">

             <scene glow="true">

                 <main-color r="0.5" g="0.2" b="0.2"></main-color>

                 <main-color r="0.5" g="0.2" b="0.2"></main-color>

             </scene>

             </scene>

             <model url="https://models.babylonjs.com/ufo.glb">

             <model url="https://models.babylonjs.com/ufo.glb">

                 <animation auto-start="true"></animation>

                 <animation auto-start="true"></animation>

             </model>

             </model>

-            <lights>

-                <light2 shadow-ortho-scale="0.5">

-                    <position y="1.2"></position>

-                </light2>

-            </lights>

         </babylon>

         </babylon>

         <script src="viewer.js"></script>

         <script src="viewer.js"></script>

-        <script>

-        </script>

     </body>

     </body>

 

 

 </html>
 
 </html>

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

@@ -23,24 +23,6 @@ export let extendedConfiguration: ViewerConfiguration = {
 
             radius: 0.135,

             radius: 0.135,

             spotAngle: 59.9967,

             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": {

         "light3": {

             type: 2,

             type: 2,

             shadowEnabled: false,

             shadowEnabled: false,

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

@@ -2,31 +2,38 @@ import { minimalConfiguration } from './minimal';
 
 import { defaultConfiguration } from './default';

 import { defaultConfiguration } from './default';

 import { extendedConfiguration } from './extended';

 import { extendedConfiguration } from './extended';

 import { ViewerConfiguration } from '../configuration';

 import { ViewerConfiguration } from '../configuration';

+import { shadowDirectionalLightConfiguration, shadowSpotlLightConfiguration } from './shadowLight';

 import * as deepmerge from '../../../assets/deepmerge.min.js';

 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;

     return config;

 

 

 }

 }

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

@@ -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
View File 

@@ -349,13 +349,6 @@ export class SceneManager {
 
         if (!this.scene) {

         if (!this.scene) {

             return;

             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 cc = sceneConfig.clearColor || { r: 0.9, g: 0.9, b: 0.9, a: 1.0 };

         let oldcc = this.scene.clearColor;

         let oldcc = this.scene.clearColor;

@@ -388,6 +381,14 @@ export class SceneManager {
 
             this.scene.environmentTexture = environmentTexture;

             this.scene.environmentTexture = environmentTexture;

         }

         }

 

 

+        if (sceneConfig.debug) {

+            this.scene.debugLayer.show();

+        } else {

+            if (this.scene.debugLayer.isVisible()) {

+                this.scene.debugLayer.hide();

+            }

+        }

+

         this.onSceneConfiguredObservable.notifyObservers({

         this.onSceneConfiguredObservable.notifyObservers({

             sceneManager: this,

             sceneManager: this,

             object: this.scene,

             object: this.scene,

@@ -731,7 +732,7 @@ export class SceneManager {
 
             if (light instanceof ShadowLight) {

             if (light instanceof ShadowLight) {

                 // set default values

                 // set default values

                 light.shadowMinZ = light.shadowMinZ || 0.2;

                 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 (lightConfig.target) {

                     if (light.setDirectionToTarget) {

                     if (light.setDirectionToTarget) {