index-local.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Babylon.js Playground</title>
  5. <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>
  6. <script src="http://www.babylonjs.com/poly2tri.js"></script>
  7. <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>
  8. <!--x-tag-->
  9. <script src="xtag.min.js"></script>
  10. <script src="splitbox.js"></script>
  11. <link href="splitbox.css" rel="stylesheet" />
  12. <!-- jszip -->
  13. <script src="jszip.min.js"></script>
  14. <script src="fileSaver.js"></script>
  15. <!-- Bootstrap -->
  16. <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
  17. <script src="node_modules/monaco-editor/min/vs/loader.js"></script>
  18. <!-- Babylon.js -->
  19. <script src="https://babylonjs.azurewebsites.net/cannon.js"></script>
  20. <script src="https://babylonjs.azurewebsites.net/Oimo.js"></script>
  21. <script src="../tools/DevLoader/BabylonLoader.js"></script>
  22. <link href="index.css" rel="stylesheet" />
  23. </head>
  24. <body>
  25. <div class="navbar navbar-inverse navbar-fixed-top">
  26. <div class="navbar-inner" id="topbar">
  27. <a class="brand largeOnly" href="#" id="mainTitle">Babylon.js Playground</a>
  28. <div class="btn-group">
  29. <button class="btn" id="runButton">Run</button>
  30. <button class="btn" id="saveButton">Save</button>
  31. <button class="btn desktopOnly" id="zipButton">Get .zip</button>
  32. <button class="btn desktopOnly" id="newButton">New</button>
  33. <button class="btn desktopOnly" id="clearButton">Clear</button>
  34. </div>
  35. <div class="btn-group desktopOnly">
  36. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  37. <span id="currentFontSize">Font: 12</span>
  38. <span class="caret"></span>
  39. </a>
  40. <ul class="dropdown-menu" id="sizeList">
  41. <li><a href="#" onclick="setFontSize(12);">12</a></li>
  42. <li><a href="#" onclick="setFontSize(14);">14</a></li>
  43. <li><a href="#" onclick="setFontSize(16);">16</a></li>
  44. <li><a href="#" onclick="setFontSize(18);">18</a></li>
  45. <li><a href="#" onclick="setFontSize(20);">20</a></li>
  46. <li><a href="#" onclick="setFontSize(22);">22</a></li>
  47. </ul>
  48. </div>
  49. <div class="btn-group">
  50. <label class="btn btn-sm active">
  51. <input type="checkbox" autocomplete="off" id='safemodeToggle' style="margin-top:-0.1em;margin-right:4px">Safe Mode
  52. </label>
  53. <button class="btn btn-sm" id="editorButton">-Editor</button>
  54. <button class="btn btn-sm" id="debugButton">+Debug layer</button>
  55. </div>
  56. <div class="btn-group pull-right">
  57. <button class="btn" id="fullscreenButton">Fullscreen</button>
  58. </div>
  59. <div class="btn-group pull-right">
  60. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  61. <span id="currentScript">Predefined scripts</span>
  62. <span class="caret"></span>
  63. </a>
  64. <ul class="dropdown-menu" id="scriptsList"></ul>
  65. </div>
  66. </div>
  67. </div>
  68. <x-splitbox>
  69. <div id="jsEditor"></div>
  70. <div splitter></div>
  71. <div id="canvasZone">
  72. <canvas touch-action="none" id="renderCanvas"></canvas>
  73. </div>
  74. </x-splitbox>
  75. <span class="label" id="fpsLabel">FPS</span>
  76. <div id="errorZone">
  77. </div>
  78. <div class="navbar navbar-inverse navbar-fixed-bottom">
  79. <div class="navbar-inner">
  80. <ul class="nav pull-left">
  81. <li id="statusBar"></li>
  82. </ul>
  83. <ul class="nav pull-right">
  84. <li><a href="http://www.html5gamedevs.com/forum/16-babylonjs/">Forum</a></li>
  85. <li><a href="http://www.babylonjs.com/sandbox">Sandbox</a></li>
  86. <li><a href="https://github.com/BabylonJS/Babylon.js/wiki">Wiki</a></li>
  87. <li><a href="https://doc.babylonjs.com">Documentation</a></li>
  88. </ul>
  89. </div>
  90. </div>
  91. <script src="http://code.jquery.com/jquery.js"></script>
  92. <script src="bootstrap/js/bootstrap.min.js"></script>
  93. <script>
  94. BABYLONDEVTOOLS.Loader.require('index.js')
  95. .load();
  96. </script>
  97. </body>
  98. </html>