Главная Обзор Помощь
Регистрация Вход
zhangyupeng
/
Babylon.js
1
0
Ответвить 0
Файлы Обсуждения 0 Запросы на слияние 0 Вики
Просмотр исходного кода

version!

David `Deltakosh` Catuhe 5 лет назад
Родитель
f582df74aa
Сommit
a8edd3cec4
6 измененных файлов с 195 добавлено и 4 удалено
Разделённый вид Показать статистику Diff
  1. 0 1
      Playground/index-local.html
  2. 85 0
      Playground/index.html
  3. 86 2
      Playground/index.js
  4. 17 0
      Playground/src/components/commandBarComponent.tsx
  5. 2 1
      Playground/src/components/commandDropdownComponent.tsx
  6. 5 0
      Playground/src/scss/commandBar.scss

+ 0 - 1
Playground/index-local.html
Просмотреть файл 

@@ -31,7 +31,6 @@
 
         <script src="/dist/preview%20release/Oimo.js"></script>

         <script src="/dist/preview%20release/libktx.js"></script>

         <script src="/dist/preview%20release/earcut.min.js"></script>

-        <!-- Monaco -->

         

         <!-- Babylon.js -->

         <script src="/Tools/DevLoader/BabylonLoader.js"></script>

+ 85 - 0
Playground/index.html
Просмотреть файл 

@@ -0,0 +1,85 @@
 
+<!DOCTYPE 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/favicon.ico">

+        <meta name="description" content="Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes">

+        <meta name="keywords" content="Babylon.js,WebGL,3D">

+        

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

+        <link rel="stylesheet"

+            href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css" />

+

+        <!-- Pep -->

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

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

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

+

+        <!-- DatGUI -->

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

+        <!-- jszip -->

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

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

+

+        <!-- Dependencies -->

+        <script src="/dist/preview%20release/ammo.js"></script>

+        <script src="/dist/preview%20release/recast.js"></script>

+        <script src="/dist/preview%20release/cannon.js"></script>

+        <script src="/dist/preview%20release/Oimo.js"></script>

+        <script src="/dist/preview%20release/libktx.js"></script>

+        <script src="/dist/preview%20release/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/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.min.js"></script>

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

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

+

+         <!-- Extensions -->

+         <script

+             src="https://rawcdn.githack.com/BabylonJS/Extensions/f43ab677b4bca0a6ab77132d3f785be300382760/ClonerSystem/src/babylonx.cloner.js"

+             >

+         </script>

+         <script

+             src="https://rawcdn.githack.com/BabylonJS/Extensions/785013ec55b210d12263c91f3f0a2ae70cf0bc8a/CompoundShader/src/babylonx.CompoundShader.js"

+             ></script>

+ 

+         <!-- Scene Manager -->

+         <script

+             src="https://rawcdn.githack.com/MackeyK24/MackeyK24.github.io/14fda491c50cfca6d3e2f6cbc5e6afe22cc455d6/toolkit/babylon.manager.js">

+         </script>

+         <script

+             src="https://rawcdn.githack.com/MackeyK24/MackeyK24.github.io/14fda491c50cfca6d3e2f6cbc5e6afe22cc455d6/toolkit/babylon.navmesh.js">

+         </script>        

+

+        <style>

+            html,

+            body,

+            #host-element {

+                width: 100%;

+                height: 100%;

+                padding: 0;

+                margin: 0;

+                overflow: hidden;

+            }

+        </style>        

+    </head>

+

+    <body>        

+        <div id="host-element">

+        </div>   

+        

+        <script src="dist/babylon.playground.js"></script>

+        

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

+    </body>

+

+</html>

+ 86 - 2
Playground/index.js
Просмотреть файл 

@@ -1,3 +1,87 @@
 
-var hostElement = document.getElementById("host-element");

+// Version 

+var Versions = {

+    "Latest": [

+        "https://preview.babylonjs.com/babylon.js",

+        "https://preview.babylonjs.com/gui/babylon.gui.min.js",

+        "https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js",

+        "https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js",

+        "https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js",

+        "https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js",

+        "https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js",

+        "https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js",

+        "https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"

+    ],

+    "4.1.0": [

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/babylon.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/gui/babylon.gui.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/inspector/babylon.inspector.bundle.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/materialsLibrary/babylonjs.materials.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/postProcessesLibrary/babylonjs.postProcess.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/loaders/babylonjs.loaders.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.1.0/dist/serializers/babylonjs.serializers.min.js"

+    ],

+    "4.0.3": [

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/babylon.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/gui/babylon.gui.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/inspector/babylon.inspector.bundle.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/materialsLibrary/babylonjs.materials.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/postProcessesLibrary/babylonjs.postProcess.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/loaders/babylonjs.loaders.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@4.0.3/dist/serializers/babylonjs.serializers.min.js"

+    ],

+    "3.3": [

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/babylon.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/gui/babylon.gui.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/inspector/babylon.inspector.bundle.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/materialsLibrary/babylonjs.materials.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/postProcessesLibrary/babylonjs.postProcess.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/loaders/babylonjs.loaders.min.js",

+        "https://cdn.jsdelivr.net/gh/BabylonJS/Babylon.js@3.3.0/dist/serializers/babylonjs.serializers.min.js"

+    ]

+};

 

-BABYLON.Playground.Show(hostElement);
 
+let loadScriptAsync = function(url) {

+    return new Promise((resolve, reject) => {

+        let script = document.createElement('script');

+        script.src = url;

+        script.onload = () => {

+            resolve();

+        }

+        document.head.appendChild(script);

+    });

+}

+

+let readStringFromStore = function(key, defaultValue) {

+    if (localStorage.getItem(key) === null) {

+        return defaultValue;

+    }

+

+    return localStorage.getItem(key);

+}

+

+let checkBabylonVersionAsync= function () {

+    let version = BABYLON.Engine.Version;

+    let activeVersion = readStringFromStore("version", version);

+

+    if (activeVersion === "Latest") {

+        return Promise.resolve();

+    }

+

+    let tasks = [];

+

+    for (var file of Versions[activeVersion]) {

+        tasks.push(loadScriptAsync(file));

+    }

+

+    return Promise.all(tasks);

+}

+

+checkBabylonVersionAsync().then(() => {

+    loadScriptAsync("dist/babylon.playground.js").then(() => {

+        var hostElement = document.getElementById("host-element");

+        BABYLON.Playground.Show(hostElement);

+    });

+});

+ 17 - 0
Playground/src/components/commandBarComponent.tsx
Просмотреть файл 

@@ -2,9 +2,12 @@ import * as React from "react";
 
 import { GlobalState } from '../globalState';

 import { CommandButtonComponent } from './commandButtonComponent';

 import { CommandDropdownComponent } from './commandDropdownComponent';

+import { Utilities } from '../tools/utilities';

 

 require("../scss/commandBar.scss");

 

+declare var Versions: any;

+

 interface ICommandBarComponentProps {

     globalState: GlobalState;

 }

@@ -44,6 +47,19 @@ export class CommandBarComponent extends React.Component<ICommandBarComponentPro
 
     }

 

     public render() {

+

+        var versionOptions = Object.keys(Versions).map(key => {

+            return {

+                label: key,

+                storeKey: "version",

+                defaultValue: "Latest",

+                onClick: () => {

+                    Utilities.StoreStringToStore("version", key);

+                    window.location.reload();

+                }

+            }

+        });

+

         return (

             <div className={"commands " + (this.props.globalState.language === "JS" ? "background-js" : "background-ts")}>

                 <div className="commands-left">

@@ -125,6 +141,7 @@ export class CommandBarComponent extends React.Component<ICommandBarComponentPro
 
                 ]}/>

                 </div>

                 <div className="commands-right">

+                    <CommandDropdownComponent globalState={this.props.globalState} icon="options" tooltip="Options" toRight={true} items={versionOptions} />                    

                     <CommandButtonComponent globalState={this.props.globalState} tooltip="Examples" icon="examples" onClick={()=> this.onExamples()} isActive={false}/>

                 </div>

             </div>

+ 2 - 1
Playground/src/components/commandDropdownComponent.tsx
Просмотреть файл 

@@ -14,6 +14,7 @@ interface ICommandDropdownComponentProps {
 
         defaultValue?: boolean | string;

         subItems?: string[];

     }[];

+    toRight?: boolean

 }

 

 export class CommandDropdownComponent extends React.Component<ICommandDropdownComponentProps, {isExpanded: boolean}> {    

@@ -38,7 +39,7 @@ export class CommandDropdownComponent extends React.Component<ICommandDropdownCo
 
                     </div>

                     {

                             this.state.isExpanded &&

-                            <div className="command-dropdown-content sub1">

+                            <div className={"command-dropdown-content sub1" + (this.props.toRight ? " toRight" : "")}>

                                 {

                                     this.props.items.map(m => {

                                         return (

+ 5 - 0
Playground/src/scss/commandBar.scss
Просмотреть файл 

@@ -123,6 +123,11 @@
 
         transform: scale(1);

         z-index: 100;

 

+        &.toRight {

+            width: 120px;

+            right:0;

+        }        

+

         .command-dropdown-label {

             font-family: "acumin-pro-extra-condensed";

             color:white;