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

Merge remote-tracking branch 'origin/master' into native_updated

Gary Hsu 6 years ago
parent
7367fe3d49 ae17dcfc45
commit
ae1619e67d
100 changed files with 192157 additions and 56770 deletions
Unified View Show Diff Stats
  1. BIN
      Playground/LogoPBT.png
  2. 2409 416
      Playground/babylon.d.txt
  3. 4 1
      Playground/css/index.css
  4. 429 420
      Playground/debug.html
  5. 81 73
      Playground/frame.html
  6. 50 53
      Playground/full.html
  7. 9 0
      Playground/index-local.html
  8. 10 0
      Playground/index.html
  9. 8 0
      Playground/indexStable.html
  10. 7 0
      Playground/js/index.js
  11. 89 0
      Playground/js/jquery.qrcode.js
  12. 1237 0
      Playground/js/qrcode.js
  13. BIN
      Playground/textures/sidexside.jpg
  14. BIN
      Playground/textures/skyboxBlack_nx.jpg
  15. BIN
      Playground/textures/skyboxBlack_ny.jpg
  16. BIN
      Playground/textures/skyboxBlack_nz.jpg
  17. BIN
      Playground/textures/skyboxBlack_px.jpg
  18. BIN
      Playground/textures/skyboxBlack_py.jpg
  19. BIN
      Playground/textures/skyboxBlack_pz.jpg
  20. BIN
      Playground/textures/topbottom.jpg
  21. 402 397
      Playground/ts.html
  22. 61 5
      Tools/Config/config.json
  23. 1 1
      Tools/Gulp/gulpfile.js
  24. 1 1
      Tools/Gulp/package.json
  25. 6 0
      Tools/Gulp/tasks/gulpTasks-intellisense.js
  26. 5 0
      Tools/Publisher/tasks/prepareEs6DevPackages.js
  27. 16 16
      azure-pipelines.yml
  28. 37 38
      bower.json
  29. 40 665
      dist/ammo.js
  30. 2 0
      dist/babylon.d.ts
  31. 1 1
      dist/babylon.js
  32. 61 52
      dist/babylon.max.js
  33. 1 1
      dist/babylon.max.js.map
  34. 4 0
      dist/babylon.module.d.ts
  35. 5 52
      dist/gltf2Interface/babylon.glTF2Interface.d.ts
  36. 1 1
      dist/gltf2Interface/package.json
  37. 4458 4573
      dist/gltf_validator.js
  38. 2 2
      dist/gui/package.json
  39. 6 6
      dist/inspector/package.json
  40. 7 4
      dist/loaders/babylon.glTF1FileLoader.js
  41. 1 1
      dist/loaders/babylon.glTF1FileLoader.js.map
  42. 2 2
      dist/loaders/babylon.glTF1FileLoader.min.js
  43. 7 4
      dist/loaders/babylon.glTF2FileLoader.js
  44. 1 1
      dist/loaders/babylon.glTF2FileLoader.js.map
  45. 1 1
      dist/loaders/babylon.glTF2FileLoader.min.js
  46. 7 4
      dist/loaders/babylon.glTFFileLoader.js
  47. 1 1
      dist/loaders/babylon.glTFFileLoader.js.map
  48. 2 2
      dist/loaders/babylon.glTFFileLoader.min.js
  49. 2 2
      dist/loaders/babylonjs.loaders.d.ts
  50. 7 4
      dist/loaders/babylonjs.loaders.js
  51. 1 1
      dist/loaders/babylonjs.loaders.js.map
  52. 1 1
      dist/loaders/babylonjs.loaders.min.js
  53. 28 28
      dist/loaders/babylonjs.loaders.module.d.ts
  54. 3 3
      dist/loaders/package.json
  55. 2 2
      dist/materialsLibrary/package.json
  56. 2 2
      dist/postProcessesLibrary/package.json
  57. 40 665
      dist/preview release/ammo.js
  58. 2427 360
      dist/preview release/babylon.d.ts
  59. 2 2
      dist/preview release/babylon.js
  60. 8150 1238
      dist/preview release/babylon.max.js
  61. 1 1
      dist/preview release/babylon.max.js.map
  62. 46917 42560
      dist/preview release/babylon.module.d.ts
  63. 68504 0
      dist/preview release/documentation.d.ts
  64. 5 52
      dist/preview release/glTF2Interface/babylon.glTF2Interface.d.ts
  65. 1 1
      dist/preview release/glTF2Interface/package.json
  66. 4458 4573
      dist/preview release/gltf_validator.js
  67. 0 2
      dist/preview release/gui/babylon.gui.d.ts
  68. 46 112
      dist/preview release/gui/babylon.gui.js
  69. 1 1
      dist/preview release/gui/babylon.gui.js.map
  70. 1 1
      dist/preview release/gui/babylon.gui.min.js
  71. 0 4
      dist/preview release/gui/babylon.gui.module.d.ts
  72. 2 2
      dist/preview release/gui/package.json
  73. 7 7
      dist/preview release/inspector/babylon.inspector.bundle.js
  74. 421 155
      dist/preview release/inspector/babylon.inspector.bundle.max.js
  75. 1 1
      dist/preview release/inspector/babylon.inspector.bundle.max.js.map
  76. 59 33
      dist/preview release/inspector/babylon.inspector.d.ts
  77. 127 68
      dist/preview release/inspector/babylon.inspector.module.d.ts
  78. 9 7
      dist/preview release/inspector/package.json
  79. 7 4
      dist/preview release/loaders/babylon.glTF1FileLoader.js
  80. 1 1
      dist/preview release/loaders/babylon.glTF1FileLoader.js.map
  81. 2 2
      dist/preview release/loaders/babylon.glTF1FileLoader.min.js
  82. 20 13
      dist/preview release/loaders/babylon.glTF2FileLoader.js
  83. 1 1
      dist/preview release/loaders/babylon.glTF2FileLoader.js.map
  84. 1 1
      dist/preview release/loaders/babylon.glTF2FileLoader.min.js
  85. 20 13
      dist/preview release/loaders/babylon.glTFFileLoader.js
  86. 1 1
      dist/preview release/loaders/babylon.glTFFileLoader.js.map
  87. 2 2
      dist/preview release/loaders/babylon.glTFFileLoader.min.js
  88. 2 2
      dist/preview release/loaders/babylonjs.loaders.d.ts
  89. 20 13
      dist/preview release/loaders/babylonjs.loaders.js
  90. 1 1
      dist/preview release/loaders/babylonjs.loaders.js.map
  91. 1 1
      dist/preview release/loaders/babylonjs.loaders.min.js
  92. 28 28
      dist/preview release/loaders/babylonjs.loaders.module.d.ts
  93. 3 3
      dist/preview release/loaders/package.json
  94. 2 2
      dist/preview release/materialsLibrary/package.json
  95. 609 0
      dist/preview release/nodeEditor/babylon.nodeEditor.d.ts
  96. 41 0
      dist/preview release/nodeEditor/babylon.nodeEditor.js
  97. 49372 0
      dist/preview release/nodeEditor/babylon.nodeEditor.max.js
  98. 1 0
      dist/preview release/nodeEditor/babylon.nodeEditor.max.js.map
  99. 1325 0
      dist/preview release/nodeEditor/babylon.nodeEditor.module.d.ts
  100. 0 0
      dist/preview release/nodeEditor/package.json

BIN
Playground/LogoPBT.png
View File


File diff suppressed because it is too large
+ 2409 - 416
Playground/babylon.d.txt


+ 4 - 1
Playground/css/index.css
View File 

@@ -28,12 +28,15 @@ body {
 
     display: grid;

     display: grid;

     grid-template-rows: 100%;

     grid-template-rows: 100%;

     grid-template-columns: 100%;

     grid-template-columns: 100%;

+    align-items: center;

 }

 }

 

 

 #waitLogo {

 #waitLogo {

     grid-column: 1;

     grid-column: 1;

     grid-row: 1;

     grid-row: 1;

-    margin: 25%;

+    margin: auto;

+    width: 40%;

+    height: 40%;

 }

 }

 

 

 #waitSpinner {

 #waitSpinner {

+ 429 - 420
Playground/debug.html
View File 

@@ -1,507 +1,516 @@
 
 <!DOCTYPE html>

 <!DOCTYPE html>

 <html>

 <html>

 

 

-    <head>

-        <title>Babylon.js Playground</title>

-        <meta charset='utf-8' />

-        <meta name="viewport" content="width=device-width, user-scalable=no">

-        <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

-        <link rel="apple-touch-icon" sizes="57x57" href="https://www.babylonjs.com/img/favicon/apple-icon-57x57.png">

-        <link rel="apple-touch-icon" sizes="60x60" href="https://www.babylonjs.com/img/favicon/apple-icon-60x60.png">

-        <link rel="apple-touch-icon" sizes="72x72" href="https://www.babylonjs.com/img/favicon/apple-icon-72x72.png">

-        <link rel="apple-touch-icon" sizes="76x76" href="https://www.babylonjs.com/img/favicon/apple-icon-76x76.png">

-        <link rel="apple-touch-icon" sizes="114x114" href="https://www.babylonjs.com/img/favicon/apple-icon-114x114.png">

-        <link rel="apple-touch-icon" sizes="120x120" href="https://www.babylonjs.com/img/favicon/apple-icon-120x120.png">

-        <link rel="apple-touch-icon" sizes="144x144" href="https://www.babylonjs.com/img/favicon/apple-icon-144x144.png">

-        <link rel="apple-touch-icon" sizes="152x152" href="https://www.babylonjs.com/img/favicon/apple-icon-152x152.png">

-        <link rel="apple-touch-icon" sizes="180x180" href="https://www.babylonjs.com/img/favicon/apple-icon-180x180.png">

-        <link rel="icon" type="image/png" sizes="192x192" href="https://www.babylonjs.com/img/favicon/android-icon-192x192.png">

-        <link rel="icon" type="image/png" sizes="32x32" href="https://www.babylonjs.com/img/favicon/favicon-32x32.png">

-        <link rel="icon" type="image/png" sizes="96x96" href="https://www.babylonjs.com/img/favicon/favicon-96x96.png">

-        <link rel="icon" type="image/png" sizes="16x16" href="https://www.babylonjs.com/img/favicon/favicon-16x16.png">

-        <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

-        <meta name="msapplication-TileColor" content="#ffffff">

-        <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

-        <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

-        <meta name="theme-color" content="#ffffff">

-

-        <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

-        <!--For canvas/code separator-->

-        <script src="js/libs/split.js"></script>

-

-        <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>

-        <!-- jszip -->

-        <script src="js/libs/jszip.min.js"></script>

-        <script src="js/libs/fileSaver.js"></script>

-

-        <!-- Babylon.js -->

-        <script src="https://preview.babylonjs.com/ammo.js"></script>

-        <script src="https://preview.babylonjs.com/cannon.js"></script>

-        <script src="https://preview.babylonjs.com/Oimo.js"></script>

-        <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

-        <script src="https://preview.babylonjs.com/babylon.max.js"></script>

-        <script src="https://preview.babylonjs.com/gui/babylon.gui.js"></script>

-        <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

-

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.fireMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.waterMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.lavaMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.normalMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.skyMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.triPlanarMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.terrainMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gradientMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.furMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gridMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.shadowOnlyMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.customMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.cellMaterial.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.brickProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.cloudProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.fireProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.grassProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.marbleProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.roadProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.starfieldProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.woodProceduralTexture.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.asciiArtPostProcess.min.js"></script>

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.digitalRainPostProcess.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/loaders/babylon.glTFFileLoader.js"></script>

-        <script src="https://preview.babylonjs.com/loaders/babylon.objFileLoader.js"></script>

-        <script src="https://preview.babylonjs.com/loaders/babylon.stlFileLoader.js"></script>

-

-

-

-        <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

-

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

-        <link href="css/index.css" rel="stylesheet" />

-

-        <!-- Monaco -->

-        <script src="node_modules/monaco-editor/min/vs/loader.js"></script>

-

-    </head>

-

-    <body>

-        <div class="navbar navBar1600">

-            <div class="title">

-                Babylon.js Playground

-            </div>

-            <div class="version" id="mainTitle">

-                v3.0-alpha

-            </div>

+<head>

+    <title>Babylon.js Playground</title>

+    <meta charset='utf-8' />

+    <meta name="viewport" content="width=device-width, user-scalable=no">

+    <link rel="shortcut icon" href="https://www.babylonjs.com/favicon.ico">

+    <link rel="stylesheet" href="https://use.typekit.net/cta4xsb.css">

+    <link rel="apple-touch-icon" sizes="57x57" href="https://www.babylonjs.com/img/favicon/apple-icon-57x57.png">

+    <link rel="apple-touch-icon" sizes="60x60" href="https://www.babylonjs.com/img/favicon/apple-icon-60x60.png">

+    <link rel="apple-touch-icon" sizes="72x72" href="https://www.babylonjs.com/img/favicon/apple-icon-72x72.png">

+    <link rel="apple-touch-icon" sizes="76x76" href="https://www.babylonjs.com/img/favicon/apple-icon-76x76.png">

+    <link rel="apple-touch-icon" sizes="114x114" href="https://www.babylonjs.com/img/favicon/apple-icon-114x114.png">

+    <link rel="apple-touch-icon" sizes="120x120" href="https://www.babylonjs.com/img/favicon/apple-icon-120x120.png">

+    <link rel="apple-touch-icon" sizes="144x144" href="https://www.babylonjs.com/img/favicon/apple-icon-144x144.png">

+    <link rel="apple-touch-icon" sizes="152x152" href="https://www.babylonjs.com/img/favicon/apple-icon-152x152.png">

+    <link rel="apple-touch-icon" sizes="180x180" href="https://www.babylonjs.com/img/favicon/apple-icon-180x180.png">

+    <link rel="icon" type="image/png" sizes="192x192"

+        href="https://www.babylonjs.com/img/favicon/android-icon-192x192.png">

+    <link rel="icon" type="image/png" sizes="32x32" href="https://www.babylonjs.com/img/favicon/favicon-32x32.png">

+    <link rel="icon" type="image/png" sizes="96x96" href="https://www.babylonjs.com/img/favicon/favicon-96x96.png">

+    <link rel="icon" type="image/png" sizes="16x16" href="https://www.babylonjs.com/img/favicon/favicon-16x16.png">

+    <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

+    <meta name="msapplication-TileColor" content="#ffffff">

+    <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

+    <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

+    <meta name="theme-color" content="#ffffff">

+

+    <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

+    <!--For canvas/code separator-->

+    <script src="js/libs/split.js"></script>

+

+    <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>

+    <!-- jszip -->

+    <script src="js/libs/jszip.min.js"></script>

+    <script src="js/libs/fileSaver.js"></script>

+

+    <!-- Babylon.js -->

+    <script src="https://preview.babylonjs.com/ammo.js"></script>

+    <script src="https://preview.babylonjs.com/cannon.js"></script>

+    <script src="https://preview.babylonjs.com/Oimo.js"></script>

+    <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

+    <script src="https://preview.babylonjs.com/babylon.max.js"></script>

+    <script src="https://preview.babylonjs.com/gui/babylon.gui.js"></script>

+    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js"></script>

+

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.fireMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.waterMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.lavaMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.normalMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.skyMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.triPlanarMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.terrainMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gradientMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.furMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gridMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.shadowOnlyMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.customMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.cellMaterial.min.js"></script>

+

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.brickProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.cloudProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.fireProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.grassProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.marbleProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.roadProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.starfieldProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.woodProceduralTexture.min.js"></script>

+

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.asciiArtPostProcess.min.js"></script>

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.digitalRainPostProcess.min.js"></script>

+

+    <script src="https://preview.babylonjs.com/loaders/babylon.glTFFileLoader.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylon.objFileLoader.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylon.stlFileLoader.js"></script>

+

+

+

+    <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

+

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

+    <link href="css/index.css" rel="stylesheet" />

+

+    <!-- Monaco -->

+    <script src="node_modules/monaco-editor/min/vs/loader.js"></script>

+

+</head>

+

+<body>

+    <div class="navbar navBar1600">

+        <div class="title">

+            Babylon.js Playground

+        </div>

+        <div class="version" id="mainTitle">

+            v3.0-alpha

+        </div>

 

 

-            <div class="category">

-                <div class="button run" id="runButton1600">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button run" id="runButton1600">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1600">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1600">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1600">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1600">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1600">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1600">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1600">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1600">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1600">Dark</div>

-                                <div class="option" id="lightTheme1600">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1600">Dark</div>

+                            <div class="option" id="lightTheme1600">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1600">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle1600">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1600">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="fullscreenButton1600">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1600">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1600">Format code</div>

-                        <div class="option" id="minimapToggle1600">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1600">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

                     </div>

                     </div>

+                    <div class="option" id="safemodeToggle1600">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1600">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1600">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1600">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1600">Format code</div>

+                    <div class="option" id="minimapToggle1600">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

                 </div>

                 </div>

-

-                <div class="button uncheck" id="debugButton1600">Inspector</div>

-                <div class="button" id="metadataButton1600">Metadata</div>

             </div>

             </div>

 

 

+            <div class="button uncheck" id="debugButton1600">Inspector</div>

+            <div class="button" id="metadataButton1600">Metadata</div>

+        </div>

 

 

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span id="currentVersion1600">Version: Latest</span>

-                    <div class="toDisplay">

-                        <div class="option" onclick="setVersion('latest');">Latest</div>

-                        <div class="option" onclick="setVersion('2.5');">2.5</div>

-                    </div>

-                </div>

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

+

+        <div class="category right">

+            <div class="button select">

+                <span id="currentVersion1600">Version: Latest</span>

+                <div class="toDisplay">

+                    <div class="option" onclick="setVersion('latest');">Latest</div>

+                    <div class="option" onclick="setVersion('2.5');">2.5</div>

                 </div>

                 </div>

             </div>

             </div>

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

+            </div>

         </div>

         </div>

+    </div>

 

 

-        <div class="navbar navBar1475">

-            <div class="title">

-                Babylon.js Playground

-            </div>

-            <div class="version" id="mainTitle">

-                v3.0-alpha

-            </div>

+    <div class="navbar navBar1475">

+        <div class="title">

+            Babylon.js Playground

+        </div>

+        <div class="version" id="mainTitle">

+            v3.0-alpha

+        </div>

 

 

-            <div class="category">

-                <div class="button run" id="runButton1475">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button run" id="runButton1475">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1475">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1475">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1475">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1475">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1475">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1475">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1475">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1475">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1475">Dark</div>

-                                <div class="option" id="lightTheme1475">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1475">Dark</div>

+                            <div class="option" id="lightTheme1475">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1475">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id='safemodeToggle1475'>Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1475">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="fullscreenButton1475">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1475">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1475">Format code</div>

-                        <div class="option" id="minimapToggle1475">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1475">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton1475">Inspector</div>

-                        <div class="option" id="metadataButton1475">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion1475">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('2.5');">2.5</div>

-                            </div>

+                    </div>

+                    <div class="option" id='safemodeToggle1475'>Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1475">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1475">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1475">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1475">Format code</div>

+                    <div class="option" id="minimapToggle1475">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton1475">Inspector</div>

+                    <div class="option" id="metadataButton1475">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion1475">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('2.5');">2.5</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

-                </div>

+        <div class="category right">

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

             </div>

             </div>

         </div>

         </div>

+    </div>

 

 

-        <div class="navbar navBar1030">

-            <div class="category">

-                <div class="button run" id="runButton1030">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+    <div class="navbar navBar1030">

+        <div class="category">

+            <div class="button run" id="runButton1030">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1030">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1030">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1030">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1030">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1030">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1030">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1030">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1030">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1030">Dark</div>

-                                <div class="option" id="lightTheme1030">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1030">Dark</div>

+                            <div class="option" id="lightTheme1030">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1030">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle1030">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1030">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="fullscreenButton1030">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1030">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1030">Format code</div>

-                        <div class="option" id="minimapToggle1030">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1030">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton1030">Inspector</div>

-                        <div class="option" id="metadataButton1030">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion1030">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('2.5');">2.5</div>

-                            </div>

+                    </div>

+                    <div class="option" id="safemodeToggle1030">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1030">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1030">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1030">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1030">Format code</div>

+                    <div class="option" id="minimapToggle1030">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton1030">Inspector</div>

+                    <div class="option" id="metadataButton1030">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion1030">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('2.5');">2.5</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

-                </div>

+        <div class="category right">

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

             </div>

             </div>

         </div>

         </div>

-

-        <div class="navbar navBar750">

-            <div class="category">

-                <div class="button select">File

-                    <div class="toDisplay">

-                        <div class="option" id="runButton750">Run

-                            <i class="fa fa-play" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="newButton750">New

-                            <i class="fa fa-file" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="clearButton750">Clear

-                            <i class="fa fa-trash" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="saveButton750">Save

-                            <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="zipButton750">Zip

-                            <i class="fa fa-download" aria-hidden="true"></i>

-                        </div>

+    </div>

+

+    <div class="navbar navBar750">

+        <div class="category">

+            <div class="button select">File

+                <div class="toDisplay">

+                    <div class="option" id="runButton750">Run

+                        <i class="fa fa-play" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="newButton750">New

+                        <i class="fa fa-file" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="clearButton750">Clear

+                        <i class="fa fa-trash" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="saveButton750">Save

+                        <i class="fa fa-floppy-o" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="zipButton750">Zip

+                        <i class="fa fa-download" aria-hidden="true"></i>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme750">Dark</div>

-                                <div class="option" id="lightTheme750">Light</div>

-                            </div>

-                        </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize750">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle750">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div style="display:none;" class="option checked" id="editorButton750">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme750">Dark</div>

+                            <div class="option" id="lightTheme750">Light</div>

                         </div>

                         </div>

-                        <div class="option" id="fullscreenButton750">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton750">Editor Fullscreen</div>

-                        <div class="option" id="formatButton750">Format code</div>

-                        <div class="option" id="minimapToggle750">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize750">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton750">Inspector</div>

-                        <div class="option" id="metadataButton750">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion750">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('2.5');">2.5</div>

-                            </div>

+                    </div>

+                    <div class="option" id="safemodeToggle750">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div style="display:none;" class="option checked" id="editorButton750">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton750">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton750">Editor Fullscreen</div>

+                    <div class="option" id="formatButton750">Format code</div>

+                    <div class="option" id="minimapToggle750">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton750">Inspector</div>

+                    <div class="option" id="metadataButton750">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion750">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('2.5');">2.5</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

-

-            <div class="category right">

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

-                </div>

-            </div>

         </div>

         </div>

 

 

-        <div class="wrapper">

-            <div id="jsEditor"></div>

-            <div id="canvasZone">

-                <canvas touch-action="none" id="renderCanvas"></canvas>

-            </div>

-        </div>

-        <div id="exampleList">

-            <div id="exampleBanner">

-                <h1>Examples</h1>

+        <div class="category right">

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

             </div>

             </div>

-            <div class="horizontalSeparator"></div>

-            <input id="filterBar" type="text" placeholder="Filter examples...">

-            <img id="filterBarClear" src="https://d33wubrfki0l68.cloudfront.net/17ca450bae302631f4857cd8c3992234ec5dd9a7/057f9/img/ui/clear_button.png">

         </div>

         </div>

+    </div>

 

 

-        <span class="label" id="fpsLabel">FPS</span>

-

-        <div id="errorZone">

+    <div class="wrapper">

+        <div id="jsEditor"></div>

+        <div id="canvasZone">

+            <canvas touch-action="none" id="renderCanvas"></canvas>

         </div>

         </div>

-

-        <div class="navbarBottom">

-            <div id="statusBar"></div>

-            <div class="links">

-                <div class='link'>

-                    <a target='_new' href="https://www.netlify.com/">Deployed by Netlify</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://forum.babylonjs.com/">Forum</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://www.babylonjs.com/sandbox">Sandbox</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://doc.babylonjs.com">Documentation</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://doc.babylonjs.com/playground">Search</a>

-                </div>

+    </div>

+    <div id="exampleList">

+        <div id="exampleBanner">

+            <h1>Examples</h1>

+        </div>

+        <div class="horizontalSeparator"></div>

+        <input id="filterBar" type="text" placeholder="Filter examples...">

+        <img id="filterBarClear"

+            src="https://d33wubrfki0l68.cloudfront.net/17ca450bae302631f4857cd8c3992234ec5dd9a7/057f9/img/ui/clear_button.png">

+    </div>

+

+    <span class="label" id="fpsLabel">FPS</span>

+

+    <div id="errorZone">

+    </div>

+

+    <div class="navbarBottom">

+        <div id="statusBar"></div>

+        <div class="links">

+            <div class='link'>

+                <a target='_new' href="https://www.netlify.com/">Deployed by Netlify</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://forum.babylonjs.com/">Forum</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://www.babylonjs.com/sandbox">Sandbox</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://doc.babylonjs.com">Documentation</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://doc.babylonjs.com/playground">Search</a>

             </div>

             </div>

         </div>

         </div>

+    </div>

 

 

-        <div id="saveLayer" class="save-layer">

-            <div class="save-form">

-                <label for="saveFormTitle">TITLE</label>

-                <div class="separator"></div>

-                <input type="text" maxlength="120" id="saveFormTitle" class="save-form-title">

+    <div id="saveLayer" class="save-layer">

+        <div class="save-form">

+            <label for="saveFormTitle">TITLE</label>

+            <div class="separator"></div>

+            <input type="text" maxlength="120" id="saveFormTitle" class="save-form-title">

 

 

-                <label for="saveFormDescription">DESCRIPTION</label>

-                <div class="separator"></div>

-                <textarea id="saveFormDescription" rows="4" cols="10"></textarea>

+            <label for="saveFormDescription">DESCRIPTION</label>

+            <div class="separator"></div>

+            <textarea id="saveFormDescription" rows="4" cols="10"></textarea>

 

 

-                <label for="saveFormTags">TAGS (separated by comma)</label>

-                <div class="separator"></div>

-                <textarea id="saveFormTags" rows="4" cols="10"></textarea>

+            <label for="saveFormTags">TAGS (separated by comma)</label>

+            <div class="separator"></div>

+            <textarea id="saveFormTags" rows="4" cols="10"></textarea>

 

 

-                <div class="save-form-buttons" id="saveFormButtons">

+            <div class="save-form-buttons" id="saveFormButtons">

 

 

-                    <div id="saveFormButtonOk" class="button">OK</div>

-                    <div id="saveFormButtonCancel" class="button">Cancel</div>

-                </div>

+                <div id="saveFormButtonOk" class="button">OK</div>

+                <div id="saveFormButtonCancel" class="button">Cancel</div>

             </div>

             </div>

         </div>

         </div>

+    </div>

 

 

-        <script src="https://code.jquery.com/jquery.js"></script>

+    <script src="https://code.jquery.com/jquery.js"></script>

 

 

-        <script src="js/actions.js"></script>

-        <script src="js/pbt.js"></script>

-        <script src="js/index.js"></script>

+    <script src="js/actions.js"></script>

+    <script src="js/pbt.js"></script>

+    <script src="js/index.js"></script>

 

 

-        <!-- Global site tag (gtag.js) - Google Analytics -->

-        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

-        <script>

-            window.dataLayer = window.dataLayer || [];

-            function gtag() { dataLayer.push(arguments); }

-            gtag('js', new Date());

+    <!-- Global site tag (gtag.js) - Google Analytics -->

+    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

+    <script>

+        window.dataLayer = window.dataLayer || [];

+        function gtag() { dataLayer.push(arguments); }

+        gtag('js', new Date());

 

 

-            gtag('config', 'UA-41767310-2');

-        </script>

-    </body>

+        gtag('config', 'UA-41767310-2');

+    </script>

+</body>

 

 

-</html>

+</html>

+ 81 - 73
Playground/frame.html
View File 

@@ -1,93 +1,101 @@
 
 <!DOCTYPE html>

 <!DOCTYPE html>

 <html>

 <html>

 

 

-    <head>

-        <title>Babylon.js Playground</title>

-        <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

-        <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

-        <meta name="msapplication-TileColor" content="#ffffff">

-        <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

-        <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

-        <meta name="theme-color" content="#ffffff">

-        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">

+<head>

+    <title>Babylon.js Playground</title>

+    <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

+    <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

+    <meta name="msapplication-TileColor" content="#ffffff">

+    <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

+    <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

+    <meta name="theme-color" content="#ffffff">

+    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">

 

 

-        <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

+    <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

 

 

-        <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>

-        <!-- Babylon.js -->

-        <script src="https://preview.babylonjs.com/ammo.js"></script>

-        <script src="https://preview.babylonjs.com/cannon.js"></script>

-        <script src="https://preview.babylonjs.com/Oimo.js"></script>

-        <script src="https://preview.babylonjs.com/earcut.min.js"></script>

-        <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

-        <script src="https://preview.babylonjs.com/babylon.js"></script>

-        <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

-        <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>

+    <!-- Babylon.js -->

+    <script src="https://preview.babylonjs.com/ammo.js"></script>

+    <script src="https://preview.babylonjs.com/cannon.js"></script>

+    <script src="https://preview.babylonjs.com/Oimo.js"></script>

+    <script src="https://preview.babylonjs.com/earcut.min.js"></script>

+    <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

+    <script src="https://preview.babylonjs.com/babylon.js"></script>

+    <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

+    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js"></script>

 

 

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.fireMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.waterMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.lavaMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.normalMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.skyMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.triPlanarMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.terrainMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gradientMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.furMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gridMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.shadowOnlyMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.customMaterial.min.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylon.cellMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.fireMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.waterMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.lavaMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.normalMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.skyMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.triPlanarMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.terrainMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gradientMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.furMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.gridMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.shadowOnlyMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.customMaterial.min.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylon.cellMaterial.min.js"></script>

 

 

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.brickProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.cloudProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.fireProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.grassProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.marbleProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.roadProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.starfieldProceduralTexture.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.woodProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.brickProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.cloudProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.fireProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.grassProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.marbleProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.roadProceduralTexture.min.js"></script>

+    <script

+        src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.starfieldProceduralTexture.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylon.woodProceduralTexture.min.js"></script>

 

 

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.asciiArtPostProcess.min.js"></script>

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.digitalRainPostProcess.min.js"></script>

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.asciiArtPostProcess.min.js"></script>

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylon.digitalRainPostProcess.min.js"></script>

 

 

-        <script src="https://preview.babylonjs.com/loaders/babylon.glTFFileLoader.js"></script>

-        <script src="https://preview.babylonjs.com/loaders/babylon.objFileLoader.js"></script>

-        <script src="https://preview.babylonjs.com/loaders/babylon.stlFileLoader.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylon.glTFFileLoader.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylon.objFileLoader.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylon.stlFileLoader.js"></script>

 

 

-        <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

+    <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

 

 

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

-        <link href="frame.css" rel="stylesheet" />

-    </head>

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

+    <link href="frame.css" rel="stylesheet" />

+</head>

 

 

-    <body>

-        <canvas touch-action="none" id="renderCanvas" tabindex="1"></canvas>

+<body>

+    <canvas touch-action="none" id="renderCanvas" tabindex="1"></canvas>

 

 

-        <div class="footer">

+    <div class="footer">

         <span id="fpsLabel">FPS</span>

         <span id="fpsLabel">FPS</span>

         <div class="footerRight">

         <div class="footerRight">

-                <a href="javascript:void(null);">

-                    <img id="refresh" src="textures/icons/refresh.png"  width="36" height="36" alt="Reload page" title="Reload page"/>

-                </a>

-                <a id="edit" href="#" target="_blank">

-                    <img src="textures/icons/edit.png" width="36" height="36" alt="Edit in playground" title="Edit in playground"/>

-                </a>

-        </div>

+            <a href="javascript:void(null);">

+                <img id="refresh" src="textures/icons/refresh.png" width="36" height="36" alt="Reload page"

+                    title="Reload page" />

+            </a>

+            <a id="edit" href="#" target="_blank">

+                <img src="textures/icons/edit.png" width="36" height="36" alt="Edit in playground"

+                    title="Edit in playground" />

+            </a>

         </div>

         </div>

+    </div>

 

 

-        <script src="https://code.jquery.com/jquery.js"></script>

-        <script src="js/frame.js"></script>

+    <script src="https://code.jquery.com/jquery.js"></script>

+    <script src="js/frame.js"></script>

 

 

-        <!-- Global site tag (gtag.js) - Google Analytics -->

-        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

-        <script>

-            window.dataLayer = window.dataLayer || [];

-            function gtag() { dataLayer.push(arguments); }

-            gtag('js', new Date());

+    <!-- Global site tag (gtag.js) - Google Analytics -->

+    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

+    <script>

+        window.dataLayer = window.dataLayer || [];

+        function gtag() { dataLayer.push(arguments); }

+        gtag('js', new Date());

 

 

-            gtag('config', 'UA-41767310-2');

-        </script>

-    </body>

+        gtag('config', 'UA-41767310-2');

+    </script>

+</body>

 

 

-</html>

+</html>

+ 50 - 53
Playground/full.html
View File 

@@ -1,56 +1,53 @@
 
 <!DOCTYPE html>

 <!DOCTYPE html>

 <html>

 <html>

 

 

-    <head>

-        <title>Babylon.js Playground</title>

-        <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

-        <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

-        <meta name="msapplication-TileColor" content="#ffffff">

-        <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

-        <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

-        <meta name="theme-color" content="#ffffff">

-        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">

-

-        <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

-        <!-- Babylon.js -->

-        <script src="https://preview.babylonjs.com/ammo.js"></script>

-        <script src="https://preview.babylonjs.com/cannon.js"></script>

-        <script src="https://preview.babylonjs.com/Oimo.js"></script>

-        <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

-        <script src="https://preview.babylonjs.com/babylon.js"></script>

-        <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

-        <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

-

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

-

-        <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>

-

-

-

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

-        <link href="frame.css" rel="stylesheet" />

-    </head>

-

-    <body>

-        <!-- Override frame style -->

-        <canvas touch-action="none" id="renderCanvas" tabindex="1" style="height: 100%"></canvas>

-        <script src="https://code.jquery.com/jquery.js"></script>

-        <script src="js/frame.js"></script>

-

-        <!-- Global site tag (gtag.js) - Google Analytics -->

-        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

-        <script>

-            window.dataLayer = window.dataLayer || [];

-            function gtag() { dataLayer.push(arguments); }

-            gtag('js', new Date());

-

-            gtag('config', 'UA-41767310-2');

-        </script>

-    </body>

-

-</html>

+<head>

+    <title>Babylon.js Playground</title>

+    <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

+    <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

+    <meta name="msapplication-TileColor" content="#ffffff">

+    <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

+    <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

+    <meta name="theme-color" content="#ffffff">

+    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">

+

+    <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>

+    <!-- Babylon.js -->

+    <script src="https://preview.babylonjs.com/ammo.js"></script>

+    <script src="https://preview.babylonjs.com/cannon.js"></script>

+    <script src="https://preview.babylonjs.com/Oimo.js"></script>

+    <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

+    <script src="https://preview.babylonjs.com/babylon.js"></script>

+    <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

+    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>

+

+

+

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js"></script>

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"></script>

+    <link href="frame.css" rel="stylesheet" />

+</head>

+

+<body>

+    <!-- Override frame style -->

+    <canvas touch-action="none" id="renderCanvas" tabindex="1" style="height: 100%"></canvas>

+    <script src="https://code.jquery.com/jquery.js"></script>

+    <script src="js/frame.js"></script>

+

+    <!-- Global site tag (gtag.js) - Google Analytics -->

+    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

+    <script>

+        window.dataLayer = window.dataLayer || [];

+        function gtag() { dataLayer.push(arguments); }

+        gtag('js', new Date());

+

+        gtag('config', 'UA-41767310-2');

+    </script>

+</body>

+

+</html>

+ 9 - 0
Playground/index-local.html
View File 

@@ -97,6 +97,12 @@
 
                     <div class="option" id="minimapToggle1600">Minimap

                     <div class="option" id="minimapToggle1600">Minimap

                         <i class="far fa-square" aria-hidden="true"></i>

                         <i class="far fa-square" aria-hidden="true"></i>

                     </div>

                     </div>

+                    <div class="option subSelect" id="qrCodeHover" onmouseover="showQRCode();">QR Code Link

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" style="height:auto;padding: 20px;background: white;" id="qrCodeImage">QR Code Image</div>

+                        </div>

+                    </div>

                 </div>

                 </div>

             </div>

             </div>

 

 

@@ -443,6 +449,9 @@
 
     </div>

     </div>

 

 

     <script src="https://code.jquery.com/jquery.js"></script>

     <script src="https://code.jquery.com/jquery.js"></script>

+    <script src="js/jquery.qrcode.js"></script>

+    <script src="js/qrcode.js"></script>

+    

 

 

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

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

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

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

+ 10 - 0
Playground/index.html
View File 

@@ -27,6 +27,7 @@
 
     <script src="https://preview.babylonjs.com/babylon.js"></script>

     <script src="https://preview.babylonjs.com/babylon.js"></script>

     <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

     <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

     <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

     <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js"></script>

     <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

     <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

     <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

     <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

     <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

     <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

@@ -115,6 +116,13 @@
 
                     <div class="option" id="minimapToggle1600">Minimap

                     <div class="option" id="minimapToggle1600">Minimap

                         <i class="far fa-square" aria-hidden="true"></i>

                         <i class="far fa-square" aria-hidden="true"></i>

                     </div>

                     </div>

+                    <div class="option subSelect" id="qrCodeHover" onmouseover="showQRCode();">QR Code Link

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" style="height:auto;padding: 20px;background: white;" id="qrCodeImage">QR

+                                Code Image</div>

+                        </div>

+                    </div>

                 </div>

                 </div>

             </div>

             </div>

 

 

@@ -461,6 +469,8 @@
 
     </div>

     </div>

 

 

     <script src="js/libs/jquery.min.js"></script>

     <script src="js/libs/jquery.min.js"></script>

+    <script src="js/jquery.qrcode.js"></script>

+    <script src="js/qrcode.js"></script>

 

 

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

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

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

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

+ 8 - 0
Playground/indexStable.html
View File 

@@ -207,6 +207,12 @@
 
                             <div class="option" onclick="setVersion('stable');">Stable</div>

                             <div class="option" onclick="setVersion('stable');">Stable</div>

                         </div>

                         </div>

                     </div>

                     </div>

+                    <div class="option subSelect" id="qrCodeHover" onmouseover="showQRCode();">QR Code Link

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" style="height:auto;padding: 20px;background: white;" id="qrCodeImage">QR Code Image</div>

+                        </div>

+                    </div>

                 </div>

                 </div>

             </div>

             </div>

         </div>

         </div>

@@ -442,6 +448,8 @@
 
     </div>

     </div>

 

 

     <script src="https://code.jquery.com/jquery.js"></script>

     <script src="https://code.jquery.com/jquery.js"></script>

+    <script src="js/jquery.qrcode.js"></script>

+    <script src="js/qrcode.js"></script>

 

 

     <script>

     <script>

         Split(['#jsEditor', '#canvasZone']);

         Split(['#jsEditor', '#canvasZone']);

+ 7 - 0
Playground/js/index.js
View File 

@@ -848,6 +848,13 @@ function showError(errorMessage, errorEvent) {
 
             setToMultipleID("currentFontSize", "innerHTML", "Font: " + size);
 
             setToMultipleID("currentFontSize", "innerHTML", "Font: " + size);
 
         };
 
         };
 
 
 
+        showQRCode = function() {
 
+            $("#qrCodeImage").empty();
 
+            var playgroundCode = window.location.href.split("#");
 
+            playgroundCode.shift();
 
+            $("#qrCodeImage").qrcode({text: "https://playground.babylonjs.com/frame.html#"+(playgroundCode.join("#"))});
 
+        };
 
+
 
         // Fullscreen
 
         // Fullscreen
 
         document.getElementById("renderCanvas").addEventListener("webkitfullscreenchange", function() {
 
         document.getElementById("renderCanvas").addEventListener("webkitfullscreenchange", function() {
 
             if (document.webkitIsFullScreen) goFullPage();
 
             if (document.webkitIsFullScreen) goFullPage();

+ 89 - 0
Playground/js/jquery.qrcode.js
View File 

@@ -0,0 +1,89 @@
 
+(function( $ ){

+	$.fn.qrcode = function(options) {

+		// if options is string, 

+		if( typeof options === 'string' ){

+			options	= { text: options };

+		}

+

+		// set default values

+		// typeNumber < 1 for automatic calculation

+		options	= $.extend( {}, {

+			render		: "canvas",

+			width		: 256,

+			height		: 256,

+			typeNumber	: -1,

+			correctLevel	: QRErrorCorrectLevel.H,

+                        background      : "#ffffff",

+                        foreground      : "#000000"

+		}, options);

+

+		var createCanvas	= function(){

+			// create the qrcode itself

+			var qrcode	= new QRCode(options.typeNumber, options.correctLevel);

+			qrcode.addData(options.text);

+			qrcode.make();

+

+			// create canvas element

+			var canvas	= document.createElement('canvas');

+			canvas.width	= options.width;

+			canvas.height	= options.height;

+			var ctx		= canvas.getContext('2d');

+

+			// compute tileW/tileH based on options.width/options.height

+			var tileW	= options.width  / qrcode.getModuleCount();

+			var tileH	= options.height / qrcode.getModuleCount();

+

+			// draw in the canvas

+			for( var row = 0; row < qrcode.getModuleCount(); row++ ){

+				for( var col = 0; col < qrcode.getModuleCount(); col++ ){

+					ctx.fillStyle = qrcode.isDark(row, col) ? options.foreground : options.background;

+					var w = (Math.ceil((col+1)*tileW) - Math.floor(col*tileW));

+					var h = (Math.ceil((row+1)*tileW) - Math.floor(row*tileW));

+					ctx.fillRect(Math.round(col*tileW),Math.round(row*tileH), w, h);  

+				}	

+			}

+			// return just built canvas

+			return canvas;

+		}

+

+		// from Jon-Carlos Rivera (https://github.com/imbcmdth)

+		var createTable	= function(){

+			// create the qrcode itself

+			var qrcode	= new QRCode(options.typeNumber, options.correctLevel);

+			qrcode.addData(options.text);

+			qrcode.make();

+			

+			// create table element

+			var $table	= $('<table></table>')

+				.css("width", options.width+"px")

+				.css("height", options.height+"px")

+				.css("border", "0px")

+				.css("border-collapse", "collapse")

+				.css('background-color', options.background);

+		  

+			// compute tileS percentage

+			var tileW	= options.width / qrcode.getModuleCount();

+			var tileH	= options.height / qrcode.getModuleCount();

+

+			// draw in the table

+			for(var row = 0; row < qrcode.getModuleCount(); row++ ){

+				var $row = $('<tr></tr>').css('height', tileH+"px").appendTo($table);

+				

+				for(var col = 0; col < qrcode.getModuleCount(); col++ ){

+					$('<td></td>')

+						.css('width', tileW+"px")

+						.css('background-color', qrcode.isDark(row, col) ? options.foreground : options.background)

+						.appendTo($row);

+				}	

+			}

+			// return just built canvas

+			return $table;

+		}

+  

+

+		return this.each(function(){

+			var element	= options.render == "canvas" ? createCanvas() : createTable();

+			jQuery(element).appendTo(this);

+		});

+	};

+})( jQuery );

File diff suppressed because it is too large
+ 1237 - 0
Playground/js/qrcode.js


BIN
Playground/textures/sidexside.jpg
View File


BIN
Playground/textures/skyboxBlack_nx.jpg
View File


BIN
Playground/textures/skyboxBlack_ny.jpg
View File


BIN
Playground/textures/skyboxBlack_nz.jpg
View File


BIN
Playground/textures/skyboxBlack_px.jpg
View File


BIN
Playground/textures/skyboxBlack_py.jpg
View File


BIN
Playground/textures/skyboxBlack_pz.jpg
View File


BIN
Playground/textures/topbottom.jpg
View File


+ 402 - 397
Playground/ts.html
View File 

@@ -1,487 +1,492 @@
 
 <!DOCTYPE html>

 <!DOCTYPE html>

 <html>

 <html>

 

 

-    <head>

-        <title>Babylon.js Playground</title>

-        <meta charset='utf-8' />

-        <meta name="viewport" content="width=device-width, user-scalable=no">

-        <link rel="shortcut icon" href="https://www.babylonjs.com/img/favicon/favicon.ico">

-        <link rel="apple-touch-icon" sizes="57x57" href="https://www.babylonjs.com/img/favicon/apple-icon-57x57.png">

-        <link rel="apple-touch-icon" sizes="60x60" href="https://www.babylonjs.com/img/favicon/apple-icon-60x60.png">

-        <link rel="apple-touch-icon" sizes="72x72" href="https://www.babylonjs.com/img/favicon/apple-icon-72x72.png">

-        <link rel="apple-touch-icon" sizes="76x76" href="https://www.babylonjs.com/img/favicon/apple-icon-76x76.png">

-        <link rel="apple-touch-icon" sizes="114x114" href="https://www.babylonjs.com/img/favicon/apple-icon-114x114.png">

-        <link rel="apple-touch-icon" sizes="120x120" href="https://www.babylonjs.com/img/favicon/apple-icon-120x120.png">

-        <link rel="apple-touch-icon" sizes="144x144" href="https://www.babylonjs.com/img/favicon/apple-icon-144x144.png">

-        <link rel="apple-touch-icon" sizes="152x152" href="https://www.babylonjs.com/img/favicon/apple-icon-152x152.png">

-        <link rel="apple-touch-icon" sizes="180x180" href="https://www.babylonjs.com/img/favicon/apple-icon-180x180.png">

-        <link rel="icon" type="image/png" sizes="192x192" href="https://www.babylonjs.com/img/favicon/android-icon-192x192.png">

-        <link rel="icon" type="image/png" sizes="32x32" href="https://www.babylonjs.com/img/favicon/favicon-32x32.png">

-        <link rel="icon" type="image/png" sizes="96x96" href="https://www.babylonjs.com/img/favicon/favicon-96x96.png">

-        <link rel="icon" type="image/png" sizes="16x16" href="https://www.babylonjs.com/img/favicon/favicon-16x16.png">

-        <link rel="manifest" href="https://www.babylonjs.com/img/favicon/manifest.json">

-        <meta name="msapplication-TileColor" content="#ffffff">

-        <meta name="msapplication-TileImage" content="https://www.babylonjs.com/img/favicon/ms-icon-144x144.png">

-        <meta name="msapplication-config" content="https://www.babylonjs.com/img/favicon/browserconfig.xml">

-        <meta name="theme-color" content="#ffffff">

-

-        <script src="js/libs/pep.min.js"></script>

-        <!--For canvas/code separator-->

-        <script src="js/libs/split.js"></script>

-

-        <script src="js/libs/dat.gui.min.js"></script>

-        <!-- jszip -->

-        <script src="js/libs/jszip.min.js"></script>

-        <script src="js/libs/fileSaver.js"></script>

-        <!-- Dependencies -->

-        <script src="https://preview.babylonjs.com/ammo.js"></script>

-        <script src="https://preview.babylonjs.com/cannon.js"></script>

-        <script src="https://preview.babylonjs.com/Oimo.js"></script>

-        <script src="https://preview.babylonjs.com/earcut.min.js"></script>

-        <!-- Babylon.js -->

-        <script src="https://preview.babylonjs.com/babylon.js"></script>

-        <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

-        <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

-        <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

-        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

-        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

-        <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>

-        <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

-

-        <!-- Monaco -->

-        <script src="node_modules/monaco-editor/min/vs/loader.js"></script>

-

-        <!-- Extensions -->

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js" async></script>

-        <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js" async></script>

-

-        <!-- Scene Manager -->

-        <script src="https://mackeyk24.github.io/toolkit/babylon.manager.js"></script>

-        <script src="https://mackeyk24.github.io/toolkit/babylon.navmesh.js"></script>

-

-        <link href="css/index.css" rel="stylesheet" />

-        <link href="css/color_ts.css" rel="stylesheet" />

-    </head>

-

-    <body>

-        <div class="navbar navBar1600">

-            <div class="title">

-                Babylon.js Playground

-            </div>

-            <div class="version" id="mainTitle">

-            </div>

+<head>

+    <title>Babylon.js Playground</title>

+    <meta charset='utf-8' />

+    <meta name="viewport" content="width=device-width, user-scalable=no">

+    <link rel="shortcut icon" href="https://www.babylonjs.com/favicon.ico">

+

+    <link rel="stylesheet" href="https://use.typekit.net/cta4xsb.css">

+

+    <script src="js/libs/pep.min.js"></script>

+    <!--For canvas/code separator-->

+    <script src="js/libs/split.js"></script>

+

+    <script src="js/libs/dat.gui.min.js"></script>

+    <!-- jszip -->

+    <script src="js/libs/jszip.min.js"></script>

+    <script src="js/libs/fileSaver.js"></script>

+    <!-- Dependencies -->

+    <script src="https://preview.babylonjs.com/ammo.js"></script>

+    <script src="https://preview.babylonjs.com/cannon.js"></script>

+    <script src="https://preview.babylonjs.com/Oimo.js"></script>

+    <script src="https://preview.babylonjs.com/gltf_validator.js"></script>

+    <script src="https://preview.babylonjs.com/earcut.min.js"></script>

+    <!-- Babylon.js -->

+    <script src="https://preview.babylonjs.com/babylon.js"></script>

+    <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

+    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

+    <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>

+    <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

+    <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>

+    <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>

+    <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

+

+    <!-- Monaco -->

+    <script src="node_modules/monaco-editor/min/vs/loader.js"></script>

+

+    <!-- Extensions -->

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/ClonerSystem/src/babylonx.cloner.js" async></script>

+    <script src="https://rawgit.com/BabylonJS/Extensions/master/CompoundShader/src/babylonx.CompoundShader.js"

+        async></script>

+

+    <!-- Scene Manager -->

+    <script src="https://mackeyk24.github.io/toolkit/babylon.manager.js"></script>

+    <script src="https://mackeyk24.github.io/toolkit/babylon.navmesh.js"></script>

+

+    <link href="css/index.css" rel="stylesheet" />

+    <link href="css/color_ts.css" rel="stylesheet" />

+</head>

+

+<body>

+    <div class="navbar navBar1600">

+        <div class="title">

+            Babylon.js Playground

+        </div>

+        <div class="version" id="mainTitle">

+        </div>

 

 

-            <div class="category">

-                <div class="button run" id="runButton1600">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button run" id="runButton1600">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1600">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1600">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1600">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1600">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1600">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1600">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1600">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1600">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1600">Dark</div>

-                                <div class="option" id="lightTheme1600">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1600">Dark</div>

+                            <div class="option" id="lightTheme1600">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1600">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle1600">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1600">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1600">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="fullscreenButton1600">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1600">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1600">Format code</div>

-                        <div class="option" id="minimapToggle1600">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="safemodeToggle1600">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1600">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1600">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1600">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1600">Format code</div>

+                    <div class="option" id="minimapToggle1600">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect" id="qrCodeHover" onmouseover="showQRCode();">QR Code Link

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" style="height:auto;padding: 20px;background: white;" id="qrCodeImage">QR

+                                Code Image</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

-

-                <div class="button uncheck" id="debugButton1600">Inspector</div>

-                <div class="button" id="metadataButton1600">Metadata</div>

             </div>

             </div>

 

 

+            <div class="button uncheck" id="debugButton1600">Inspector</div>

+            <div class="button" id="metadataButton1600">Metadata</div>

+        </div>

 

 

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span id="currentVersion1600">Version: Latest</span>

-                    <div class="toDisplay">

-                        <div class="option" onclick="setVersion('latest');">Latest</div>

-                        <div class="option" onclick="setVersion('stable');">Stable</div>

-                    </div>

-                </div>

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

+

+        <div class="category right">

+            <div class="button select">

+                <span id="currentVersion1600">Version: Latest</span>

+                <div class="toDisplay">

+                    <div class="option" onclick="setVersion('latest');">Latest</div>

+                    <div class="option" onclick="setVersion('stable');">Stable</div>

                 </div>

                 </div>

             </div>

             </div>

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

+            </div>

         </div>

         </div>

+    </div>

 

 

-        <div class="navbar navBar1475">

-            <div class="title">

-                Babylon.js Playground

-            </div>

-            <div class="version" id="mainTitle">

-            </div>

+    <div class="navbar navBar1475">

+        <div class="title">

+            Babylon.js Playground

+        </div>

+        <div class="version" id="mainTitle">

+        </div>

 

 

-            <div class="category">

-                <div class="button run" id="runButton1475">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button run" id="runButton1475">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1475">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1475">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1475">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1475">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1475">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1475">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1475">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1475">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1475">Dark</div>

-                                <div class="option" id="lightTheme1475">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1475">Dark</div>

+                            <div class="option" id="lightTheme1475">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1475">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id='safemodeToggle1475'>Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1475">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="fullscreenButton1475">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1475">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1475">Format code</div>

-                        <div class="option" id="minimapToggle1475">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1475">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton1475">Inspector</div>

-                        <div class="option" id="metadataButton1475">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion1475">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('stable');">Stable</div>

-                            </div>

+                    </div>

+                    <div class="option" id='safemodeToggle1475'>Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1475">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1475">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1475">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1475">Format code</div>

+                    <div class="option" id="minimapToggle1475">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton1475">Inspector</div>

+                    <div class="option" id="metadataButton1475">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion1475">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('stable');">Stable</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

-                </div>

+        <div class="category right">

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

             </div>

             </div>

         </div>

         </div>

+    </div>

 

 

-        <div class="navbar navBar1030">

-            <div class="category">

-                <div class="button run" id="runButton1030">Run

-                    <i class="fa fa-play" aria-hidden="true"></i>

-                </div>

+    <div class="navbar navBar1030">

+        <div class="category">

+            <div class="button run" id="runButton1030">Run

+                <i class="fa fa-play" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

 

 

-            <div class="category">

-                <div class="button" id="newButton1030">New

-                    <i class="fa fa-file" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="clearButton1030">Clear

-                    <i class="fa fa-trash" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="newButton1030">New

+                <i class="fa fa-file" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="clearButton1030">Clear

+                <i class="fa fa-trash" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button" id="saveButton1030">Save

-                    <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                </div>

-                <div class="button removeOnPhone" id="zipButton1030">Zip

-                    <i class="fa fa-download" aria-hidden="true"></i>

-                </div>

+        <div class="category">

+            <div class="button" id="saveButton1030">Save

+                <i class="fa fa-floppy-o" aria-hidden="true"></i>

+            </div>

+            <div class="button removeOnPhone" id="zipButton1030">Zip

+                <i class="fa fa-download" aria-hidden="true"></i>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme1030">Dark</div>

-                                <div class="option" id="lightTheme1030">Light</div>

-                            </div>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme1030">Dark</div>

+                            <div class="option" id="lightTheme1030">Light</div>

                         </div>

                         </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize1030">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle1030">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option checked" id="editorButton1030">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="fullscreenButton1030">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton1030">Editor Fullscreen</div>

-                        <div class="option" id="formatButton1030">Format code</div>

-                        <div class="option" id="minimapToggle1030">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize1030">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton1030">Inspector</div>

-                        <div class="option" id="metadataButton1030">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion1030">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('stable');">Stable</div>

-                            </div>

+                    </div>

+                    <div class="option" id="safemodeToggle1030">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option checked" id="editorButton1030">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton1030">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton1030">Editor Fullscreen</div>

+                    <div class="option" id="formatButton1030">Format code</div>

+                    <div class="option" id="minimapToggle1030">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton1030">Inspector</div>

+                    <div class="option" id="metadataButton1030">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion1030">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('stable');">Stable</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category right">

-                <div class="button select">

-                    <span class="examplesButton">Examples</span>

-                </div>

+        <div class="category right">

+            <div class="button select">

+                <span class="examplesButton">Examples</span>

             </div>

             </div>

         </div>

         </div>

-

-        <div class="navbar navBar750">

-            <div class="category">

-                <div class="button select">File

-                    <div class="toDisplay">

-                        <div class="option" id="runButton750">Run

-                            <i class="fa fa-play" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="newButton750">New

-                            <i class="fa fa-file" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="clearButton750">Clear

-                            <i class="fa fa-trash" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="saveButton750">Save

-                            <i class="fa fa-floppy-o" aria-hidden="true"></i>

-                        </div>

-                        <div class="option" id="zipButton750">Zip

-                            <i class="fa fa-download" aria-hidden="true"></i>

-                        </div>

+    </div>

+

+    <div class="navbar navBar750">

+        <div class="category">

+            <div class="button select">File

+                <div class="toDisplay">

+                    <div class="option" id="runButton750">Run

+                        <i class="fa fa-play" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="newButton750">New

+                        <i class="fa fa-file" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="clearButton750">Clear

+                        <i class="fa fa-trash" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="saveButton750">Save

+                        <i class="fa fa-floppy-o" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="zipButton750">Zip

+                        <i class="fa fa-download" aria-hidden="true"></i>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

+        </div>

 

 

-            <div class="category">

-                <div class="button select">Settings

-                    <div class="toDisplay">

-                        <div class="option subSelect">Theme

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" id="darkTheme750">Dark</div>

-                                <div class="option" id="lightTheme750">Light</div>

-                            </div>

-                        </div>

-                        <div class="option subSelect">

-                            <span id="currentFontSize750">Font: 14</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setFontSize(12);">12</div>

-                                <div class="option" onclick="setFontSize(14);">14</div>

-                                <div class="option" onclick="setFontSize(16);">16</div>

-                                <div class="option" onclick="setFontSize(18);">18</div>

-                                <div class="option" onclick="setFontSize(20);">20</div>

-                                <div class="option" onclick="setFontSize(22);">22</div>

-                            </div>

-                        </div>

-                        <div class="option" id="safemodeToggle750">Safe mode

-                            <i class="far fa-square" aria-hidden="true"></i>

-                        </div>

-                        <div style="display:none;" class="option checked" id="editorButton750">Editor

-                            <i class="fa fa-check-square" aria-hidden="true"></i>

+        <div class="category">

+            <div class="button select">Settings

+                <div class="toDisplay">

+                    <div class="option subSelect">Theme

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" id="darkTheme750">Dark</div>

+                            <div class="option" id="lightTheme750">Light</div>

                         </div>

                         </div>

-                        <div class="option" id="fullscreenButton750">Fullscreen</div>

-                        <div class="option" id="editorFullscreenButton750">Editor Fullscreen</div>

-                        <div class="option" id="formatButton750">Format code</div>

-                        <div class="option" id="minimapToggle750">Minimap

-                            <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option subSelect">

+                        <span id="currentFontSize750">Font: 14</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setFontSize(12);">12</div>

+                            <div class="option" onclick="setFontSize(14);">14</div>

+                            <div class="option" onclick="setFontSize(16);">16</div>

+                            <div class="option" onclick="setFontSize(18);">18</div>

+                            <div class="option" onclick="setFontSize(20);">20</div>

+                            <div class="option" onclick="setFontSize(22);">22</div>

                         </div>

                         </div>

-                        <div class="option" id="debugButton750">Inspector</div>

-                        <div class="option" id="metadataButton750">Metadata</div>

-                        <div class="option subSelect">

-                            <span id="currentVersion750">Vers. : Latest</span>

-                            <i class="fa fa-chevron-right" aria-hidden="true"></i>

-                            <div class="toDisplaySub">

-                                <div class="option" onclick="setVersion('latest');">Latest</div>

-                                <div class="option" onclick="setVersion('stable');">Stable</div>

-                            </div>

+                    </div>

+                    <div class="option" id="safemodeToggle750">Safe mode

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div style="display:none;" class="option checked" id="editorButton750">Editor

+                        <i class="fa fa-check-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="fullscreenButton750">Fullscreen</div>

+                    <div class="option" id="editorFullscreenButton750">Editor Fullscreen</div>

+                    <div class="option" id="formatButton750">Format code</div>

+                    <div class="option" id="minimapToggle750">Minimap

+                        <i class="far fa-square" aria-hidden="true"></i>

+                    </div>

+                    <div class="option" id="debugButton750">Inspector</div>

+                    <div class="option" id="metadataButton750">Metadata</div>

+                    <div class="option subSelect">

+                        <span id="currentVersion750">Vers. : Latest</span>

+                        <i class="fa fa-chevron-right" aria-hidden="true"></i>

+                        <div class="toDisplaySub">

+                            <div class="option" onclick="setVersion('latest');">Latest</div>

+                            <div class="option" onclick="setVersion('stable');">Stable</div>

                         </div>

                         </div>

                     </div>

                     </div>

                 </div>

                 </div>

             </div>

             </div>

         </div>

         </div>

 

 

-        <div class="wrapper">

-            <div id="jsEditor"></div>

-            <div id="canvasZone">

-                <canvas touch-action="none" id="renderCanvas"></canvas>

-            </div>

-        </div>

-        <div id="exampleList" class = "typescript">

-            <div id="exampleBanner">

-                <h1>Examples</h1>

+        <div class="category right">

+            <div class="button select">

+                <span id="currentScript750">Examples</span>

             </div>

             </div>

-            <div class="horizontalSeparator"></div>

-            <input id="filterBar" type="text" placeholder="Filter examples...">

-            <img id="filterBarClear" src="https://d33wubrfki0l68.cloudfront.net/17ca450bae302631f4857cd8c3992234ec5dd9a7/057f9/img/ui/clear_button.png">

         </div>

         </div>

+    </div>

 

 

-        <span class="label" id="fpsLabel">FPS</span>

-

-        <div id="errorZone">

+    <div class="wrapper">

+        <div id="jsEditor"></div>

+        <div id="canvasZone">

+            <canvas touch-action="none" id="renderCanvas"></canvas>

         </div>

         </div>

-

-        <div class="navbarBottom">

-            <div id="statusBar"></div>

-            <div class="links">

-                <div class='link'>

-                    <a target='_new' href="https://www.netlify.com/">Deployed by Netlify</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://forum.babylonjs.com/">Forum</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://www.babylonjs.com/sandbox">Sandbox</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://doc.babylonjs.com">Documentation</a>

-                </div>

-                <div class='link'>

-                    <a target='_new' href="https://doc.babylonjs.com/playground">Search</a>

-                </div>

+    </div>

+    <div id="exampleList" class="typescript">

+        <div id="exampleBanner">

+            <h1>Examples</h1>

+        </div>

+        <div class="horizontalSeparator"></div>

+        <input id="filterBar" type="text" placeholder="Filter examples...">

+        <img id="filterBarClear"

+            src="https://d33wubrfki0l68.cloudfront.net/17ca450bae302631f4857cd8c3992234ec5dd9a7/057f9/img/ui/clear_button.png">

+    </div>

+

+    <span class="label" id="fpsLabel">FPS</span>

+

+    <div id="errorZone">

+    </div>

+

+    <div class="navbarBottom">

+        <div id="statusBar"></div>

+        <div class="links">

+            <div class='link'>

+                <a target='_new' href="https://www.netlify.com/">Deployed by Netlify</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://forum.babylonjs.com/">Forum</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://www.babylonjs.com/sandbox">Sandbox</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://doc.babylonjs.com">Documentation</a>

+            </div>

+            <div class='link'>

+                <a target='_new' href="https://doc.babylonjs.com/playground">Search</a>

             </div>

             </div>

         </div>

         </div>

+    </div>

 

 

-        <div id="saveLayer" class="save-layer">

-            <div class="save-form">

-                <label for="saveFormTitle">TITLE</label>

-                <div class="separator"></div>

-                <input type="text" maxlength="120" id="saveFormTitle" class="save-form-title">

+    <div id="saveLayer" class="save-layer">

+        <div class="save-form">

+            <label for="saveFormTitle">TITLE</label>

+            <div class="separator"></div>

+            <input type="text" maxlength="120" id="saveFormTitle" class="save-form-title">

 

 

-                <label for="saveFormDescription">DESCRIPTION</label>

-                <div class="separator"></div>

-                <textarea id="saveFormDescription" rows="4" cols="10"></textarea>

+            <label for="saveFormDescription">DESCRIPTION</label>

+            <div class="separator"></div>

+            <textarea id="saveFormDescription" rows="4" cols="10"></textarea>

 

 

-                <label for="saveFormTags">TAGS (separated by comma)</label>

-                <div class="separator"></div>

-                <textarea id="saveFormTags" rows="4" cols="10"></textarea>

+            <label for="saveFormTags">TAGS (separated by comma)</label>

+            <div class="separator"></div>

+            <textarea id="saveFormTags" rows="4" cols="10"></textarea>

 

 

-                <div class="save-form-buttons" id="saveFormButtons">

+            <div class="save-form-buttons" id="saveFormButtons">

 

 

-                    <div id="saveFormButtonOk" class="button">OK</div>

-                    <div id="saveFormButtonCancel" class="button">Cancel</div>

-                </div>

+                <div id="saveFormButtonOk" class="button">OK</div>

+                <div id="saveFormButtonCancel" class="button">Cancel</div>

             </div>

             </div>

         </div>

         </div>

-

-        <div id="waitDiv">

-            <span id="waitTitle">Babylon.js Playground

-                <BR>

-                <BR>

-                <BR>

-            </span>

-            <img src="waitlogo.png" id="waitLogo" />

+    </div>

+

+    <div id="waitDiv">

+        <span id="waitTitle">Babylon.js Playground

+            <BR>

+            <BR>

+            <BR>

+        </span>

+        <div id="logo-part">

+            <img src="v4.svg" id="waitLogo" />

+            <img src="spinner.svg" id="waitSpinner" />

         </div>

         </div>

+    </div>

+

+    <script src="js/libs/jquery.min.js"></script>

+    <script src="js/jquery.qrcode.js"></script>

+    <script src="js/qrcode.js"></script>

+

+    <script src="js/actions.js"></script>

+    <script src="js/pbt.js"></script>

+    <script src="js/libs/typescript.js"></script>

+    <script src="js/index.js"></script>

+    <script src="js/ts.js"></script>

 

 

-        <script src="js/libs/jquery.min.js"></script>

-

-        <script src="js/actions.js"></script>

-        <script src="js/pbt.js"></script>

-        <script src="js/libs/typescript.js"></script>

-        <script src="js/index.js"></script>

-        <script src="js/ts.js"></script>

-        

-        <!-- Global site tag (gtag.js) - Google Analytics -->

-        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

-        <script>

+    <!-- Global site tag (gtag.js) - Google Analytics -->

+    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-41767310-2"></script>

+    <script>

         window.dataLayer = window.dataLayer || [];

         window.dataLayer = window.dataLayer || [];

-        function gtag(){dataLayer.push(arguments);}

+        function gtag() { dataLayer.push(arguments); }

         gtag('js', new Date());

         gtag('js', new Date());

 

 

         gtag('config', 'UA-41767310-2');

         gtag('config', 'UA-41767310-2');

-        </script>        

-    </body>

+    </script>

+</body>

 

 

-</html>

+</html>

+ 61 - 5
Tools/Config/config.json
View File 

@@ -13,6 +13,7 @@
 
         "packageES6DevFolderName": "packageES6Dev",
 
         "packageES6DevFolderName": "packageES6Dev",
 
         "playgroundDirectory": "../../Playground/",
 
         "playgroundDirectory": "../../Playground/",
 
         "intellisenseFile": "babylon.d.txt",
 
         "intellisenseFile": "babylon.d.txt",
 
+        "documentationFile": "documentation.d.ts",
 
         "intellisenseSources": [
 
         "intellisenseSources": [
 
             "../../dist/preview release/babylon.d.ts",
 
             "../../dist/preview release/babylon.d.ts",
 
             "../../dist/preview release/gui/babylon.gui.d.ts",
 
             "../../dist/preview release/gui/babylon.gui.d.ts",
 
@@ -45,7 +46,8 @@
 
         "loaders",
 
         "loaders",
 
         "serializers",
 
         "serializers",
 
         "gui",
 
         "gui",
 
-        "inspector"
 
+        "inspector",
 
+        "nodeEditor"
 
     ],
 
     ],
 
     "es6modules": [
 
     "es6modules": [
 
         "core",
 
         "core",
 
@@ -56,7 +58,8 @@
 
         "serializers",
 
         "serializers",
 
         "gui",
 
         "gui",
 
         "inspector",
 
         "inspector",
 
-        "viewer"
 
+        "viewer",
 
+        "nodeEditor"
 
     ],
 
     ],
 
     "lintModules": [
 
     "lintModules": [
 
         "core",
 
         "core",
 
@@ -68,8 +71,8 @@
 
         "gui"
 
         "gui"
 
     ],
 
     ],
 
     "viewerModules": [
 
     "viewerModules": [
 
-        "viewer",
 
-        "viewer-assets"
 
+        "viewer-assets",
 
+        "viewer"
 
     ],
 
     ],
 
     "additionalNpmPackages": [
 
     "additionalNpmPackages": [
 
         {
 
         {
 
@@ -117,7 +120,9 @@
 
                             "namespace": "BABYLON.Debug"
 
                             "namespace": "BABYLON.Debug"
 
                         }
 
                         }
 
                     ],
 
                     ],
 
-                    "hiddenConsts": ["Debug"]
 
+                    "hiddenConsts": [
 
+                        "Debug"
 
+                    ]
 
                 },
 
                 },
 
                 "requiredFiles": [
 
                 "requiredFiles": [
 
                     "readme.md"
 
                     "readme.md"
 
@@ -578,6 +583,57 @@
 
             }
 
             }
 
         }
 
         }
 
     },
 
     },
 
+    "nodeEditor": {
 
+        "libraries": [
 
+            {
 
+                "output": "babylon.nodeEditor.js",
 
+                "entry": "./legacy/legacy.ts"
 
+            }
 
+        ],
 
+        "build": {
 
+            "ignoreInTestMode": true,
 
+            "mainFolder": "./nodeEditor/",
 
+            "uncheckedLintImports": [
 
+                "react",
 
+                "react-dom",
 
+                "re-resizable",
 
+                "glTF"
 
+            ],
 
+            "umd": {
 
+                "packageName": "babylonjs-node-editor",
 
+                "webpackRoot": "NODEEDITOR",
 
+                "processDeclaration": {
 
+                    "filename": "babylon.nodeEditor.module.d.ts",
 
+                    "moduleName": "NODEEDITOR",
 
+                    "importsToRemove": [],
 
+                    "classMap": {
 
+                        "babylonjs": "BABYLON",
 
+                        "react": "React",
 
+                        "@babylonjs/core": "BABYLON",
 
+                        "@fortawesome": false,
 
+                        "react-contextmenu": false
 
+                    }
 
+                }
 
+            },
 
+            "es6": {
 
+                "webpackBuild": true,
 
+                "buildDependencies": [
 
+                    "node_modules/re-resizable/lib/index.es5.js",
 
+                    "Tools/**/*"
 
+                ],
 
+                "packageName": "@babylonjs/node-editor",
 
+                "readme": "dist/preview release/nodeEditor/readme-es6.md",
 
+                "packagesFiles": [
 
+                    "babylon.nodeEditor.max.js",
 
+                    "babylon.nodeEditor.max.js.map",
 
+                    "babylon.nodeEditor.module.d.ts",
 
+                    "readme.md"
 
+                ],
 
+                "typings": "babylon.nodeEditor.module.d.ts",
 
+                "index": "babylon.nodeEditor.max.js"
 
+            }
 
+        }
 
+    },
 
     "viewer": {
 
     "viewer": {
 
         "libraries": [
 
         "libraries": [
 
             {
 
             {

+ 1 - 1
Tools/Gulp/gulpfile.js
View File 

@@ -90,4 +90,4 @@ gulp.task("npmPackages", gulp.series("npmPackages-all"));
 
 /**
 
 /**
 
  * The default task, concat and min the main BJS files.
 
  * The default task, concat and min the main BJS files.
 
  */
 
  */
 
-gulp.task("default", gulp.series("cleanup", "tsLint", "importLint", "circularDependencies", "typescript-all", "intellisense", "typedoc-all", "tests-all"));
 
+gulp.task("default", gulp.series("cleanup", "tsLint", "importLint", "circularDependencies", "typescript-all", "intellisense", "documentation", "typedoc-all", "tests-all"));

+ 1 - 1
Tools/Gulp/package.json
View File 

@@ -13,4 +13,4 @@
 
         "build": "gulp --max-old-space-size=8192 --tsLintFix",
 
         "build": "gulp --max-old-space-size=8192 --tsLintFix",
 
         "start": "gulp run --max-old-space-size=8192"
 
         "start": "gulp run --max-old-space-size=8192"
 
     }
 
     }
 
-}
 
+}

+ 6 - 0
Tools/Gulp/tasks/gulpTasks-intellisense.js
View File 

@@ -18,4 +18,10 @@ gulp.task("intellisense", function() {
 
         .pipe(replace(/^\s* _/gm, "private _"))

         .pipe(replace(/^\s* _/gm, "private _"))

         .pipe(replace(/^\s*_/gm, "private _"))

         .pipe(replace(/^\s*_/gm, "private _"))

         .pipe(gulp.dest(config.build.playgroundDirectory));

         .pipe(gulp.dest(config.build.playgroundDirectory));

+});

+

+gulp.task("documentation", function() {

+    return gulp.src(config.build.intellisenseSources)

+        .pipe(concat(config.build.documentationFile))

+        .pipe(gulp.dest(config.build.outputDirectory));

 });
 
 });

+ 5 - 0
Tools/Publisher/tasks/prepareEs6DevPackages.js
View File 

@@ -13,6 +13,11 @@ const config = require("../../Config/config.js");
 
  */

  */

 function prepareEs6DevPackages() {

 function prepareEs6DevPackages() {

     config.es6modules.forEach(moduleName => {

     config.es6modules.forEach(moduleName => {

+        if (moduleName === "viewer") {

+            // Do not publish locally as an es6 npm linked module

+            return;

+        }

+

         const module = config[moduleName];

         const module = config[moduleName];

 

 

         colorConsole.log("Prepare " + "ES6Dev".magenta + " Package: " + moduleName.blue.bold);

         colorConsole.log("Prepare " + "ES6Dev".magenta + " Package: " + moduleName.blue.bold);

+ 16 - 16
azure-pipelines.yml
View File 

@@ -19,7 +19,7 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp tests-whatsnew'
 
+  - script: 'gulp tests-whatsnew --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Whats new'
 
     displayName: 'Whats new'
 
     env:
 
     env:
 
@@ -37,7 +37,7 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typedoc-check'
 
+  - script: 'gulp typedoc-check --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typedoc check'
 
     displayName: 'Typedoc check'
 
 
 
@@ -52,7 +52,7 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp fullLint'
 
+  - script: 'gulp fullLint --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Full Lint'
 
     displayName: 'Full Lint'
 
 
 
@@ -67,10 +67,10 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typescript-all'
 
+  - script: 'gulp typescript-all --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typescript all'
 
     displayName: 'Typescript all'
 
-  - script: 'gulp tests-babylon-unit'
 
+  - script: 'gulp tests-babylon-unit --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Unit Tests'
 
     displayName: 'Unit Tests'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
@@ -90,14 +90,14 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typescript-all'
 
+  - script: 'gulp typescript-all --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typescript all'
 
     displayName: 'Typescript all'
 
   - script: |
 
   - script: |
 
       export DISPLAY=:99
 
       export DISPLAY=:99
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       sleep 3 # give xvfb some time to start
 
       sleep 3 # give xvfb some time to start
 
-      gulp tests-validation-virtualscreenWebGL1
 
+      gulp tests-validation-virtualscreenWebGL1 --max-old-space-size=8192
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Visual Tests'
 
     displayName: 'Visual Tests'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
@@ -117,14 +117,14 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typescript-all'
 
+  - script: 'gulp typescript-all --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typescript all'
 
     displayName: 'Typescript all'
 
   - script: |
 
   - script: |
 
       export DISPLAY=:99
 
       export DISPLAY=:99
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       sleep 3 # give xvfb some time to start
 
       sleep 3 # give xvfb some time to start
 
-      gulp tests-validation-virtualscreen
 
+      gulp tests-validation-virtualscreen --max-old-space-size=8192
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Visual Tests'
 
     displayName: 'Visual Tests'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
@@ -151,16 +151,16 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typescript-all'
 
+  - script: 'gulp typescript-all --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typescript all'
 
     displayName: 'Typescript all'
 
   - script: 'gulp tests-modules'
 
   - script: 'gulp tests-modules'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Tests modules'
 
     displayName: 'Tests modules'
 
-  - script: 'sudo gulp localdev-es6'
 
+  - script: 'sudo gulp localdev-es6 --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Npm link ES6'
 
     displayName: 'Npm link ES6'
 
-  - script: 'gulp tests-es6Modules'
 
+  - script: 'gulp tests-es6Modules --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Tests ES6'
 
     displayName: 'Tests ES6'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
@@ -185,10 +185,10 @@ jobs:
 
     inputs:
 
     inputs:
 
       workingDir: Tools/Gulp
 
       workingDir: Tools/Gulp
 
       verbose: false
 
       verbose: false
 
-  - script: 'gulp typescript-all'
 
+  - script: 'gulp typescript-all --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Typescript all'
 
     displayName: 'Typescript all'
 
-  - script: 'gulp tests-viewer-unit'
 
+  - script: 'gulp tests-viewer-unit --max-old-space-size=8192'
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Unit Tests'
 
     displayName: 'Unit Tests'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
@@ -200,11 +200,11 @@ jobs:
 
       export DISPLAY=:99
 
       export DISPLAY=:99
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
 
       sleep 3 # give xvfb some time to start
 
       sleep 3 # give xvfb some time to start
 
-      gulp tests-viewer-validation-virtualscreen
 
+      gulp tests-viewer-validation-virtualscreen --max-old-space-size=8192
 
     workingDirectory: Tools/Gulp
 
     workingDirectory: Tools/Gulp
 
     displayName: 'Visual Tests'
 
     displayName: 'Visual Tests'
 
   - task: PublishTestResults@2
 
   - task: PublishTestResults@2
 
     condition: succeededOrFailed()
 
     condition: succeededOrFailed()
 
     inputs:
 
     inputs:
 
       testRunner: JUnit
 
       testRunner: JUnit
 
-      testResultsFiles: '.temp/testResults/ViewerValidationTests.xml'
 
+      testResultsFiles: '.temp/testResults/ViewerValidationTests.xml'

+ 37 - 38
bower.json
View File 

@@ -1,39 +1,38 @@
 
 {
 
 {
 
-  "name": "babylonjs",
 
-  "description": "Babylon.js is a complete JavaScript framework for building 3D games with HTML 5 and WebGL",
 
-  "main": "./dist/babylon.2.5.js",
 
-  "homepage": "https://www.babylonjs.com",
 
-  "repository": {
 
-    "type": "git",
 
-    "url": "git://github.com/BabylonJS/Babylon.js.git"
 
-  },
 
-  "authors": [
 
-    "David Catuhe",
 
-    "David Rousset"
 
-  ],
 
-  "keywords": [
 
-    "3D",
 
-    "WebGL",
 
-    "WebAudio",
 
-    "Shaders",
 
-    "Realtime"
 
-  ],
 
-  "license": "Apache-2.0",
 
-  "ignore": [
 
-    "**/.*",
 
-    "node_modules",
 
-    "Babylon",
 
-    "Exporters",
 
-    "Loaders",
 
-    "Previous releases",
 
-    "/Tools",
 
-    "gulpfile.js",
 
-    "package.json",
 
-    "babylon.2.1*.*",
 
-    "*.md",
 
-    "*.yml",
 
-    "cannon.js",
 
-    "Oimo.js",
 
-    "poly2tri.js"
 
-  ]
 
-}
 
+    "name": "babylonjs",
 
+    "description": "Babylon.js is a complete JavaScript framework for building 3D games with HTML 5 and WebGL",
 
+    "main": "./dist/babylon.js",
 
+    "homepage": "https://www.babylonjs.com",
 
+    "repository": {
 
+        "type": "git",
 
+        "url": "git://github.com/BabylonJS/Babylon.js.git"
 
+    },
 
+    "authors": [
 
+        "David Catuhe"
 
+    ],
 
+    "keywords": [
 
+        "3D",
 
+        "WebGL",
 
+        "WebAudio",
 
+        "Shaders",
 
+        "Realtime"
 
+    ],
 
+    "license": "Apache-2.0",
 
+    "ignore": [
 
+        "**/.*",
 
+        "node_modules",
 
+        "Babylon",
 
+        "Exporters",
 
+        "Loaders",
 
+        "Previous releases",
 
+        "/Tools",
 
+        "gulpfile.js",
 
+        "package.json",
 
+        "babylon.2.1*.*",
 
+        "*.md",
 
+        "*.yml",
 
+        "cannon.js",
 
+        "Oimo.js",
 
+        "poly2tri.js"
 
+    ]
 
+}

File diff suppressed because it is too large
+ 40 - 665
dist/ammo.js


+ 2 - 0
dist/babylon.d.ts
View File 

@@ -31951,6 +31951,8 @@ declare module BABYLON {
 
          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          */

          */

         useClonedMeshhMap?: boolean;

         useClonedMeshhMap?: boolean;

+        /** Defines if the creation of the scene should impact the engine (Eg. UtilityLayer's scene) */

+        virtual?: boolean;

     }

     }

     /**

     /**

      * Represents a scene to be rendered by the engine.

      * Represents a scene to be rendered by the engine.

File diff suppressed because it is too large
+ 1 - 1
dist/babylon.js


File diff suppressed because it is too large
+ 61 - 52
dist/babylon.max.js


File diff suppressed because it is too large
+ 1 - 1
dist/babylon.max.js.map


+ 4 - 0
dist/babylon.module.d.ts
View File 

@@ -32822,6 +32822,8 @@ declare module "babylonjs/scene" {
 
          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          */

          */

         useClonedMeshhMap?: boolean;

         useClonedMeshhMap?: boolean;

+        /** Defines if the creation of the scene should impact the engine (Eg. UtilityLayer's scene) */

+        virtual?: boolean;

     }

     }

     /**

     /**

      * Represents a scene to be rendered by the engine.

      * Represents a scene to be rendered by the engine.

@@ -92052,6 +92054,8 @@ declare module BABYLON {
 
          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          * It will improve performance when the number of mesh becomes important, but might consume a bit more memory

          */

          */

         useClonedMeshhMap?: boolean;

         useClonedMeshhMap?: boolean;

+        /** Defines if the creation of the scene should impact the engine (Eg. UtilityLayer's scene) */

+        virtual?: boolean;

     }

     }

     /**

     /**

      * Represents a scene to be rendered by the engine.

      * Represents a scene to be rendered by the engine.

+ 5 - 52
dist/gltf2Interface/babylon.glTF2Interface.d.ts
View File 

@@ -856,7 +856,7 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * Interface for glTF validation results

+     * The glTF validation results

      */

      */

     interface IGLTFValidationResults {

     interface IGLTFValidationResults {

         info: {

         info: {

@@ -885,7 +885,7 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * Interface for glTF validation options

+     * The glTF validation options

      */

      */

     interface IGLTFValidationOptions {

     interface IGLTFValidationOptions {

         uri?: string;

         uri?: string;

@@ -897,57 +897,10 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * glTF validator object Tyyings

+     * The glTF validator object

      */

      */

-    interface IGLTFValidatorTypings {

+    interface IGLTFValidator {

+        validateBytes: (data: Uint8Array, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

         validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

         validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

     }

     }

 }

 }

-

-/**

- * Interface for glTF validation results

- */

-interface IGLTFValidationResults {

-    info: {

-        generator: string;

-        hasAnimations: boolean;

-        hasDefaultScene: boolean;

-        hasMaterials: boolean;

-        hasMorphTargets: boolean;

-        hasSkins: boolean;

-        hasTextures: boolean;

-        maxAttributesUsed: number;

-        primitivesCount: number

-    };

-    issues: {

-        messages: Array<string>;

-        numErrors: number;

-        numHints: number;

-        numInfos: number;

-        numWarnings: number;

-        truncated: boolean

-    };

-    mimeType: string;

-    uri: string;

-    validatedAt: string;

-    validatorVersion: string;

-}

-

-/**

- * Interface for glTF validation options

- */

-interface IGLTFValidationOptions {

-    uri?: string;

-    externalResourceFunction?: (uri: string) => Promise<Uint8Array>;

-    validateAccessorData?: boolean;

-    maxIssues?: number;

-    ignoredIssues?: Array<string>;

-    severityOverrides?: Object;

-}

-

-/**

- * glTF validator object Tyyings

- */

-interface IGLTFValidatorTypings {

-    validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

-}

+ 1 - 1
dist/gltf2Interface/package.json
View File 

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

File diff suppressed because it is too large
+ 4458 - 4573
dist/gltf_validator.js


+ 2 - 2
dist/gui/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-gui",
 
     "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.",
 
     "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.0.2",
 
+    "version": "4.0.3",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -28,7 +28,7 @@
 
     ],
 
     ],
 
     "license": "Apache-2.0",
 
     "license": "Apache-2.0",
 
     "dependencies": {
 
     "dependencies": {
 
-        "babylonjs": "4.0.2"
 
+        "babylonjs": "4.0.3"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

+ 6 - 6
dist/inspector/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-inspector",
 
     "name": "babylonjs-inspector",
 
     "description": "The Babylon.js inspector.",
 
     "description": "The Babylon.js inspector.",
 
-    "version": "4.0.2",
 
+    "version": "4.0.3",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -31,11 +31,11 @@
 
     "dependencies": {
 
     "dependencies": {
 
         "@types/react": "~16.7.3",
 
         "@types/react": "~16.7.3",
 
         "@types/react-dom": "~16.0.9",
 
         "@types/react-dom": "~16.0.9",
 
-        "babylonjs": "4.0.2",
 
-        "babylonjs-gui": "4.0.2",
 
-        "babylonjs-loaders": "4.0.2",
 
-        "babylonjs-serializers": "4.0.2",
 
-        "babylonjs-gltf2interface": "4.0.2"
 
+        "babylonjs": "4.0.3",
 
+        "babylonjs-gui": "4.0.3",
 
+        "babylonjs-loaders": "4.0.3",
 
+        "babylonjs-serializers": "4.0.3",
 
+        "babylonjs-gltf2interface": "4.0.3"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

+ 7 - 4
dist/loaders/babylon.glTF1FileLoader.js
View File 

@@ -3169,8 +3169,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -3184,7 +3184,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -3200,7 +3200,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylon.glTF1FileLoader.js.map


File diff suppressed because it is too large
+ 2 - 2
dist/loaders/babylon.glTF1FileLoader.min.js


+ 7 - 4
dist/loaders/babylon.glTF2FileLoader.js
View File 

@@ -3869,8 +3869,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -3884,7 +3884,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -3900,7 +3900,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylon.glTF2FileLoader.js.map


File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylon.glTF2FileLoader.min.js


+ 7 - 4
dist/loaders/babylon.glTFFileLoader.js
View File 

@@ -6418,8 +6418,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -6433,7 +6433,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -6449,7 +6449,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylon.glTFFileLoader.js.map


File diff suppressed because it is too large
+ 2 - 2
dist/loaders/babylon.glTFFileLoader.min.js


+ 2 - 2
dist/loaders/babylonjs.loaders.d.ts
View File 

@@ -235,12 +235,12 @@ declare module BABYLON {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<BABYLON.GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: BABYLON.GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

+ 7 - 4
dist/loaders/babylonjs.loaders.js
View File 

@@ -7760,8 +7760,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -7775,7 +7775,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -7791,7 +7791,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylonjs.loaders.js.map


File diff suppressed because it is too large
+ 1 - 1
dist/loaders/babylonjs.loaders.min.js


+ 28 - 28
dist/loaders/babylonjs.loaders.module.d.ts
View File 

@@ -1,5 +1,4 @@
 
 declare module "babylonjs-loaders/glTF/glTFFileLoader" {

 declare module "babylonjs-loaders/glTF/glTFFileLoader" {

-    import { IGLTFValidationResults } from "babylonjs-gltf2interface";

     import { Nullable } from "babylonjs/types";

     import { Nullable } from "babylonjs/types";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

     import { Camera } from "babylonjs/Cameras/camera";

     import { Camera } from "babylonjs/Cameras/camera";

@@ -12,6 +11,7 @@ declare module "babylonjs-loaders/glTF/glTFFileLoader" {
 
     import { ISceneLoaderPluginFactory, ISceneLoaderPlugin, ISceneLoaderPluginAsync, SceneLoaderProgressEvent, ISceneLoaderPluginExtensions } from "babylonjs/Loading/sceneLoader";

     import { ISceneLoaderPluginFactory, ISceneLoaderPlugin, ISceneLoaderPluginAsync, SceneLoaderProgressEvent, ISceneLoaderPluginExtensions } from "babylonjs/Loading/sceneLoader";

     import { AssetContainer } from "babylonjs/assetContainer";

     import { AssetContainer } from "babylonjs/assetContainer";

     import { Scene, IDisposable } from "babylonjs/scene";

     import { Scene, IDisposable } from "babylonjs/scene";

+    import * as GLTF2 from "babylonjs-gltf2interface";

     /**

     /**

      * Mode that determines the coordinate system to use.

      * Mode that determines the coordinate system to use.

      */

      */

@@ -248,12 +248,12 @@ declare module "babylonjs-loaders/glTF/glTFFileLoader" {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

@@ -994,7 +994,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     import { Buffer, VertexBuffer } from "babylonjs/Meshes/buffer";

     import { Buffer, VertexBuffer } from "babylonjs/Meshes/buffer";

     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";

     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";

     import { Mesh } from "babylonjs/Meshes/mesh";

     import { Mesh } from "babylonjs/Meshes/mesh";

-    import * as IGLTF2 from "babylonjs-gltf2interface";

+    import * as GLTF2 from "babylonjs-gltf2interface";

     /**

     /**

      * Loader interface with an index field.

      * Loader interface with an index field.

      */

      */

@@ -1007,7 +1007,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAccessor extends IGLTF2.IAccessor, IArrayItem {

+    export interface IAccessor extends GLTF2.IAccessor, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

         /** @hidden */

         /** @hidden */

@@ -1016,25 +1016,25 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimationChannel extends IGLTF2.IAnimationChannel, IArrayItem {

+    export interface IAnimationChannel extends GLTF2.IAnimationChannel, IArrayItem {

     }

     }

     /** @hidden */

     /** @hidden */

     export interface _IAnimationSamplerData {

     export interface _IAnimationSamplerData {

         input: Float32Array;

         input: Float32Array;

-        interpolation: IGLTF2.AnimationSamplerInterpolation;

+        interpolation: GLTF2.AnimationSamplerInterpolation;

         output: Float32Array;

         output: Float32Array;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimationSampler extends IGLTF2.IAnimationSampler, IArrayItem {

+    export interface IAnimationSampler extends GLTF2.IAnimationSampler, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<_IAnimationSamplerData>;

         _data?: Promise<_IAnimationSamplerData>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimation extends IGLTF2.IAnimation, IArrayItem {

+    export interface IAnimation extends GLTF2.IAnimation, IArrayItem {

         channels: IAnimationChannel[];

         channels: IAnimationChannel[];

         samplers: IAnimationSampler[];

         samplers: IAnimationSampler[];

         /** @hidden */

         /** @hidden */

@@ -1043,14 +1043,14 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IBuffer extends IGLTF2.IBuffer, IArrayItem {

+    export interface IBuffer extends GLTF2.IBuffer, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IBufferView extends IGLTF2.IBufferView, IArrayItem {

+    export interface IBufferView extends GLTF2.IBufferView, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

         /** @hidden */

         /** @hidden */

@@ -1059,36 +1059,36 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ICamera extends IGLTF2.ICamera, IArrayItem {

+    export interface ICamera extends GLTF2.ICamera, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IImage extends IGLTF2.IImage, IArrayItem {

+    export interface IImage extends GLTF2.IImage, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialNormalTextureInfo extends IGLTF2.IMaterialNormalTextureInfo, ITextureInfo {

+    export interface IMaterialNormalTextureInfo extends GLTF2.IMaterialNormalTextureInfo, ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialOcclusionTextureInfo extends IGLTF2.IMaterialOcclusionTextureInfo, ITextureInfo {

+    export interface IMaterialOcclusionTextureInfo extends GLTF2.IMaterialOcclusionTextureInfo, ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialPbrMetallicRoughness extends IGLTF2.IMaterialPbrMetallicRoughness {

+    export interface IMaterialPbrMetallicRoughness extends GLTF2.IMaterialPbrMetallicRoughness {

         baseColorTexture?: ITextureInfo;

         baseColorTexture?: ITextureInfo;

         metallicRoughnessTexture?: ITextureInfo;

         metallicRoughnessTexture?: ITextureInfo;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterial extends IGLTF2.IMaterial, IArrayItem {

+    export interface IMaterial extends GLTF2.IMaterial, IArrayItem {

         pbrMetallicRoughness?: IMaterialPbrMetallicRoughness;

         pbrMetallicRoughness?: IMaterialPbrMetallicRoughness;

         normalTexture?: IMaterialNormalTextureInfo;

         normalTexture?: IMaterialNormalTextureInfo;

         occlusionTexture?: IMaterialOcclusionTextureInfo;

         occlusionTexture?: IMaterialOcclusionTextureInfo;

@@ -1105,13 +1105,13 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMesh extends IGLTF2.IMesh, IArrayItem {

+    export interface IMesh extends GLTF2.IMesh, IArrayItem {

         primitives: IMeshPrimitive[];

         primitives: IMeshPrimitive[];

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMeshPrimitive extends IGLTF2.IMeshPrimitive, IArrayItem {

+    export interface IMeshPrimitive extends GLTF2.IMeshPrimitive, IArrayItem {

         /** @hidden */

         /** @hidden */

         _instanceData?: {

         _instanceData?: {

             babylonSourceMesh: Mesh;

             babylonSourceMesh: Mesh;

@@ -1121,7 +1121,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface INode extends IGLTF2.INode, IArrayItem {

+    export interface INode extends GLTF2.INode, IArrayItem {

         /**

         /**

          * The parent glTF node.

          * The parent glTF node.

          */

          */

@@ -1145,19 +1145,19 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ISampler extends IGLTF2.ISampler, IArrayItem {

+    export interface ISampler extends GLTF2.ISampler, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: _ISamplerData;

         _data?: _ISamplerData;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IScene extends IGLTF2.IScene, IArrayItem {

+    export interface IScene extends GLTF2.IScene, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ISkin extends IGLTF2.ISkin, IArrayItem {

+    export interface ISkin extends GLTF2.ISkin, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: {

         _data?: {

             babylonSkeleton: Skeleton;

             babylonSkeleton: Skeleton;

@@ -1167,17 +1167,17 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ITexture extends IGLTF2.ITexture, IArrayItem {

+    export interface ITexture extends GLTF2.ITexture, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ITextureInfo extends IGLTF2.ITextureInfo {

+    export interface ITextureInfo extends GLTF2.ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IGLTF extends IGLTF2.IGLTF {

+    export interface IGLTF extends GLTF2.IGLTF {

         accessors?: IAccessor[];

         accessors?: IAccessor[];

         animations?: IAnimation[];

         animations?: IAnimation[];

         buffers?: IBuffer[];

         buffers?: IBuffer[];

@@ -2536,12 +2536,12 @@ declare module BABYLON {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<BABYLON.GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: BABYLON.GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

+ 3 - 3
dist/loaders/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-loaders",
 
     "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.",
 
     "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.0.2",
 
+    "version": "4.0.3",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -28,8 +28,8 @@
 
     ],
 
     ],
 
     "license": "Apache-2.0",
 
     "license": "Apache-2.0",
 
     "dependencies": {
 
     "dependencies": {
 
-        "babylonjs-gltf2interface": "4.0.2",
 
-        "babylonjs": "4.0.2"
 
+        "babylonjs-gltf2interface": "4.0.3",
 
+        "babylonjs": "4.0.3"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

+ 2 - 2
dist/materialsLibrary/package.json
View File 

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

+ 2 - 2
dist/postProcessesLibrary/package.json
View File 

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

File diff suppressed because it is too large
+ 40 - 665
dist/preview release/ammo.js


File diff suppressed because it is too large
+ 2427 - 360
dist/preview release/babylon.d.ts


File diff suppressed because it is too large
+ 2 - 2
dist/preview release/babylon.js


File diff suppressed because it is too large
+ 8150 - 1238
dist/preview release/babylon.max.js


File diff suppressed because it is too large
+ 1 - 1
dist/preview release/babylon.max.js.map


File diff suppressed because it is too large
+ 46917 - 42560
dist/preview release/babylon.module.d.ts


File diff suppressed because it is too large
+ 68504 - 0
dist/preview release/documentation.d.ts


+ 5 - 52
dist/preview release/glTF2Interface/babylon.glTF2Interface.d.ts
View File 

@@ -856,7 +856,7 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * Interface for glTF validation results

+     * The glTF validation results

      */

      */

     interface IGLTFValidationResults {

     interface IGLTFValidationResults {

         info: {

         info: {

@@ -885,7 +885,7 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * Interface for glTF validation options

+     * The glTF validation options

      */

      */

     interface IGLTFValidationOptions {

     interface IGLTFValidationOptions {

         uri?: string;

         uri?: string;

@@ -897,57 +897,10 @@ declare module BABYLON.GLTF2 {
 
     }

     }

 

 

     /**

     /**

-     * glTF validator object Tyyings

+     * The glTF validator object

      */

      */

-    interface IGLTFValidatorTypings {

+    interface IGLTFValidator {

+        validateBytes: (data: Uint8Array, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

         validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

         validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

     }

     }

 }

 }

-

-/**

- * Interface for glTF validation results

- */

-interface IGLTFValidationResults {

-    info: {

-        generator: string;

-        hasAnimations: boolean;

-        hasDefaultScene: boolean;

-        hasMaterials: boolean;

-        hasMorphTargets: boolean;

-        hasSkins: boolean;

-        hasTextures: boolean;

-        maxAttributesUsed: number;

-        primitivesCount: number

-    };

-    issues: {

-        messages: Array<string>;

-        numErrors: number;

-        numHints: number;

-        numInfos: number;

-        numWarnings: number;

-        truncated: boolean

-    };

-    mimeType: string;

-    uri: string;

-    validatedAt: string;

-    validatorVersion: string;

-}

-

-/**

- * Interface for glTF validation options

- */

-interface IGLTFValidationOptions {

-    uri?: string;

-    externalResourceFunction?: (uri: string) => Promise<Uint8Array>;

-    validateAccessorData?: boolean;

-    maxIssues?: number;

-    ignoredIssues?: Array<string>;

-    severityOverrides?: Object;

-}

-

-/**

- * glTF validator object Tyyings

- */

-interface IGLTFValidatorTypings {

-    validateString: (json: string, options?: IGLTFValidationOptions) => Promise<IGLTFValidationResults>;

-}

+ 1 - 1
dist/preview release/glTF2Interface/package.json
View File 

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

File diff suppressed because it is too large
+ 4458 - 4573
dist/preview release/gltf_validator.js


+ 0 - 2
dist/preview release/gui/babylon.gui.d.ts
View File 

@@ -2103,8 +2103,6 @@ declare module BABYLON.GUI {
 
         private _drawGradientSquare;

         private _drawGradientSquare;

         private _drawCircle;

         private _drawCircle;

         private _createColorWheelCanvas;

         private _createColorWheelCanvas;

-        private _RGBtoHSV;

-        private _HSVtoRGB;

         /** @hidden */

         /** @hidden */

         _draw(context: CanvasRenderingContext2D): void;

         _draw(context: CanvasRenderingContext2D): void;

         private _pointerIsDown;

         private _pointerIsDown;

+ 46 - 112
dist/preview release/gui/babylon.gui.js
View File 

@@ -7,7 +7,7 @@
 
 		exports["babylonjs-gui"] = factory(require("babylonjs"));
 
 		exports["babylonjs-gui"] = factory(require("babylonjs"));
 
 	else
 
 	else
 
 		root["BABYLON"] = root["BABYLON"] || {}, root["BABYLON"]["GUI"] = factory(root["BABYLON"]);
 
 		root["BABYLON"] = root["BABYLON"] || {}, root["BABYLON"]["GUI"] = factory(root["BABYLON"]);
 
-})((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), function(__WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_observable__) {
 
+})((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), function(__WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_tools__) {
 
 return /******/ (function(modules) { // webpackBootstrap
 
 return /******/ (function(modules) { // webpackBootstrap
 
 /******/ 	// The module cache
 
 /******/ 	// The module cache
 
 /******/ 	var installedModules = {};
 
 /******/ 	var installedModules = {};
 
@@ -355,7 +355,7 @@ module.exports = g;
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return AdvancedDynamicTextureInstrumentation; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return AdvancedDynamicTextureInstrumentation; });
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_0__);
 
 

 

 /**

 /**

@@ -498,7 +498,7 @@ var AdvancedDynamicTextureInstrumentation = /** @class */ (function () {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return AdvancedDynamicTexture; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return AdvancedDynamicTexture; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _controls_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./controls/container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _controls_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./controls/container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style */ "./2D/style.ts");
 
 /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style */ "./2D/style.ts");
 
@@ -1053,7 +1053,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
 
                     });

                     });

                     continue;

                     continue;

                 }

                 }

-                var position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : mesh.getAbsolutePosition();

+                var position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].ZeroReadOnly;

                 var projectedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);

                 var projectedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);

                 if (projectedPosition.z < 0 || projectedPosition.z > 1) {

                 if (projectedPosition.z < 0 || projectedPosition.z > 1) {

                     control.notRenderable = true;

                     control.notRenderable = true;

@@ -1619,7 +1619,7 @@ var Button = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return Checkbox; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return Checkbox; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
@@ -1800,7 +1800,7 @@ var Checkbox = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return ColorPicker; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return ColorPicker; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
 
 /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
 
@@ -1859,7 +1859,7 @@ var ColorPicker = /** @class */ (function (_super) {
 
                 return;

                 return;

             }

             }

             this._value.copyFrom(value);

             this._value.copyFrom(value);

-            this._RGBtoHSV(this._value, this._tmpColor);

+            this._value.toHSVToRef(this._tmpColor);

             this._h = this._tmpColor.r;

             this._h = this._tmpColor.r;

             this._s = Math.max(this._tmpColor.g, 0.00001);

             this._s = Math.max(this._tmpColor.g, 0.00001);

             this._v = Math.max(this._tmpColor.b, 0.00001);

             this._v = Math.max(this._tmpColor.b, 0.00001);

@@ -2004,7 +2004,7 @@ var ColorPicker = /** @class */ (function (_super) {
 
                 }

                 }

                 var dist = Math.sqrt(distSq);

                 var dist = Math.sqrt(distSq);

                 var ang = Math.atan2(y, x);

                 var ang = Math.atan2(y, x);

-                this._HSVtoRGB(ang * 180 / Math.PI + 180, dist / radius, 1, color);

+                babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].HSVtoRGBToRef(ang * 180 / Math.PI + 180, dist / radius, 1, color);

                 var index = ((x + radius) + ((y + radius) * 2 * radius)) * 4;

                 var index = ((x + radius) + ((y + radius) * 2 * radius)) * 4;

                 data[index] = color.r * 255;

                 data[index] = color.r * 255;

                 data[index + 1] = color.g * 255;

                 data[index + 1] = color.g * 255;

@@ -2040,72 +2040,6 @@ var ColorPicker = /** @class */ (function (_super) {
 
         context.putImageData(image, 0, 0);

         context.putImageData(image, 0, 0);

         return canvas;

         return canvas;

     };

     };

-    ColorPicker.prototype._RGBtoHSV = function (color, result) {

-        var r = color.r;

-        var g = color.g;

-        var b = color.b;

-        var max = Math.max(r, g, b);

-        var min = Math.min(r, g, b);

-        var h = 0;

-        var s = 0;

-        var v = max;

-        var dm = max - min;

-        if (max !== 0) {

-            s = dm / max;

-        }

-        if (max != min) {

-            if (max == r) {

-                h = (g - b) / dm;

-                if (g < b) {

-                    h += 6;

-                }

-            }

-            else if (max == g) {

-                h = (b - r) / dm + 2;

-            }

-            else if (max == b) {

-                h = (r - g) / dm + 4;

-            }

-            h *= 60;

-        }

-        result.r = h;

-        result.g = s;

-        result.b = v;

-    };

-    ColorPicker.prototype._HSVtoRGB = function (hue, saturation, value, result) {

-        var chroma = value * saturation;

-        var h = hue / 60;

-        var x = chroma * (1 - Math.abs((h % 2) - 1));

-        var r = 0;

-        var g = 0;

-        var b = 0;

-        if (h >= 0 && h <= 1) {

-            r = chroma;

-            g = x;

-        }

-        else if (h >= 1 && h <= 2) {

-            r = x;

-            g = chroma;

-        }

-        else if (h >= 2 && h <= 3) {

-            g = chroma;

-            b = x;

-        }

-        else if (h >= 3 && h <= 4) {

-            g = x;

-            b = chroma;

-        }

-        else if (h >= 4 && h <= 5) {

-            r = x;

-            b = chroma;

-        }

-        else if (h >= 5 && h <= 6) {

-            r = chroma;

-            b = x;

-        }

-        var m = value - chroma;

-        result.set((r + m), (g + m), (b + m));

-    };

     /** @hidden */

     /** @hidden */

     ColorPicker.prototype._draw = function (context) {

     ColorPicker.prototype._draw = function (context) {

         context.save();

         context.save();

@@ -2157,7 +2091,7 @@ var ColorPicker = /** @class */ (function (_super) {
 
             this._v = Math.min(this._v, 1);

             this._v = Math.min(this._v, 1);

             this._v = Math.max(this._v, ColorPicker._Epsilon);

             this._v = Math.max(this._v, ColorPicker._Epsilon);

         }

         }

-        this._HSVtoRGB(this._h, this._s, this._v, this._tmpColor);

+        babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].HSVtoRGBToRef(this._h, this._s, this._v, this._tmpColor);

         this.value = this._tmpColor;

         this.value = this._tmpColor;

     };

     };

     ColorPicker.prototype._isPointOnSquare = function (x, y) {

     ColorPicker.prototype._isPointOnSquare = function (x, y) {

@@ -3253,7 +3187,7 @@ var ColorPicker = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return Container; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return Container; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/logger */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/logger */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
 
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
 
@@ -3658,7 +3592,7 @@ var Container = /** @class */ (function (_super) {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return Control; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return Control; });
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
 
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
 
@@ -5849,7 +5783,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
 
 

 

 

 

@@ -6305,7 +6239,7 @@ var Grid = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return Image; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return Image; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 

 

@@ -7080,7 +7014,7 @@ var InputPassword = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return InputText; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return InputText; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
@@ -8089,7 +8023,7 @@ var InputText = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return Line; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return Line; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
@@ -8282,8 +8216,8 @@ var Line = /** @class */ (function (_super) {
 
         context.lineWidth = this._lineWidth;

         context.lineWidth = this._lineWidth;

         context.setLineDash(this._dash);

         context.setLineDash(this._dash);

         context.beginPath();

         context.beginPath();

-        context.moveTo(this._cachedParentMeasure.left + this._x1.getValue(this._host), this._cachedParentMeasure.left + this._y1.getValue(this._host));

-        context.lineTo(this._cachedParentMeasure.left + this._effectiveX2, this._cachedParentMeasure.left + this._effectiveY2);

+        context.moveTo(this._cachedParentMeasure.left + this._x1.getValue(this._host), this._cachedParentMeasure.top + this._y1.getValue(this._host));

+        context.lineTo(this._cachedParentMeasure.left + this._effectiveX2, this._cachedParentMeasure.top + this._effectiveY2);

         context.stroke();

         context.stroke();

         context.restore();

         context.restore();

     };

     };

@@ -8357,7 +8291,7 @@ var Line = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return MultiLine; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return MultiLine; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/abstractMesh */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/abstractMesh */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../multiLinePoint */ "./2D/multiLinePoint.ts");
 
 /* harmony import */ var _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../multiLinePoint */ "./2D/multiLinePoint.ts");
 
@@ -8624,7 +8558,7 @@ var MultiLine = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return RadioButton; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return RadioButton; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
@@ -8969,7 +8903,7 @@ var Rectangle = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return ScrollViewer; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return ScrollViewer; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Events/pointerEvents */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Events/pointerEvents */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../rectangle */ "./2D/controls/rectangle.ts");
 
 /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../rectangle */ "./2D/controls/rectangle.ts");
 
 /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../grid */ "./2D/controls/grid.ts");
 
 /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../grid */ "./2D/controls/grid.ts");
 
@@ -10060,7 +9994,7 @@ var SelectionPanel = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return BaseSlider; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return BaseSlider; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../valueAndUnit */ "./2D/valueAndUnit.ts");
 
@@ -10961,7 +10895,7 @@ var Slider = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return StackPanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return StackPanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
@@ -11219,7 +11153,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return TextWrapping; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return TextWrapping; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return TextBlock; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return TextBlock; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
@@ -11659,7 +11593,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return KeyPropertySet; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return KeyPropertySet; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return VirtualKeyboard; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return VirtualKeyboard; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 
 /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
 
 /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
 
@@ -12040,7 +11974,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return Vector2WithInfo; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return Vector2WithInfo; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return Matrix2D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return Matrix2D; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 

 

 

 

@@ -12264,7 +12198,7 @@ var Matrix2D = /** @class */ (function () {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return Measure; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return Measure; });
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 
 

 

 

 

@@ -12397,7 +12331,7 @@ var Measure = /** @class */ (function () {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return MultiLinePoint; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return MultiLinePoint; });
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
 

 

@@ -12540,7 +12474,7 @@ var MultiLinePoint = /** @class */ (function () {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return Style; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return Style; });
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
 

 

@@ -12847,7 +12781,7 @@ var ValueAndUnit = /** @class */ (function () {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return AbstractButton3D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return AbstractButton3D; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
 

 

@@ -12890,7 +12824,7 @@ var AbstractButton3D = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return Button3D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return Button3D; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _abstractButton3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractButton3D */ "./3D/controls/abstractButton3D.ts");
 
 /* harmony import */ var _abstractButton3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractButton3D */ "./3D/controls/abstractButton3D.ts");
 
 /* harmony import */ var _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../2D/advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
 
 /* harmony import */ var _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../2D/advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
 
@@ -13067,7 +13001,7 @@ var Button3D = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return Container3D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return Container3D; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
 

 

@@ -13224,7 +13158,7 @@ var Container3D = /** @class */ (function (_super) {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return Control3D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return Control3D; });
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../vector3WithInfo */ "./3D/vector3WithInfo.ts");
 
 /* harmony import */ var _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../vector3WithInfo */ "./3D/vector3WithInfo.ts");
 
 

 

@@ -13630,7 +13564,7 @@ var Control3D = /** @class */ (function () {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return CylinderPanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return CylinderPanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
@@ -13715,7 +13649,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return HolographicButton; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return HolographicButton; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
 
 /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__);
 
 /* harmony import */ var _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../materials/fluentMaterial */ "./3D/materials/fluentMaterial.ts");
 
 /* harmony import */ var _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../materials/fluentMaterial */ "./3D/materials/fluentMaterial.ts");
 
 /* harmony import */ var _2D_controls_stackPanel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../2D/controls/stackPanel */ "./2D/controls/stackPanel.ts");
 
 /* harmony import */ var _2D_controls_stackPanel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../2D/controls/stackPanel */ "./2D/controls/stackPanel.ts");
 
@@ -14191,7 +14125,7 @@ var MeshButton3D = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return PlanePanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return PlanePanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
@@ -14246,7 +14180,7 @@ var PlanePanel = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return ScatterPanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return ScatterPanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
@@ -14373,7 +14307,7 @@ var ScatterPanel = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return SpherePanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return SpherePanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
@@ -14458,7 +14392,7 @@ var SpherePanel = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return StackPanel3D; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return StackPanel3D; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 

 

@@ -14583,7 +14517,7 @@ var StackPanel3D = /** @class */ (function (_super) {
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return VolumeBasedPanel; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return VolumeBasedPanel; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
 

 

@@ -14774,7 +14708,7 @@ var VolumeBasedPanel = /** @class */ (function (_super) {
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return GUI3DManager; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return GUI3DManager; });
 
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var _controls_container3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./controls/container3D */ "./3D/controls/container3D.ts");
 
 /* harmony import */ var _controls_container3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./controls/container3D */ "./3D/controls/container3D.ts");
 
 

 

@@ -15041,7 +14975,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return FluentMaterialDefines; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return FluentMaterialDefines; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return FluentMaterial; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return FluentMaterial; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/decorators */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/decorators */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var _shaders_fluent_vertex__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shaders/fluent.vertex */ "./3D/materials/shaders/fluent.vertex.ts");
 
 /* harmony import */ var _shaders_fluent_vertex__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shaders/fluent.vertex */ "./3D/materials/shaders/fluent.vertex.ts");
 
 /* harmony import */ var _shaders_fluent_fragment__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shaders/fluent.fragment */ "./3D/materials/shaders/fluent.fragment.ts");
 
 /* harmony import */ var _shaders_fluent_fragment__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shaders/fluent.fragment */ "./3D/materials/shaders/fluent.fragment.ts");
 
@@ -15363,7 +15297,7 @@ __webpack_require__.r(__webpack_exports__);
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentPixelShader", function() { return fluentPixelShader; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentPixelShader", function() { return fluentPixelShader; });
 
-/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 

 

 var name = 'fluentPixelShader';

 var name = 'fluentPixelShader';

@@ -15385,7 +15319,7 @@ var fluentPixelShader = { name: name, shader: shader };
 
 "use strict";
 
 "use strict";
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentVertexShader", function() { return fluentVertexShader; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentVertexShader", function() { return fluentVertexShader; });
 
-/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 

 

 var name = 'fluentVertexShader';

 var name = 'fluentVertexShader';

@@ -15408,7 +15342,7 @@ var fluentVertexShader = { name: name, shader: shader };
 
 __webpack_require__.r(__webpack_exports__);
 
 __webpack_require__.r(__webpack_exports__);
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return Vector3WithInfo; });
 
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return Vector3WithInfo; });
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/observable");
 
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/tools");
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 

 

 

 

@@ -15702,14 +15636,14 @@ if (typeof globalObject !== "undefined") {
 
 
 
 /***/ }),
 
 /***/ }),
 
 
 
-/***/ "babylonjs/Misc/observable":
 
+/***/ "babylonjs/Misc/tools":
 
 /*!****************************************************************************************************!*\
 
 /*!****************************************************************************************************!*\
 
   !*** external {"root":"BABYLON","commonjs":"babylonjs","commonjs2":"babylonjs","amd":"babylonjs"} ***!
 
   !*** external {"root":"BABYLON","commonjs":"babylonjs","commonjs2":"babylonjs","amd":"babylonjs"} ***!
 
   \****************************************************************************************************/
 
   \****************************************************************************************************/
 
 /*! no static exports found */
 
 /*! no static exports found */
 
 /***/ (function(module, exports) {
 
 /***/ (function(module, exports) {
 
 
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_observable__;
 
+module.exports = __WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_tools__;
 
 
 
 /***/ })
 
 /***/ })

File diff suppressed because it is too large
+ 1 - 1
dist/preview release/gui/babylon.gui.js.map


File diff suppressed because it is too large
+ 1 - 1
dist/preview release/gui/babylon.gui.min.js


+ 0 - 4
dist/preview release/gui/babylon.gui.module.d.ts
View File 

@@ -2178,8 +2178,6 @@ declare module "babylonjs-gui/2D/controls/colorpicker" {
 
         private _drawGradientSquare;

         private _drawGradientSquare;

         private _drawCircle;

         private _drawCircle;

         private _createColorWheelCanvas;

         private _createColorWheelCanvas;

-        private _RGBtoHSV;

-        private _HSVtoRGB;

         /** @hidden */

         /** @hidden */

         _draw(context: CanvasRenderingContext2D): void;

         _draw(context: CanvasRenderingContext2D): void;

         private _pointerIsDown;

         private _pointerIsDown;

@@ -5960,8 +5958,6 @@ declare module BABYLON.GUI {
 
         private _drawGradientSquare;

         private _drawGradientSquare;

         private _drawCircle;

         private _drawCircle;

         private _createColorWheelCanvas;

         private _createColorWheelCanvas;

-        private _RGBtoHSV;

-        private _HSVtoRGB;

         /** @hidden */

         /** @hidden */

         _draw(context: CanvasRenderingContext2D): void;

         _draw(context: CanvasRenderingContext2D): void;

         private _pointerIsDown;

         private _pointerIsDown;

+ 2 - 2
dist/preview release/gui/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-gui",
 
     "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.",
 
     "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.0.2",
 
+    "version": "4.1.0-alpha.1",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -28,7 +28,7 @@
 
     ],
 
     ],
 
     "license": "Apache-2.0",
 
     "license": "Apache-2.0",
 
     "dependencies": {
 
     "dependencies": {
 
-        "babylonjs": "4.0.2"
 
+        "babylonjs": "4.1.0-alpha.1"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

File diff suppressed because it is too large
+ 7 - 7
dist/preview release/inspector/babylon.inspector.bundle.js


File diff suppressed because it is too large
+ 421 - 155
dist/preview release/inspector/babylon.inspector.bundle.max.js


File diff suppressed because it is too large
+ 1 - 1
dist/preview release/inspector/babylon.inspector.bundle.max.js.map


+ 59 - 33
dist/preview release/inspector/babylon.inspector.d.ts
View File 

@@ -90,7 +90,7 @@ declare module INSPECTOR {
 
 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

     interface ILineContainerComponentProps {

     interface ILineContainerComponentProps {

-        globalState: GlobalState;

+        globalState?: GlobalState;

         title: string;

         title: string;

         children: any[] | any;

         children: any[] | any;

         closed?: boolean;

         closed?: boolean;

@@ -400,12 +400,27 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    interface IFileButtonLineComponentProps {

+        label: string;

+        onClick: (file: File) => void;

+        accept: string;

+    }

+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

+        private static _IDGenerator;

+        private _id;

+        constructor(props: IFileButtonLineComponentProps);

+        onChange(evt: any): void;

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     export interface ITextureLinkLineComponentProps {

     export interface ITextureLinkLineComponentProps {

         label: string;

         label: string;

         texture: BABYLON.Nullable<BABYLON.BaseTexture>;

         texture: BABYLON.Nullable<BABYLON.BaseTexture>;

         material?: BABYLON.Material;

         material?: BABYLON.Material;

         onSelectionChangedObservable?: BABYLON.Observable<any>;

         onSelectionChangedObservable?: BABYLON.Observable<any>;

         onDebugSelectionChangeObservable?: BABYLON.Observable<BABYLON.BaseTexture>;

         onDebugSelectionChangeObservable?: BABYLON.Observable<BABYLON.BaseTexture>;

+        propertyName?: string;

     }

     }

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

         isDebugSelected: boolean;

         isDebugSelected: boolean;

@@ -416,6 +431,7 @@ declare module INSPECTOR {
 
         componentWillUnmount(): void;

         componentWillUnmount(): void;

         debugTexture(): void;

         debugTexture(): void;

         onLink(): void;

         onLink(): void;

+        updateTexture(file: File): void;

         render(): JSX.Element | null;

         render(): JSX.Element | null;

     }

     }

 }

 }

@@ -430,7 +446,7 @@ declare module INSPECTOR {
 
     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IStandardMaterialPropertyGridComponentProps);

         constructor(props: IStandardMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -439,7 +455,8 @@ declare module INSPECTOR {
 
         texture: BABYLON.BaseTexture;

         texture: BABYLON.BaseTexture;

         width: number;

         width: number;

         height: number;

         height: number;

-        globalState: GlobalState;

+        globalState?: GlobalState;

+        hideChannelSelect?: boolean;

     }

     }

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

         displayRed: boolean;

         displayRed: boolean;

@@ -472,6 +489,8 @@ declare module INSPECTOR {
 
         isInteger?: boolean;

         isInteger?: boolean;

         onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

         onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

         additionalClass?: string;

         additionalClass?: string;

+        step?: string;

+        digits?: number;

     }

     }

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

         value: string;

         value: string;

@@ -491,18 +510,6 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

-    interface IFileButtonLineComponentProps {

-        label: string;

-        onClick: (file: File) => void;

-        accept: string;

-    }

-    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

-        constructor(props: IFileButtonLineComponentProps);

-        onChange(evt: any): void;

-        render(): JSX.Element;

-    }

-}

-declare module INSPECTOR {

     interface ITexturePropertyGridComponentProps {

     interface ITexturePropertyGridComponentProps {

         texture: BABYLON.BaseTexture;

         texture: BABYLON.BaseTexture;

         lockObject: LockObject;

         lockObject: LockObject;

@@ -558,7 +565,7 @@ declare module INSPECTOR {
 
     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMaterialPropertyGridComponentProps);

         constructor(props: IPBRMaterialPropertyGridComponentProps);

-        renderTextures(onDebugSelectionChangeObservable: BABYLON.Observable<BABYLON.BaseTexture>): JSX.Element | null;

+        renderTextures(onDebugSelectionChangeObservable: BABYLON.Observable<BABYLON.BaseTexture>): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -595,6 +602,16 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    export interface IButtonLineComponentProps {

+        label: string;

+        onClick: () => void;

+    }

+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

+        constructor(props: IButtonLineComponentProps);

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     interface IScenePropertyGridComponentProps {

     interface IScenePropertyGridComponentProps {

         globalState: GlobalState;

         globalState: GlobalState;

         scene: BABYLON.Scene;

         scene: BABYLON.Scene;

@@ -611,6 +628,7 @@ declare module INSPECTOR {
 
         updateEnvironmentTexture(file: File): void;

         updateEnvironmentTexture(file: File): void;

         updateGravity(newValue: BABYLON.Vector3): void;

         updateGravity(newValue: BABYLON.Vector3): void;

         updateTimeStep(newValue: number): void;

         updateTimeStep(newValue: number): void;

+        normalizeScene(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -647,6 +665,7 @@ declare module INSPECTOR {
 
     }

     }

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

+        createShadowGenerator(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -834,16 +853,6 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

-    export interface IButtonLineComponentProps {

-        label: string;

-        onClick: () => void;

-    }

-    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

-        constructor(props: IButtonLineComponentProps);

-        render(): JSX.Element;

-    }

-}

-declare module INSPECTOR {

     interface IAnimationGroupGridComponentProps {

     interface IAnimationGroupGridComponentProps {

         globalState: GlobalState;

         globalState: GlobalState;

         animationGroup: BABYLON.AnimationGroup;

         animationGroup: BABYLON.AnimationGroup;

@@ -1004,7 +1013,7 @@ declare module INSPECTOR {
 
     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -1019,7 +1028,7 @@ declare module INSPECTOR {
 
     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -1211,6 +1220,20 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    interface INodeMaterialPropertyGridComponentProps {

+        globalState: GlobalState;

+        material: BABYLON.NodeMaterial;

+        lockObject: LockObject;

+        onSelectionChangedObservable?: BABYLON.Observable<any>;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class NodeMaterialPropertyGridComponent extends React.Component<INodeMaterialPropertyGridComponentProps> {

+        constructor(props: INodeMaterialPropertyGridComponentProps);

+        edit(): void;

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     export class PropertyGridTabComponent extends PaneComponent {

     export class PropertyGridTabComponent extends PaneComponent {

         private _timerIntervalId;

         private _timerIntervalId;

         private _lockObject;

         private _lockObject;

@@ -1287,7 +1310,7 @@ declare module INSPECTOR {
 
 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

     interface IActionTabsComponentProps {

     interface IActionTabsComponentProps {

-        scene: BABYLON.Scene;

+        scene?: BABYLON.Scene;

         noCommands?: boolean;

         noCommands?: boolean;

         noHeader?: boolean;

         noHeader?: boolean;

         noExpand?: boolean;

         noExpand?: boolean;

@@ -1295,7 +1318,7 @@ declare module INSPECTOR {
 
         popupMode?: boolean;

         popupMode?: boolean;

         onPopup?: () => void;

         onPopup?: () => void;

         onClose?: () => void;

         onClose?: () => void;

-        globalState: GlobalState;

+        globalState?: GlobalState;

     }

     }

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

         selectedEntity: any;

         selectedEntity: any;

@@ -1308,7 +1331,7 @@ declare module INSPECTOR {
 
         componentWillMount(): void;

         componentWillMount(): void;

         componentWillUnmount(): void;

         componentWillUnmount(): void;

         changeSelectedTab(index: number): void;

         changeSelectedTab(index: number): void;

-        renderContent(): JSX.Element;

+        renderContent(): JSX.Element | null;

         onClose(): void;

         onClose(): void;

         onPopup(): void;

         onPopup(): void;

         render(): JSX.Element;

         render(): JSX.Element;

@@ -1611,6 +1634,9 @@ declare module INSPECTOR {
 
         private _onPointerObserver;

         private _onPointerObserver;

         private _onSelectionChangeObserver;

         private _onSelectionChangeObserver;

         private _selectedEntity;

         private _selectedEntity;

+        private _posDragEnd;

+        private _scaleDragEnd;

+        private _rotateDragEnd;

         constructor(props: ISceneTreeItemComponentProps);

         constructor(props: ISceneTreeItemComponentProps);

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

             isSelected: boolean;

             isSelected: boolean;

@@ -1708,11 +1734,11 @@ declare module INSPECTOR {
 
         private static _CreateSceneExplorer;

         private static _CreateSceneExplorer;

         private static _CreateActionTabs;

         private static _CreateActionTabs;

         private static _CreateEmbedHost;

         private static _CreateEmbedHost;

-        private static _CreatePopup;

+        static _CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): BABYLON.Nullable<HTMLDivElement>;

         static readonly IsVisible: boolean;

         static readonly IsVisible: boolean;

         static EarlyAttachToLoader(): void;

         static EarlyAttachToLoader(): void;

         static Show(scene: BABYLON.Scene, userOptions: Partial<BABYLON.IInspectorOptions>): void;

         static Show(scene: BABYLON.Scene, userOptions: Partial<BABYLON.IInspectorOptions>): void;

-        private static _CreateCanvasContainer;

+        static _CreateCanvasContainer(parentControl: HTMLElement): void;

         private static _DestroyCanvasContainer;

         private static _DestroyCanvasContainer;

         private static _Cleanup;

         private static _Cleanup;

         private static _RemoveElementFromDOM;

         private static _RemoveElementFromDOM;

+ 127 - 68
dist/preview release/inspector/babylon.inspector.module.d.ts
View File 

@@ -111,7 +111,7 @@ declare module "babylonjs-inspector/components/actionTabs/lineContainerComponent
 
     import * as React from "react";

     import * as React from "react";

     import { GlobalState } from "babylonjs-inspector/components/globalState";

     import { GlobalState } from "babylonjs-inspector/components/globalState";

     interface ILineContainerComponentProps {

     interface ILineContainerComponentProps {

-        globalState: GlobalState;

+        globalState?: GlobalState;

         title: string;

         title: string;

         children: any[] | any;

         children: any[] | any;

         closed?: boolean;

         closed?: boolean;

@@ -466,6 +466,21 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/mat
 
         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

+declare module "babylonjs-inspector/components/actionTabs/lines/fileButtonLineComponent" {

+    import * as React from "react";

+    interface IFileButtonLineComponentProps {

+        label: string;

+        onClick: (file: File) => void;

+        accept: string;

+    }

+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

+        private static _IDGenerator;

+        private _id;

+        constructor(props: IFileButtonLineComponentProps);

+        onChange(evt: any): void;

+        render(): JSX.Element;

+    }

+}

 declare module "babylonjs-inspector/components/actionTabs/lines/textureLinkLineComponent" {

 declare module "babylonjs-inspector/components/actionTabs/lines/textureLinkLineComponent" {

     import * as React from "react";

     import * as React from "react";

     import { Nullable } from "babylonjs/types";

     import { Nullable } from "babylonjs/types";

@@ -478,6 +493,7 @@ declare module "babylonjs-inspector/components/actionTabs/lines/textureLinkLineC
 
         material?: Material;

         material?: Material;

         onSelectionChangedObservable?: Observable<any>;

         onSelectionChangedObservable?: Observable<any>;

         onDebugSelectionChangeObservable?: Observable<BaseTexture>;

         onDebugSelectionChangeObservable?: Observable<BaseTexture>;

+        propertyName?: string;

     }

     }

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

         isDebugSelected: boolean;

         isDebugSelected: boolean;

@@ -488,6 +504,7 @@ declare module "babylonjs-inspector/components/actionTabs/lines/textureLinkLineC
 
         componentWillUnmount(): void;

         componentWillUnmount(): void;

         debugTexture(): void;

         debugTexture(): void;

         onLink(): void;

         onLink(): void;

+        updateTexture(file: File): void;

         render(): JSX.Element | null;

         render(): JSX.Element | null;

     }

     }

 }

 }

@@ -508,7 +525,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/mat
 
     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IStandardMaterialPropertyGridComponentProps);

         constructor(props: IStandardMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -520,7 +537,8 @@ declare module "babylonjs-inspector/components/actionTabs/lines/textureLineCompo
 
         texture: BaseTexture;

         texture: BaseTexture;

         width: number;

         width: number;

         height: number;

         height: number;

-        globalState: GlobalState;

+        globalState?: GlobalState;

+        hideChannelSelect?: boolean;

     }

     }

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

         displayRed: boolean;

         displayRed: boolean;

@@ -557,6 +575,8 @@ declare module "babylonjs-inspector/components/actionTabs/lines/floatLineCompone
 
         isInteger?: boolean;

         isInteger?: boolean;

         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;

         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;

         additionalClass?: string;

         additionalClass?: string;

+        step?: string;

+        digits?: number;

     }

     }

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

         value: string;

         value: string;

@@ -575,19 +595,6 @@ declare module "babylonjs-inspector/components/actionTabs/lines/floatLineCompone
 
         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

-declare module "babylonjs-inspector/components/actionTabs/lines/fileButtonLineComponent" {

-    import * as React from "react";

-    interface IFileButtonLineComponentProps {

-        label: string;

-        onClick: (file: File) => void;

-        accept: string;

-    }

-    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

-        constructor(props: IFileButtonLineComponentProps);

-        onChange(evt: any): void;

-        render(): JSX.Element;

-    }

-}

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/materials/texturePropertyGridComponent" {

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/materials/texturePropertyGridComponent" {

     import * as React from "react";

     import * as React from "react";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

@@ -661,7 +668,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/mat
 
     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMaterialPropertyGridComponentProps);

         constructor(props: IPBRMaterialPropertyGridComponentProps);

-        renderTextures(onDebugSelectionChangeObservable: Observable<BaseTexture>): JSX.Element | null;

+        renderTextures(onDebugSelectionChangeObservable: Observable<BaseTexture>): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -705,6 +712,17 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/fog
 
         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

+declare module "babylonjs-inspector/components/actionTabs/lines/buttonLineComponent" {

+    import * as React from "react";

+    export interface IButtonLineComponentProps {

+        label: string;

+        onClick: () => void;

+    }

+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

+        constructor(props: IButtonLineComponentProps);

+        render(): JSX.Element;

+    }

+}

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/scenePropertyGridComponent" {

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/scenePropertyGridComponent" {

     import * as React from "react";

     import * as React from "react";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

@@ -729,6 +747,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/sce
 
         updateEnvironmentTexture(file: File): void;

         updateEnvironmentTexture(file: File): void;

         updateGravity(newValue: Vector3): void;

         updateGravity(newValue: Vector3): void;

         updateTimeStep(newValue: number): void;

         updateTimeStep(newValue: number): void;

+        normalizeScene(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -783,6 +802,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/lig
 
     }

     }

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

+        createShadowGenerator(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -1045,17 +1065,6 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/gui
 
         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

-declare module "babylonjs-inspector/components/actionTabs/lines/buttonLineComponent" {

-    import * as React from "react";

-    export interface IButtonLineComponentProps {

-        label: string;

-        onClick: () => void;

-    }

-    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

-        constructor(props: IButtonLineComponentProps);

-        render(): JSX.Element;

-    }

-}

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/animationGroupPropertyGridComponent" {

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/animationGroupPropertyGridComponent" {

     import * as React from "react";

     import * as React from "react";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

@@ -1290,7 +1299,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/mat
 
     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -1311,7 +1320,7 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/mat
 
     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -1587,6 +1596,26 @@ declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/pos
 
         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

+declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/materials/nodeMaterialPropertyGridComponent" {

+    import * as React from "react";

+    import { Observable } from "babylonjs/Misc/observable";

+    import { NodeMaterial } from "babylonjs/Materials/Node/nodeMaterial";

+    import { PropertyChangedEvent } from "babylonjs-inspector/components/propertyChangedEvent";

+    import { LockObject } from "babylonjs-inspector/components/actionTabs/tabs/propertyGrids/lockObject";

+    import { GlobalState } from "babylonjs-inspector/components/globalState";

+    interface INodeMaterialPropertyGridComponentProps {

+        globalState: GlobalState;

+        material: NodeMaterial;

+        lockObject: LockObject;

+        onSelectionChangedObservable?: Observable<any>;

+        onPropertyChangedObservable?: Observable<PropertyChangedEvent>;

+    }

+    export class NodeMaterialPropertyGridComponent extends React.Component<INodeMaterialPropertyGridComponentProps> {

+        constructor(props: INodeMaterialPropertyGridComponentProps);

+        edit(): void;

+        render(): JSX.Element;

+    }

+}

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGridTabComponent" {

 declare module "babylonjs-inspector/components/actionTabs/tabs/propertyGridTabComponent" {

     import { PaneComponent, IPaneComponentProps } from "babylonjs-inspector/components/actionTabs/paneComponent";

     import { PaneComponent, IPaneComponentProps } from "babylonjs-inspector/components/actionTabs/paneComponent";

     export class PropertyGridTabComponent extends PaneComponent {

     export class PropertyGridTabComponent extends PaneComponent {

@@ -1676,7 +1705,7 @@ declare module "babylonjs-inspector/components/actionTabs/actionTabsComponent" {
 
     import { Scene } from "babylonjs/scene";

     import { Scene } from "babylonjs/scene";

     import { GlobalState } from "babylonjs-inspector/components/globalState";

     import { GlobalState } from "babylonjs-inspector/components/globalState";

     interface IActionTabsComponentProps {

     interface IActionTabsComponentProps {

-        scene: Scene;

+        scene?: Scene;

         noCommands?: boolean;

         noCommands?: boolean;

         noHeader?: boolean;

         noHeader?: boolean;

         noExpand?: boolean;

         noExpand?: boolean;

@@ -1684,7 +1713,7 @@ declare module "babylonjs-inspector/components/actionTabs/actionTabsComponent" {
 
         popupMode?: boolean;

         popupMode?: boolean;

         onPopup?: () => void;

         onPopup?: () => void;

         onClose?: () => void;

         onClose?: () => void;

-        globalState: GlobalState;

+        globalState?: GlobalState;

     }

     }

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

         selectedEntity: any;

         selectedEntity: any;

@@ -1697,7 +1726,7 @@ declare module "babylonjs-inspector/components/actionTabs/actionTabsComponent" {
 
         componentWillMount(): void;

         componentWillMount(): void;

         componentWillUnmount(): void;

         componentWillUnmount(): void;

         changeSelectedTab(index: number): void;

         changeSelectedTab(index: number): void;

-        renderContent(): JSX.Element;

+        renderContent(): JSX.Element | null;

         onClose(): void;

         onClose(): void;

         onPopup(): void;

         onPopup(): void;

         render(): JSX.Element;

         render(): JSX.Element;

@@ -2060,6 +2089,9 @@ declare module "babylonjs-inspector/components/sceneExplorer/entities/sceneTreeI
 
         private _onPointerObserver;

         private _onPointerObserver;

         private _onSelectionChangeObserver;

         private _onSelectionChangeObserver;

         private _selectedEntity;

         private _selectedEntity;

+        private _posDragEnd;

+        private _scaleDragEnd;

+        private _rotateDragEnd;

         constructor(props: ISceneTreeItemComponentProps);

         constructor(props: ISceneTreeItemComponentProps);

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

             isSelected: boolean;

             isSelected: boolean;

@@ -2147,6 +2179,7 @@ declare module "babylonjs-inspector/components/embedHost/embedHostComponent" {
 
 }

 }

 declare module "babylonjs-inspector/inspector" {

 declare module "babylonjs-inspector/inspector" {

     import { IInspectorOptions } from "babylonjs/Debug/debugLayer";

     import { IInspectorOptions } from "babylonjs/Debug/debugLayer";

+    import { Nullable } from "babylonjs/types";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

     import { Scene } from "babylonjs/scene";

     import { Scene } from "babylonjs/scene";

     import { PropertyChangedEvent } from "babylonjs-inspector/components/propertyChangedEvent";

     import { PropertyChangedEvent } from "babylonjs-inspector/components/propertyChangedEvent";

@@ -2169,11 +2202,11 @@ declare module "babylonjs-inspector/inspector" {
 
         private static _CreateSceneExplorer;

         private static _CreateSceneExplorer;

         private static _CreateActionTabs;

         private static _CreateActionTabs;

         private static _CreateEmbedHost;

         private static _CreateEmbedHost;

-        private static _CreatePopup;

+        static _CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): Nullable<HTMLDivElement>;

         static readonly IsVisible: boolean;

         static readonly IsVisible: boolean;

         static EarlyAttachToLoader(): void;

         static EarlyAttachToLoader(): void;

         static Show(scene: Scene, userOptions: Partial<IInspectorOptions>): void;

         static Show(scene: Scene, userOptions: Partial<IInspectorOptions>): void;

-        private static _CreateCanvasContainer;

+        static _CreateCanvasContainer(parentControl: HTMLElement): void;

         private static _DestroyCanvasContainer;

         private static _DestroyCanvasContainer;

         private static _Cleanup;

         private static _Cleanup;

         private static _RemoveElementFromDOM;

         private static _RemoveElementFromDOM;

@@ -2281,7 +2314,7 @@ declare module INSPECTOR {
 
 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

     interface ILineContainerComponentProps {

     interface ILineContainerComponentProps {

-        globalState: GlobalState;

+        globalState?: GlobalState;

         title: string;

         title: string;

         children: any[] | any;

         children: any[] | any;

         closed?: boolean;

         closed?: boolean;

@@ -2591,12 +2624,27 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    interface IFileButtonLineComponentProps {

+        label: string;

+        onClick: (file: File) => void;

+        accept: string;

+    }

+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

+        private static _IDGenerator;

+        private _id;

+        constructor(props: IFileButtonLineComponentProps);

+        onChange(evt: any): void;

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     export interface ITextureLinkLineComponentProps {

     export interface ITextureLinkLineComponentProps {

         label: string;

         label: string;

         texture: BABYLON.Nullable<BABYLON.BaseTexture>;

         texture: BABYLON.Nullable<BABYLON.BaseTexture>;

         material?: BABYLON.Material;

         material?: BABYLON.Material;

         onSelectionChangedObservable?: BABYLON.Observable<any>;

         onSelectionChangedObservable?: BABYLON.Observable<any>;

         onDebugSelectionChangeObservable?: BABYLON.Observable<BABYLON.BaseTexture>;

         onDebugSelectionChangeObservable?: BABYLON.Observable<BABYLON.BaseTexture>;

+        propertyName?: string;

     }

     }

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

     export class TextureLinkLineComponent extends React.Component<ITextureLinkLineComponentProps, {

         isDebugSelected: boolean;

         isDebugSelected: boolean;

@@ -2607,6 +2655,7 @@ declare module INSPECTOR {
 
         componentWillUnmount(): void;

         componentWillUnmount(): void;

         debugTexture(): void;

         debugTexture(): void;

         onLink(): void;

         onLink(): void;

+        updateTexture(file: File): void;

         render(): JSX.Element | null;

         render(): JSX.Element | null;

     }

     }

 }

 }

@@ -2621,7 +2670,7 @@ declare module INSPECTOR {
 
     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

     export class StandardMaterialPropertyGridComponent extends React.Component<IStandardMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IStandardMaterialPropertyGridComponentProps);

         constructor(props: IStandardMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -2630,7 +2679,8 @@ declare module INSPECTOR {
 
         texture: BABYLON.BaseTexture;

         texture: BABYLON.BaseTexture;

         width: number;

         width: number;

         height: number;

         height: number;

-        globalState: GlobalState;

+        globalState?: GlobalState;

+        hideChannelSelect?: boolean;

     }

     }

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

     export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

         displayRed: boolean;

         displayRed: boolean;

@@ -2663,6 +2713,8 @@ declare module INSPECTOR {
 
         isInteger?: boolean;

         isInteger?: boolean;

         onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

         onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

         additionalClass?: string;

         additionalClass?: string;

+        step?: string;

+        digits?: number;

     }

     }

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {

         value: string;

         value: string;

@@ -2682,18 +2734,6 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

-    interface IFileButtonLineComponentProps {

-        label: string;

-        onClick: (file: File) => void;

-        accept: string;

-    }

-    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

-        constructor(props: IFileButtonLineComponentProps);

-        onChange(evt: any): void;

-        render(): JSX.Element;

-    }

-}

-declare module INSPECTOR {

     interface ITexturePropertyGridComponentProps {

     interface ITexturePropertyGridComponentProps {

         texture: BABYLON.BaseTexture;

         texture: BABYLON.BaseTexture;

         lockObject: LockObject;

         lockObject: LockObject;

@@ -2749,7 +2789,7 @@ declare module INSPECTOR {
 
     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

     export class PBRMaterialPropertyGridComponent extends React.Component<IPBRMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMaterialPropertyGridComponentProps);

         constructor(props: IPBRMaterialPropertyGridComponentProps);

-        renderTextures(onDebugSelectionChangeObservable: BABYLON.Observable<BABYLON.BaseTexture>): JSX.Element | null;

+        renderTextures(onDebugSelectionChangeObservable: BABYLON.Observable<BABYLON.BaseTexture>): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -2786,6 +2826,16 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    export interface IButtonLineComponentProps {

+        label: string;

+        onClick: () => void;

+    }

+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

+        constructor(props: IButtonLineComponentProps);

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     interface IScenePropertyGridComponentProps {

     interface IScenePropertyGridComponentProps {

         globalState: GlobalState;

         globalState: GlobalState;

         scene: BABYLON.Scene;

         scene: BABYLON.Scene;

@@ -2802,6 +2852,7 @@ declare module INSPECTOR {
 
         updateEnvironmentTexture(file: File): void;

         updateEnvironmentTexture(file: File): void;

         updateGravity(newValue: BABYLON.Vector3): void;

         updateGravity(newValue: BABYLON.Vector3): void;

         updateTimeStep(newValue: number): void;

         updateTimeStep(newValue: number): void;

+        normalizeScene(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -2838,6 +2889,7 @@ declare module INSPECTOR {
 
     }

     }

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

     export class CommonShadowLightPropertyGridComponent extends React.Component<ICommonShadowLightPropertyGridComponentProps> {

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

         constructor(props: ICommonShadowLightPropertyGridComponentProps);

+        createShadowGenerator(): void;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -3025,16 +3077,6 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

-    export interface IButtonLineComponentProps {

-        label: string;

-        onClick: () => void;

-    }

-    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

-        constructor(props: IButtonLineComponentProps);

-        render(): JSX.Element;

-    }

-}

-declare module INSPECTOR {

     interface IAnimationGroupGridComponentProps {

     interface IAnimationGroupGridComponentProps {

         globalState: GlobalState;

         globalState: GlobalState;

         animationGroup: BABYLON.AnimationGroup;

         animationGroup: BABYLON.AnimationGroup;

@@ -3195,7 +3237,7 @@ declare module INSPECTOR {
 
     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

     export class PBRMetallicRoughnessMaterialPropertyGridComponent extends React.Component<IPBRMetallicRoughnessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

         constructor(props: IPBRMetallicRoughnessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -3210,7 +3252,7 @@ declare module INSPECTOR {
 
     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

     export class PBRSpecularGlossinessMaterialPropertyGridComponent extends React.Component<IPBRSpecularGlossinessMaterialPropertyGridComponentProps> {

         private _onDebugSelectionChangeObservable;

         private _onDebugSelectionChangeObservable;

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

         constructor(props: IPBRSpecularGlossinessMaterialPropertyGridComponentProps);

-        renderTextures(): JSX.Element | null;

+        renderTextures(): JSX.Element;

         render(): JSX.Element;

         render(): JSX.Element;

     }

     }

 }

 }

@@ -3402,6 +3444,20 @@ declare module INSPECTOR {
 
     }

     }

 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

+    interface INodeMaterialPropertyGridComponentProps {

+        globalState: GlobalState;

+        material: BABYLON.NodeMaterial;

+        lockObject: LockObject;

+        onSelectionChangedObservable?: BABYLON.Observable<any>;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class NodeMaterialPropertyGridComponent extends React.Component<INodeMaterialPropertyGridComponentProps> {

+        constructor(props: INodeMaterialPropertyGridComponentProps);

+        edit(): void;

+        render(): JSX.Element;

+    }

+}

+declare module INSPECTOR {

     export class PropertyGridTabComponent extends PaneComponent {

     export class PropertyGridTabComponent extends PaneComponent {

         private _timerIntervalId;

         private _timerIntervalId;

         private _lockObject;

         private _lockObject;

@@ -3478,7 +3534,7 @@ declare module INSPECTOR {
 
 }

 }

 declare module INSPECTOR {

 declare module INSPECTOR {

     interface IActionTabsComponentProps {

     interface IActionTabsComponentProps {

-        scene: BABYLON.Scene;

+        scene?: BABYLON.Scene;

         noCommands?: boolean;

         noCommands?: boolean;

         noHeader?: boolean;

         noHeader?: boolean;

         noExpand?: boolean;

         noExpand?: boolean;

@@ -3486,7 +3542,7 @@ declare module INSPECTOR {
 
         popupMode?: boolean;

         popupMode?: boolean;

         onPopup?: () => void;

         onPopup?: () => void;

         onClose?: () => void;

         onClose?: () => void;

-        globalState: GlobalState;

+        globalState?: GlobalState;

     }

     }

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

     export class ActionTabsComponent extends React.Component<IActionTabsComponentProps, {

         selectedEntity: any;

         selectedEntity: any;

@@ -3499,7 +3555,7 @@ declare module INSPECTOR {
 
         componentWillMount(): void;

         componentWillMount(): void;

         componentWillUnmount(): void;

         componentWillUnmount(): void;

         changeSelectedTab(index: number): void;

         changeSelectedTab(index: number): void;

-        renderContent(): JSX.Element;

+        renderContent(): JSX.Element | null;

         onClose(): void;

         onClose(): void;

         onPopup(): void;

         onPopup(): void;

         render(): JSX.Element;

         render(): JSX.Element;

@@ -3802,6 +3858,9 @@ declare module INSPECTOR {
 
         private _onPointerObserver;

         private _onPointerObserver;

         private _onSelectionChangeObserver;

         private _onSelectionChangeObserver;

         private _selectedEntity;

         private _selectedEntity;

+        private _posDragEnd;

+        private _scaleDragEnd;

+        private _rotateDragEnd;

         constructor(props: ISceneTreeItemComponentProps);

         constructor(props: ISceneTreeItemComponentProps);

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

         shouldComponentUpdate(nextProps: ISceneTreeItemComponentProps, nextState: {

             isSelected: boolean;

             isSelected: boolean;

@@ -3899,11 +3958,11 @@ declare module INSPECTOR {
 
         private static _CreateSceneExplorer;

         private static _CreateSceneExplorer;

         private static _CreateActionTabs;

         private static _CreateActionTabs;

         private static _CreateEmbedHost;

         private static _CreateEmbedHost;

-        private static _CreatePopup;

+        static _CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): BABYLON.Nullable<HTMLDivElement>;

         static readonly IsVisible: boolean;

         static readonly IsVisible: boolean;

         static EarlyAttachToLoader(): void;

         static EarlyAttachToLoader(): void;

         static Show(scene: BABYLON.Scene, userOptions: Partial<BABYLON.IInspectorOptions>): void;

         static Show(scene: BABYLON.Scene, userOptions: Partial<BABYLON.IInspectorOptions>): void;

-        private static _CreateCanvasContainer;

+        static _CreateCanvasContainer(parentControl: HTMLElement): void;

         private static _DestroyCanvasContainer;

         private static _DestroyCanvasContainer;

         private static _Cleanup;

         private static _Cleanup;

         private static _RemoveElementFromDOM;

         private static _RemoveElementFromDOM;

+ 9 - 7
dist/preview release/inspector/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-inspector",
 
     "name": "babylonjs-inspector",
 
     "description": "The Babylon.js inspector.",
 
     "description": "The Babylon.js inspector.",
 
-    "version": "4.0.2",
 
+    "version": "4.1.0-alpha.1",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -29,13 +29,15 @@
 
     ],
 
     ],
 
     "license": "Apache-2.0",
 
     "license": "Apache-2.0",
 
     "dependencies": {
 
     "dependencies": {
 
+        "babylonjs": "4.1.0-alpha.1",
 
+        "babylonjs-gui": "4.1.0-alpha.1",
 
+        "babylonjs-loaders": "4.1.0-alpha.1",
 
+        "babylonjs-serializers": "4.1.0-alpha.1",
 
+        "babylonjs-gltf2interface": "4.1.0-alpha.1"
 
+    },
 
+    "devDependencies": {
 
         "@types/react": "~16.7.3",
 
         "@types/react": "~16.7.3",
 
-        "@types/react-dom": "~16.0.9",
 
-        "babylonjs": "4.0.2",
 
-        "babylonjs-gui": "4.0.2",
 
-        "babylonjs-loaders": "4.0.2",
 
-        "babylonjs-serializers": "4.0.2",
 
-        "babylonjs-gltf2interface": "4.0.2"
 
+        "@types/react-dom": "~16.0.9"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

+ 7 - 4
dist/preview release/loaders/babylon.glTF1FileLoader.js
View File 

@@ -3169,8 +3169,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -3184,7 +3184,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -3200,7 +3200,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylon.glTF1FileLoader.js.map


File diff suppressed because it is too large
+ 2 - 2
dist/preview release/loaders/babylon.glTF1FileLoader.min.js


+ 20 - 13
dist/preview release/loaders/babylon.glTF2FileLoader.js
View File 

@@ -2062,10 +2062,10 @@ var GLTFLoader = /** @class */ (function () {
 
         else if (primitive.targets.length !== node._numMorphTargets) {

         else if (primitive.targets.length !== node._numMorphTargets) {

             throw new Error(context + ": Primitives do not have the same number of targets");

             throw new Error(context + ": Primitives do not have the same number of targets");

         }

         }

-        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"]();

+        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"](babylonMesh.getScene());

         for (var index = 0; index < primitive.targets.length; index++) {

         for (var index = 0; index < primitive.targets.length; index++) {

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

-            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight));

+            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight, babylonMesh.getScene()));

             // TODO: tell the target whether it has positions, normals, tangents

             // TODO: tell the target whether it has positions, normals, tangents

         }

         }

     };

     };

@@ -2098,28 +2098,32 @@ var GLTFLoader = /** @class */ (function () {
 
             }));

             }));

         };

         };

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

+            var positions = new Float32Array(data.length);

             babylonVertexBuffer.forEach(data.length, function (value, index) {

             babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+                positions[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setPositions(data);

+            babylonMorphTarget.setPositions(positions);

         });

         });

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

-            babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+            var normals = new Float32Array(data.length);

+            babylonVertexBuffer.forEach(normals.length, function (value, index) {

+                normals[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setNormals(data);

+            babylonMorphTarget.setNormals(normals);

         });

         });

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

+            var tangents = new Float32Array(data.length / 3 * 4);

             var dataIndex = 0;

             var dataIndex = 0;

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

                 // Tangent data for morph targets is stored as xyz delta.

                 // Tangent data for morph targets is stored as xyz delta.

                 // The vertexData.tangent is stored as xyzw.

                 // The vertexData.tangent is stored as xyzw.

                 // So we need to skip every fourth vertexData.tangent.

                 // So we need to skip every fourth vertexData.tangent.

                 if (((index + 1) % 4) !== 0) {

                 if (((index + 1) % 4) !== 0) {

-                    data[dataIndex++] += value;

+                    tangents[dataIndex] = data[dataIndex] + value;

+                    dataIndex++;

                 }

                 }

             });

             });

-            babylonMorphTarget.setTangents(data);

+            babylonMorphTarget.setTangents(tangents);

         });

         });

         return Promise.all(promises).then(function () { });

         return Promise.all(promises).then(function () { });

     };

     };

@@ -3869,8 +3873,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -3884,7 +3888,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -3900,7 +3904,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylon.glTF2FileLoader.js.map


File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylon.glTF2FileLoader.min.js


+ 20 - 13
dist/preview release/loaders/babylon.glTFFileLoader.js
View File 

@@ -4611,10 +4611,10 @@ var GLTFLoader = /** @class */ (function () {
 
         else if (primitive.targets.length !== node._numMorphTargets) {

         else if (primitive.targets.length !== node._numMorphTargets) {

             throw new Error(context + ": Primitives do not have the same number of targets");

             throw new Error(context + ": Primitives do not have the same number of targets");

         }

         }

-        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"]();

+        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"](babylonMesh.getScene());

         for (var index = 0; index < primitive.targets.length; index++) {

         for (var index = 0; index < primitive.targets.length; index++) {

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

-            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight));

+            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight, babylonMesh.getScene()));

             // TODO: tell the target whether it has positions, normals, tangents

             // TODO: tell the target whether it has positions, normals, tangents

         }

         }

     };

     };

@@ -4647,28 +4647,32 @@ var GLTFLoader = /** @class */ (function () {
 
             }));

             }));

         };

         };

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

+            var positions = new Float32Array(data.length);

             babylonVertexBuffer.forEach(data.length, function (value, index) {

             babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+                positions[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setPositions(data);

+            babylonMorphTarget.setPositions(positions);

         });

         });

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

-            babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+            var normals = new Float32Array(data.length);

+            babylonVertexBuffer.forEach(normals.length, function (value, index) {

+                normals[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setNormals(data);

+            babylonMorphTarget.setNormals(normals);

         });

         });

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

+            var tangents = new Float32Array(data.length / 3 * 4);

             var dataIndex = 0;

             var dataIndex = 0;

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

                 // Tangent data for morph targets is stored as xyz delta.

                 // Tangent data for morph targets is stored as xyz delta.

                 // The vertexData.tangent is stored as xyzw.

                 // The vertexData.tangent is stored as xyzw.

                 // So we need to skip every fourth vertexData.tangent.

                 // So we need to skip every fourth vertexData.tangent.

                 if (((index + 1) % 4) !== 0) {

                 if (((index + 1) % 4) !== 0) {

-                    data[dataIndex++] += value;

+                    tangents[dataIndex] = data[dataIndex] + value;

+                    dataIndex++;

                 }

                 }

             });

             });

-            babylonMorphTarget.setTangents(data);

+            babylonMorphTarget.setTangents(tangents);

         });

         });

         return Promise.all(promises).then(function () { });

         return Promise.all(promises).then(function () { });

     };

     };

@@ -6418,8 +6422,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -6433,7 +6437,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -6449,7 +6453,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylon.glTFFileLoader.js.map


File diff suppressed because it is too large
+ 2 - 2
dist/preview release/loaders/babylon.glTFFileLoader.min.js


+ 2 - 2
dist/preview release/loaders/babylonjs.loaders.d.ts
View File 

@@ -235,12 +235,12 @@ declare module BABYLON {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<BABYLON.GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: BABYLON.GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

+ 20 - 13
dist/preview release/loaders/babylonjs.loaders.js
View File 

@@ -5953,10 +5953,10 @@ var GLTFLoader = /** @class */ (function () {
 
         else if (primitive.targets.length !== node._numMorphTargets) {

         else if (primitive.targets.length !== node._numMorphTargets) {

             throw new Error(context + ": Primitives do not have the same number of targets");

             throw new Error(context + ": Primitives do not have the same number of targets");

         }

         }

-        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"]();

+        babylonMesh.morphTargetManager = new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTargetManager"](babylonMesh.getScene());

         for (var index = 0; index < primitive.targets.length; index++) {

         for (var index = 0; index < primitive.targets.length; index++) {

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

             var weight = node.weights ? node.weights[index] : mesh.weights ? mesh.weights[index] : 0;

-            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight));

+            babylonMesh.morphTargetManager.addTarget(new babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["MorphTarget"]("morphTarget" + index, weight, babylonMesh.getScene()));

             // TODO: tell the target whether it has positions, normals, tangents

             // TODO: tell the target whether it has positions, normals, tangents

         }

         }

     };

     };

@@ -5989,28 +5989,32 @@ var GLTFLoader = /** @class */ (function () {
 
             }));

             }));

         };

         };

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

         loadAttribute("POSITION", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].PositionKind, function (babylonVertexBuffer, data) {

+            var positions = new Float32Array(data.length);

             babylonVertexBuffer.forEach(data.length, function (value, index) {

             babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+                positions[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setPositions(data);

+            babylonMorphTarget.setPositions(positions);

         });

         });

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

         loadAttribute("NORMAL", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].NormalKind, function (babylonVertexBuffer, data) {

-            babylonVertexBuffer.forEach(data.length, function (value, index) {

-                data[index] += value;

+            var normals = new Float32Array(data.length);

+            babylonVertexBuffer.forEach(normals.length, function (value, index) {

+                normals[index] = data[index] + value;

             });

             });

-            babylonMorphTarget.setNormals(data);

+            babylonMorphTarget.setNormals(normals);

         });

         });

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

         loadAttribute("TANGENT", babylonjs_Misc_deferred__WEBPACK_IMPORTED_MODULE_0__["VertexBuffer"].TangentKind, function (babylonVertexBuffer, data) {

+            var tangents = new Float32Array(data.length / 3 * 4);

             var dataIndex = 0;

             var dataIndex = 0;

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

             babylonVertexBuffer.forEach(data.length / 3 * 4, function (value, index) {

                 // Tangent data for morph targets is stored as xyz delta.

                 // Tangent data for morph targets is stored as xyz delta.

                 // The vertexData.tangent is stored as xyzw.

                 // The vertexData.tangent is stored as xyzw.

                 // So we need to skip every fourth vertexData.tangent.

                 // So we need to skip every fourth vertexData.tangent.

                 if (((index + 1) % 4) !== 0) {

                 if (((index + 1) % 4) !== 0) {

-                    data[dataIndex++] += value;

+                    tangents[dataIndex] = data[dataIndex] + value;

+                    dataIndex++;

                 }

                 }

             });

             });

-            babylonMorphTarget.setTangents(data);

+            babylonMorphTarget.setTangents(tangents);

         });

         });

         return Promise.all(promises).then(function () { });

         return Promise.all(promises).then(function () { });

     };

     };

@@ -7760,8 +7764,8 @@ var GLTFFileLoader = /** @class */ (function () {
 
     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

     GLTFFileLoader.prototype._parseAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         return Promise.resolve().then(function () {

         return Promise.resolve().then(function () {

-            var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

-            return _this._validateAsync(scene, unpacked.json, rootUrl, fileName).then(function () {

+            return _this._validateAsync(scene, data, rootUrl, fileName).then(function () {

+                var unpacked = (data instanceof ArrayBuffer) ? _this._unpackBinary(data) : { json: data, bin: null };

                 _this._startPerformanceCounter("Parse JSON");

                 _this._startPerformanceCounter("Parse JSON");

                 _this._log("JSON length: " + unpacked.json.length);

                 _this._log("JSON length: " + unpacked.json.length);

                 var loaderData = {

                 var loaderData = {

@@ -7775,7 +7779,7 @@ var GLTFFileLoader = /** @class */ (function () {
 
             });

             });

         });

         });

     };

     };

-    GLTFFileLoader.prototype._validateAsync = function (scene, json, rootUrl, fileName) {

+    GLTFFileLoader.prototype._validateAsync = function (scene, data, rootUrl, fileName) {

         var _this = this;

         var _this = this;

         if (!this.validate || typeof GLTFValidator === "undefined") {

         if (!this.validate || typeof GLTFValidator === "undefined") {

             return Promise.resolve();

             return Promise.resolve();

@@ -7791,7 +7795,10 @@ var GLTFFileLoader = /** @class */ (function () {
 
         if (fileName && fileName.substr(0, 5) !== "data:") {

         if (fileName && fileName.substr(0, 5) !== "data:") {

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

             options.uri = (rootUrl === "file:" ? fileName : "" + rootUrl + fileName);

         }

         }

-        return GLTFValidator.validateString(json, options).then(function (result) {

+        var promise = (data instanceof ArrayBuffer)

+            ? GLTFValidator.validateBytes(new Uint8Array(data), options)

+            : GLTFValidator.validateString(data, options);

+        return promise.then(function (result) {

             _this._endPerformanceCounter("Validate JSON");

             _this._endPerformanceCounter("Validate JSON");

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.notifyObservers(result);

             _this.onValidatedObservable.clear();

             _this.onValidatedObservable.clear();

File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylonjs.loaders.js.map


File diff suppressed because it is too large
+ 1 - 1
dist/preview release/loaders/babylonjs.loaders.min.js


+ 28 - 28
dist/preview release/loaders/babylonjs.loaders.module.d.ts
View File 

@@ -1,5 +1,4 @@
 
 declare module "babylonjs-loaders/glTF/glTFFileLoader" {

 declare module "babylonjs-loaders/glTF/glTFFileLoader" {

-    import { IGLTFValidationResults } from "babylonjs-gltf2interface";

     import { Nullable } from "babylonjs/types";

     import { Nullable } from "babylonjs/types";

     import { Observable } from "babylonjs/Misc/observable";

     import { Observable } from "babylonjs/Misc/observable";

     import { Camera } from "babylonjs/Cameras/camera";

     import { Camera } from "babylonjs/Cameras/camera";

@@ -12,6 +11,7 @@ declare module "babylonjs-loaders/glTF/glTFFileLoader" {
 
     import { ISceneLoaderPluginFactory, ISceneLoaderPlugin, ISceneLoaderPluginAsync, SceneLoaderProgressEvent, ISceneLoaderPluginExtensions } from "babylonjs/Loading/sceneLoader";

     import { ISceneLoaderPluginFactory, ISceneLoaderPlugin, ISceneLoaderPluginAsync, SceneLoaderProgressEvent, ISceneLoaderPluginExtensions } from "babylonjs/Loading/sceneLoader";

     import { AssetContainer } from "babylonjs/assetContainer";

     import { AssetContainer } from "babylonjs/assetContainer";

     import { Scene, IDisposable } from "babylonjs/scene";

     import { Scene, IDisposable } from "babylonjs/scene";

+    import * as GLTF2 from "babylonjs-gltf2interface";

     /**

     /**

      * Mode that determines the coordinate system to use.

      * Mode that determines the coordinate system to use.

      */

      */

@@ -248,12 +248,12 @@ declare module "babylonjs-loaders/glTF/glTFFileLoader" {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

@@ -994,7 +994,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     import { Buffer, VertexBuffer } from "babylonjs/Meshes/buffer";

     import { Buffer, VertexBuffer } from "babylonjs/Meshes/buffer";

     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";

     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";

     import { Mesh } from "babylonjs/Meshes/mesh";

     import { Mesh } from "babylonjs/Meshes/mesh";

-    import * as IGLTF2 from "babylonjs-gltf2interface";

+    import * as GLTF2 from "babylonjs-gltf2interface";

     /**

     /**

      * Loader interface with an index field.

      * Loader interface with an index field.

      */

      */

@@ -1007,7 +1007,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAccessor extends IGLTF2.IAccessor, IArrayItem {

+    export interface IAccessor extends GLTF2.IAccessor, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

         /** @hidden */

         /** @hidden */

@@ -1016,25 +1016,25 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimationChannel extends IGLTF2.IAnimationChannel, IArrayItem {

+    export interface IAnimationChannel extends GLTF2.IAnimationChannel, IArrayItem {

     }

     }

     /** @hidden */

     /** @hidden */

     export interface _IAnimationSamplerData {

     export interface _IAnimationSamplerData {

         input: Float32Array;

         input: Float32Array;

-        interpolation: IGLTF2.AnimationSamplerInterpolation;

+        interpolation: GLTF2.AnimationSamplerInterpolation;

         output: Float32Array;

         output: Float32Array;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimationSampler extends IGLTF2.IAnimationSampler, IArrayItem {

+    export interface IAnimationSampler extends GLTF2.IAnimationSampler, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<_IAnimationSamplerData>;

         _data?: Promise<_IAnimationSamplerData>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IAnimation extends IGLTF2.IAnimation, IArrayItem {

+    export interface IAnimation extends GLTF2.IAnimation, IArrayItem {

         channels: IAnimationChannel[];

         channels: IAnimationChannel[];

         samplers: IAnimationSampler[];

         samplers: IAnimationSampler[];

         /** @hidden */

         /** @hidden */

@@ -1043,14 +1043,14 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IBuffer extends IGLTF2.IBuffer, IArrayItem {

+    export interface IBuffer extends GLTF2.IBuffer, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IBufferView extends IGLTF2.IBufferView, IArrayItem {

+    export interface IBufferView extends GLTF2.IBufferView, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

         /** @hidden */

         /** @hidden */

@@ -1059,36 +1059,36 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ICamera extends IGLTF2.ICamera, IArrayItem {

+    export interface ICamera extends GLTF2.ICamera, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IImage extends IGLTF2.IImage, IArrayItem {

+    export interface IImage extends GLTF2.IImage, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: Promise<ArrayBufferView>;

         _data?: Promise<ArrayBufferView>;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialNormalTextureInfo extends IGLTF2.IMaterialNormalTextureInfo, ITextureInfo {

+    export interface IMaterialNormalTextureInfo extends GLTF2.IMaterialNormalTextureInfo, ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialOcclusionTextureInfo extends IGLTF2.IMaterialOcclusionTextureInfo, ITextureInfo {

+    export interface IMaterialOcclusionTextureInfo extends GLTF2.IMaterialOcclusionTextureInfo, ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterialPbrMetallicRoughness extends IGLTF2.IMaterialPbrMetallicRoughness {

+    export interface IMaterialPbrMetallicRoughness extends GLTF2.IMaterialPbrMetallicRoughness {

         baseColorTexture?: ITextureInfo;

         baseColorTexture?: ITextureInfo;

         metallicRoughnessTexture?: ITextureInfo;

         metallicRoughnessTexture?: ITextureInfo;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMaterial extends IGLTF2.IMaterial, IArrayItem {

+    export interface IMaterial extends GLTF2.IMaterial, IArrayItem {

         pbrMetallicRoughness?: IMaterialPbrMetallicRoughness;

         pbrMetallicRoughness?: IMaterialPbrMetallicRoughness;

         normalTexture?: IMaterialNormalTextureInfo;

         normalTexture?: IMaterialNormalTextureInfo;

         occlusionTexture?: IMaterialOcclusionTextureInfo;

         occlusionTexture?: IMaterialOcclusionTextureInfo;

@@ -1105,13 +1105,13 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMesh extends IGLTF2.IMesh, IArrayItem {

+    export interface IMesh extends GLTF2.IMesh, IArrayItem {

         primitives: IMeshPrimitive[];

         primitives: IMeshPrimitive[];

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IMeshPrimitive extends IGLTF2.IMeshPrimitive, IArrayItem {

+    export interface IMeshPrimitive extends GLTF2.IMeshPrimitive, IArrayItem {

         /** @hidden */

         /** @hidden */

         _instanceData?: {

         _instanceData?: {

             babylonSourceMesh: Mesh;

             babylonSourceMesh: Mesh;

@@ -1121,7 +1121,7 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface INode extends IGLTF2.INode, IArrayItem {

+    export interface INode extends GLTF2.INode, IArrayItem {

         /**

         /**

          * The parent glTF node.

          * The parent glTF node.

          */

          */

@@ -1145,19 +1145,19 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ISampler extends IGLTF2.ISampler, IArrayItem {

+    export interface ISampler extends GLTF2.ISampler, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: _ISamplerData;

         _data?: _ISamplerData;

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IScene extends IGLTF2.IScene, IArrayItem {

+    export interface IScene extends GLTF2.IScene, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ISkin extends IGLTF2.ISkin, IArrayItem {

+    export interface ISkin extends GLTF2.ISkin, IArrayItem {

         /** @hidden */

         /** @hidden */

         _data?: {

         _data?: {

             babylonSkeleton: Skeleton;

             babylonSkeleton: Skeleton;

@@ -1167,17 +1167,17 @@ declare module "babylonjs-loaders/glTF/2.0/glTFLoaderInterfaces" {
 
     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ITexture extends IGLTF2.ITexture, IArrayItem {

+    export interface ITexture extends GLTF2.ITexture, IArrayItem {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface ITextureInfo extends IGLTF2.ITextureInfo {

+    export interface ITextureInfo extends GLTF2.ITextureInfo {

     }

     }

     /**

     /**

      * Loader interface with additional members.

      * Loader interface with additional members.

      */

      */

-    export interface IGLTF extends IGLTF2.IGLTF {

+    export interface IGLTF extends GLTF2.IGLTF {

         accessors?: IAccessor[];

         accessors?: IAccessor[];

         animations?: IAnimation[];

         animations?: IAnimation[];

         buffers?: IBuffer[];

         buffers?: IBuffer[];

@@ -2536,12 +2536,12 @@ declare module BABYLON {
 
         /**

         /**

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          * Observable raised after validation when validate is set to true. The event data is the result of the validation.

          */

          */

-        readonly onValidatedObservable: Observable<IGLTFValidationResults>;

+        readonly onValidatedObservable: Observable<BABYLON.GLTF2.IGLTFValidationResults>;

         private _onValidatedObserver;

         private _onValidatedObserver;

         /**

         /**

          * Callback raised after a loader extension is created.

          * Callback raised after a loader extension is created.

          */

          */

-        onValidated: (results: IGLTFValidationResults) => void;

+        onValidated: (results: BABYLON.GLTF2.IGLTFValidationResults) => void;

         private _loader;

         private _loader;

         /**

         /**

          * Name of the loader ("gltf")

          * Name of the loader ("gltf")

+ 3 - 3
dist/preview release/loaders/package.json
View File 

@@ -4,7 +4,7 @@
 
     },
 
     },
 
     "name": "babylonjs-loaders",
 
     "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.",
 
     "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.0.2",
 
+    "version": "4.1.0-alpha.1",
 
     "repository": {
 
     "repository": {
 
         "type": "git",
 
         "type": "git",
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
         "url": "https://github.com/BabylonJS/Babylon.js.git"
 
@@ -28,8 +28,8 @@
 
     ],
 
     ],
 
     "license": "Apache-2.0",
 
     "license": "Apache-2.0",
 
     "dependencies": {
 
     "dependencies": {
 
-        "babylonjs-gltf2interface": "4.0.2",
 
-        "babylonjs": "4.0.2"
 
+        "babylonjs-gltf2interface": "4.1.0-alpha.1",
 
+        "babylonjs": "4.1.0-alpha.1"
 
     },
 
     },
 
     "engines": {
 
     "engines": {
 
         "node": "*"
 
         "node": "*"

+ 2 - 2
dist/preview release/materialsLibrary/package.json
View File 

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

+ 609 - 0
dist/preview release/nodeEditor/babylon.nodeEditor.d.ts
View File 

@@ -0,0 +1,609 @@
 
+/// <reference types="react" />

+declare module NODEEDITOR {

+    /**

+     * Port model

+     */

+    export class DefaultPortModel extends PortModel {

+        /**

+         * If the port is input or output

+         */

+        position: string | "input" | "output";

+        /**

+         * What the port is connected to

+         */

+        connection: BABYLON.Nullable<BABYLON.NodeMaterialConnectionPoint>;

+        static idCounter: number;

+        constructor(name: string, type?: string);

+        syncWithNodeMaterialConnectionPoint(connection: BABYLON.NodeMaterialConnectionPoint): void;

+        getNodeModel(): DefaultNodeModel;

+        link(outPort: DefaultPortModel): LinkModel<import("storm-react-diagrams").LinkModelListener>;

+        getInputFromBlock(): void;

+        createLinkModel(): LinkModel;

+        getValue: Function;

+        static SortInputOutput(a: BABYLON.Nullable<DefaultPortModel>, b: BABYLON.Nullable<DefaultPortModel>): {

+            input: DefaultPortModel;

+            output: DefaultPortModel;

+        } | null;

+    }

+}

+declare module NODEEDITOR {

+    interface ITextLineComponentProps {

+        label: string;

+        value: string;

+        color?: string;

+        underline?: boolean;

+        onLink?: () => void;

+    }

+    export class TextLineComponent extends React.Component<ITextLineComponentProps> {

+        constructor(props: ITextLineComponentProps);

+        onLink(): void;

+        renderContent(): JSX.Element;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Generic node model which stores information about a node editor block

+     */

+    export class GenericNodeModel extends DefaultNodeModel {

+        /**

+         * Labels for the block

+         */

+        header: string;

+        /**

+         * BABYLON.Vector2 for the node if it exists

+         */

+        vector2: BABYLON.Nullable<BABYLON.Vector2>;

+        /**

+         * BABYLON.Vector3 for the node if it exists

+         */

+        vector3: BABYLON.Nullable<BABYLON.Vector3>;

+        /**

+         * BABYLON.Vector4 for the node if it exists

+         */

+        vector4: BABYLON.Nullable<BABYLON.Vector4>;

+        /**

+         * BABYLON.Matrix for the node if it exists

+         */

+        matrix: BABYLON.Nullable<BABYLON.Matrix>;

+        /**

+         * Constructs the node model

+         */

+        constructor();

+        prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;

+        renderProperties(globalState: GlobalState): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * GenericNodeWidgetProps

+     */

+    export interface GenericNodeWidgetProps {

+        node: BABYLON.Nullable<GenericNodeModel>;

+        globalState: GlobalState;

+    }

+    /**

+     * GenericNodeWidgetState

+     */

+    export interface GenericNodeWidgetState {

+    }

+    /**

+     * Used to display a node block for the node editor

+     */

+    export class GenericNodeWidget extends React.Component<GenericNodeWidgetProps, GenericNodeWidgetState> {

+        /**

+         * Creates a GenericNodeWidget

+         * @param props

+         */

+        constructor(props: GenericNodeWidgetProps);

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Node factory which creates editor nodes

+     */

+    export class GenericNodeFactory extends SRD.AbstractNodeFactory {

+        private _globalState;

+        /**

+         * Constructs a GenericNodeFactory

+         */

+        constructor(globalState: GlobalState);

+        /**

+         * Generates a node widget

+         * @param diagramEngine diagram engine

+         * @param node node to generate

+         * @returns node widget jsx

+         */

+        generateReactWidget(diagramEngine: SRD.DiagramEngine, node: GenericNodeModel): JSX.Element;

+        /**

+         * Gets a new instance of a node model

+         * @returns generic node model

+         */

+        getNewInstance(): GenericNodeModel;

+    }

+}

+declare module NODEEDITOR {

+    interface ILineContainerComponentProps {

+        title: string;

+        children: any[] | any;

+        closed?: boolean;

+    }

+    export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {

+        isExpanded: boolean;

+    }> {

+        private static _InMemoryStorage;

+        constructor(props: ILineContainerComponentProps);

+        switchExpandedState(): void;

+        renderHeader(): JSX.Element;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    export interface IButtonLineComponentProps {

+        label: string;

+        onClick: () => void;

+    }

+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {

+        constructor(props: IButtonLineComponentProps);

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface INodeListComponentProps {

+        globalState: GlobalState;

+        onAddValueNode: (b: string) => void;

+        onAddNodeFromClass: (ObjectClass: typeof BABYLON.NodeMaterialBlock) => void;

+    }

+    export class NodeListComponent extends React.Component<INodeListComponentProps> {

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IPropertyTabComponentProps {

+        globalState: GlobalState;

+    }

+    export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, {

+        currentNode: BABYLON.Nullable<DefaultNodeModel>;

+    }> {

+        constructor(props: IPropertyTabComponentProps);

+        componentWillMount(): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IPortalProps {

+        globalState: GlobalState;

+    }

+    export class Portal extends React.Component<IPortalProps> {

+        render(): React.ReactPortal;

+    }

+}

+declare module NODEEDITOR {

+    interface IFileButtonLineComponentProps {

+        label: string;

+        onClick: (file: File) => void;

+        accept: string;

+    }

+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {

+        constructor(props: IFileButtonLineComponentProps);

+        onChange(evt: any): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface ITexturePropertyTabComponentProps {

+        globalState: GlobalState;

+        node: TextureNodeModel;

+    }

+    export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps> {

+        /**

+         * Replaces the texture of the node

+         * @param file the file of the texture to use

+         */

+        replaceTexture(file: File): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * BABYLON.Texture node model which stores information about a node editor block

+     */

+    export class TextureNodeModel extends DefaultNodeModel {

+        /**

+         * BABYLON.Texture for the node if it exists

+         */

+        texture: BABYLON.Nullable<BABYLON.Texture>;

+        /**

+         * Constructs the node model

+         */

+        constructor();

+        renderProperties(globalState: GlobalState): JSX.Element;

+        prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;

+    }

+}

+declare module NODEEDITOR {

+    interface ITextureLineComponentProps {

+        texture: BABYLON.BaseTexture;

+        width: number;

+        height: number;

+        globalState?: any;

+        hideChannelSelect?: boolean;

+    }

+    export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {

+        displayRed: boolean;

+        displayGreen: boolean;

+        displayBlue: boolean;

+        displayAlpha: boolean;

+        face: number;

+    }> {

+        constructor(props: ITextureLineComponentProps);

+        shouldComponentUpdate(nextProps: ITextureLineComponentProps, nextState: {

+            displayRed: boolean;

+            displayGreen: boolean;

+            displayBlue: boolean;

+            displayAlpha: boolean;

+            face: number;

+        }): boolean;

+        componentDidMount(): void;

+        componentDidUpdate(): void;

+        updatePreview(): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * GenericNodeWidgetProps

+     */

+    export interface TextureNodeWidgetProps {

+        node: BABYLON.Nullable<TextureNodeModel>;

+        globalState: GlobalState;

+    }

+    /**

+     * Used to display a node block for the node editor

+     */

+    export class TextureNodeWidget extends React.Component<TextureNodeWidgetProps> {

+        /**

+         * Creates a GenericNodeWidget

+         * @param props

+         */

+        constructor(props: TextureNodeWidgetProps);

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Node factory which creates editor nodes

+     */

+    export class TextureNodeFactory extends SRD.AbstractNodeFactory {

+        private _globalState;

+        /**

+         * Constructs a TextureNodeFactory

+         */

+        constructor(globalState: GlobalState);

+        /**

+         * Generates a node widget

+         * @param diagramEngine diagram engine

+         * @param node node to generate

+         * @returns node widget jsx

+         */

+        generateReactWidget(diagramEngine: SRD.DiagramEngine, node: TextureNodeModel): JSX.Element;

+        /**

+         * Gets a new instance of a node model

+         * @returns texture node model

+         */

+        getNewInstance(): TextureNodeModel;

+    }

+}

+declare module NODEEDITOR {

+    interface INumericInputComponentProps {

+        label: string;

+        value: number;

+        step?: number;

+        onChange: (value: number) => void;

+    }

+    export class NumericInputComponent extends React.Component<INumericInputComponentProps, {

+        value: string;

+    }> {

+        static defaultProps: {

+            step: number;

+        };

+        private _localChange;

+        constructor(props: INumericInputComponentProps);

+        shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {

+            value: string;

+        }): boolean;

+        updateValue(evt: any): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    export class PropertyChangedEvent {

+        object: any;

+        property: string;

+        value: any;

+        initialValue: any;

+    }

+}

+declare module NODEEDITOR {

+    interface IVector2LineComponentProps {

+        label: string;

+        target: any;

+        propertyName: string;

+        step?: number;

+        onChange?: (newvalue: BABYLON.Vector2) => void;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {

+        isExpanded: boolean;

+        value: BABYLON.Vector2;

+    }> {

+        static defaultProps: {

+            step: number;

+        };

+        private _localChange;

+        constructor(props: IVector2LineComponentProps);

+        shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {

+            isExpanded: boolean;

+            value: BABYLON.Vector2;

+        }): boolean;

+        switchExpandState(): void;

+        raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;

+        updateStateX(value: number): void;

+        updateStateY(value: number): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IVector2PropertyTabComponentProps {

+        globalState: GlobalState;

+        connection: BABYLON.NodeMaterialConnectionPoint;

+    }

+    export class Vector2PropertyTabComponent extends React.Component<IVector2PropertyTabComponentProps> {

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IVector3LineComponentProps {

+        label: string;

+        target: any;

+        propertyName: string;

+        step?: number;

+        onChange?: (newvalue: BABYLON.Vector3) => void;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {

+        isExpanded: boolean;

+        value: BABYLON.Vector3;

+    }> {

+        static defaultProps: {

+            step: number;

+        };

+        private _localChange;

+        constructor(props: IVector3LineComponentProps);

+        shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {

+            isExpanded: boolean;

+            value: BABYLON.Vector3;

+        }): boolean;

+        switchExpandState(): void;

+        raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;

+        updateVector3(): void;

+        updateStateX(value: number): void;

+        updateStateY(value: number): void;

+        updateStateZ(value: number): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IVector3PropertyTabComponentProps {

+        globalState: GlobalState;

+        connection: BABYLON.NodeMaterialConnectionPoint;

+    }

+    export class Vector3PropertyTabComponent extends React.Component<IVector3PropertyTabComponentProps> {

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    export interface ICheckBoxLineComponentProps {

+        label: string;

+        target?: any;

+        propertyName?: string;

+        isSelected?: () => boolean;

+        onSelect?: (value: boolean) => void;

+        onValueChanged?: () => void;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {

+        isSelected: boolean;

+    }> {

+        private static _UniqueIdSeed;

+        private _uniqueId;

+        private _localChange;

+        constructor(props: ICheckBoxLineComponentProps);

+        shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {

+            isSelected: boolean;

+        }): boolean;

+        onChange(): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    class ListLineOption {

+        label: string;

+        value: number;

+    }

+    interface IOptionsLineComponentProps {

+        label: string;

+        target: any;

+        propertyName: string;

+        options: ListLineOption[];

+        noDirectUpdate?: boolean;

+        onSelect?: (value: number) => void;

+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;

+    }

+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {

+        value: number;

+    }> {

+        private _localChange;

+        constructor(props: IOptionsLineComponentProps);

+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {

+            value: number;

+        }): boolean;

+        raiseOnPropertyChanged(newValue: number, previousValue: number): void;

+        updateValue(valueString: string): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    interface IInputPropertyTabComponentProps {

+        globalState: GlobalState;

+        inputNode: InputNodeModel;

+    }

+    export class InputPropertyTabComponentProps extends React.Component<IInputPropertyTabComponentProps> {

+        constructor(props: IInputPropertyTabComponentProps);

+        renderValue(globalState: GlobalState): JSX.Element | null;

+        setDefaultValue(): void;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Generic node model which stores information about a node editor block

+     */

+    export class InputNodeModel extends DefaultNodeModel {

+        connection?: BABYLON.NodeMaterialConnectionPoint;

+        /**

+         * Constructs the node model

+         */

+        constructor();

+        renderProperties(globalState: GlobalState): JSX.Element | null;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * GenericNodeWidgetProps

+     */

+    export interface InputNodeWidgetProps {

+        node: BABYLON.Nullable<InputNodeModel>;

+        globalState: GlobalState;

+    }

+    /**

+     * Used to display a node block for the node editor

+     */

+    export class InputNodeWidget extends React.Component<InputNodeWidgetProps> {

+        /**

+         * Creates a GenericNodeWidget

+         * @param props

+         */

+        constructor(props: InputNodeWidgetProps);

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Node factory which creates editor nodes

+     */

+    export class InputNodeFactory extends SRD.AbstractNodeFactory {

+        private _globalState;

+        /**

+         * Constructs a GenericNodeFactory

+         */

+        constructor(globalState: GlobalState);

+        /**

+         * Generates a node widget

+         * @param diagramEngine diagram engine

+         * @param node node to generate

+         * @returns node widget jsx

+         */

+        generateReactWidget(diagramEngine: SRD.DiagramEngine, node: InputNodeModel): JSX.Element;

+        /**

+         * Gets a new instance of a node model

+         * @returns input node model

+         */

+        getNewInstance(): InputNodeModel;

+    }

+}

+declare module NODEEDITOR {

+    interface IGraphEditorProps {

+        globalState: GlobalState;

+    }

+    export class NodeCreationOptions {

+        column: number;

+        nodeMaterialBlock?: BABYLON.NodeMaterialBlock;

+        type?: string;

+        connection?: BABYLON.NodeMaterialConnectionPoint;

+    }

+    export class GraphEditor extends React.Component<IGraphEditorProps> {

+        private _engine;

+        private _model;

+        private _nodes;

+        /**

+         * Current row/column position used when adding new nodes

+         */

+        private _rowPos;

+        /**

+         * Creates a node and recursivly creates its parent nodes from it's input

+         * @param nodeMaterialBlock

+         */

+        createNodeFromObject(options: NodeCreationOptions): DefaultNodeModel;

+        componentDidMount(): void;

+        componentWillUnmount(): void;

+        constructor(props: IGraphEditorProps);

+        addNodeFromClass(ObjectClass: typeof BABYLON.NodeMaterialBlock): DefaultNodeModel;

+        addValueNode(type: string, column?: number, connection?: BABYLON.NodeMaterialConnectionPoint): DefaultNodeModel;

+        render(): JSX.Element;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Generic node model which stores information about a node editor block

+     */

+    export class DefaultNodeModel extends NodeModel {

+        /**

+         * The babylon block this node represents

+         */

+        block: BABYLON.Nullable<BABYLON.NodeMaterialBlock>;

+        ports: {

+            [s: string]: DefaultPortModel;

+        };

+        /**

+         * Constructs the node model

+         */

+        constructor(key: string);

+        prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;

+        renderProperties(globalState: GlobalState): JSX.Element | null;

+    }

+}

+declare module NODEEDITOR {

+    export class GlobalState {

+        nodeMaterial?: BABYLON.NodeMaterial;

+        hostElement: HTMLElement;

+        hostDocument: HTMLDocument;

+        onSelectionChangedObservable: BABYLON.Observable<BABYLON.Nullable<DefaultNodeModel>>;

+        onRebuildRequiredObservable: BABYLON.Observable<void>;

+    }

+}

+declare module NODEEDITOR {

+    export class Popup {

+        static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;

+        private static _CopyStyles;

+    }

+}

+declare module NODEEDITOR {

+    /**

+     * Interface used to specify creation options for the node editor

+     */

+    export interface INodeEditorOptions {

+        nodeMaterial: BABYLON.NodeMaterial;

+    }

+    /**

+     * Class used to create a node editor

+     */

+    export class NodeEditor {

+        /**

+         * Show the node editor

+         * @param options defines the options to use to configure the node editor

+         */

+        static Show(options: INodeEditorOptions): void;

+    }

+}

File diff suppressed because it is too large
+ 41 - 0
dist/preview release/nodeEditor/babylon.nodeEditor.js


File diff suppressed because it is too large
+ 49372 - 0
dist/preview release/nodeEditor/babylon.nodeEditor.max.js


File diff suppressed because it is too large
+ 1 - 0
dist/preview release/nodeEditor/babylon.nodeEditor.max.js.map


File diff suppressed because it is too large
+ 1325 - 0
dist/preview release/nodeEditor/babylon.nodeEditor.module.d.ts


+ 0 - 0
dist/preview release/nodeEditor/package.json
View File


Some files were not shown because too many files changed in this diff