frame.js 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  1. (function () {
  2. var snippetUrl = "//babylonjs-api2.azurewebsites.net/snippets";
  3. var currentSnippetToken;
  4. var engine;
  5. var fpsLabel = document.getElementById("fpsLabel");
  6. var refreshAnchor = document.getElementById("refresh");
  7. var linkAnchor = document.getElementById("link");
  8. var scripts;
  9. var zipCode;
  10. if (location.href.toLowerCase().indexOf("noui") > -1) {
  11. fpsLabel.style.visibility = "hidden";
  12. fpsLabel.style.display = "none";
  13. refreshAnchor.style.visibility = "hidden";
  14. refreshAnchor.style.display = "none";
  15. linkAnchor.style.visibility = "hidden";
  16. linkAnchor.style.display = "none";
  17. }
  18. BABYLON.Engine.ShadersRepository = "/src/Shaders/";
  19. var loadScript = function (scriptURL, title) {
  20. var xhr = new XMLHttpRequest();
  21. xhr.open('GET', scriptURL, true);
  22. xhr.onreadystatechange = function () {
  23. if (xhr.readyState === 4) {
  24. if (xhr.status === 200) {
  25. blockEditorChange = true;
  26. console.log(xhr.responseText);
  27. jsEditor.setValue(xhr.responseText);
  28. jsEditor.setPosition({ lineNumber: 0, column: 0 });
  29. blockEditorChange = false;
  30. compileAndRun();
  31. document.getElementById("currentScript").innerHTML = title;
  32. currentSnippetToken = null;
  33. }
  34. }
  35. };
  36. xhr.send(null);
  37. };
  38. var showError = function (error) {
  39. console.warn(error);
  40. };
  41. compileAndRun = function (code) {
  42. try {
  43. if (!BABYLON.Engine.isSupported()) {
  44. showError("Your browser does not support WebGL");
  45. return;
  46. }
  47. if (engine) {
  48. engine.dispose();
  49. engine = null;
  50. }
  51. var canvas = document.getElementById("renderCanvas");
  52. var checkCamera = true;
  53. var wrappedEval = false;
  54. var createEngineFunction = "createDefaultEngine";
  55. var createSceneFunction;
  56. var createDefaultEngine = function () {
  57. return new BABYLON.Engine(canvas, true, { stencil: true });
  58. }
  59. var scene;
  60. if (code.indexOf("createEngine") !== -1) {
  61. createEngineFunction = "createEngine";
  62. }
  63. if (code.indexOf("delayCreateScene") !== -1) { // createScene
  64. createSceneFunction = "delayCreateScene";
  65. checkCamera = false;
  66. } else if (code.indexOf("createScene") !== -1) { // createScene
  67. createSceneFunction = "createScene";
  68. } else if (code.indexOf("CreateScene") !== -1) { // CreateScene
  69. createSceneFunction = "CreateScene";
  70. } else if (code.indexOf("createscene") !== -1) { // createscene
  71. createSceneFunction = "createscene";
  72. }
  73. if (!createSceneFunction) {
  74. // just pasted code.
  75. engine = createDefaultEngine();
  76. scene = new BABYLON.Scene(engine);
  77. eval("runScript = function(scene, canvas) {" + code + "}");
  78. runScript(scene, canvas);
  79. zipCode = "var scene = new BABYLON.Scene(engine);\r\n\r\n" + code;
  80. } else {
  81. //execute the code
  82. eval(code);
  83. //create engine
  84. eval("engine = " + createEngineFunction + "()");
  85. if (!engine) {
  86. showError("createEngine function must return an engine.", null);
  87. return;
  88. }
  89. //create scene
  90. eval("scene = " + createSceneFunction + "()");
  91. if (!scene) {
  92. showError(createSceneFunction + " function must return a scene.", null);
  93. return;
  94. }
  95. // update the scene code for the zip file
  96. zipCode = code + "\r\n\r\nvar scene = " + createSceneFunction + "()";
  97. }
  98. BABYLON.Camera.ForceAttachControlToAlwaysPreventDefault = true;
  99. engine.runRenderLoop(function () {
  100. if (engine.scenes.length === 0) {
  101. return;
  102. }
  103. if (canvas.width !== canvas.clientWidth) {
  104. engine.resize();
  105. }
  106. var scene = engine.scenes[0];
  107. if (scene.activeCamera || scene.activeCameras.length > 0) {
  108. scene.render();
  109. }
  110. if (fpsLabel) {
  111. fpsLabel.innerHTML = engine.getFps().toFixed() + " fps";
  112. }
  113. });
  114. } catch (e) {
  115. // showError(e.message);
  116. }
  117. };
  118. window.addEventListener("resize", function () {
  119. if (engine) {
  120. engine.resize();
  121. }
  122. });
  123. // UI
  124. var cleanHash = function () {
  125. var splits = decodeURIComponent(location.hash.substr(1)).split("#");
  126. if (splits.length > 2) {
  127. splits.splice(2, splits.length - 2);
  128. }
  129. location.hash = splits.join("#");
  130. };
  131. var checkHash = function () {
  132. if (location.hash) {
  133. cleanHash();
  134. try {
  135. var xmlHttp = new XMLHttpRequest();
  136. xmlHttp.onreadystatechange = function () {
  137. if (xmlHttp.readyState === 4) {
  138. if (xmlHttp.status === 200) {
  139. var snippetCode = JSON.parse(JSON.parse(xmlHttp.responseText)[0].jsonPayload).code;
  140. compileAndRun(snippetCode);
  141. var refresh = document.getElementById("refresh");
  142. if (refresh) {
  143. refresh.addEventListener("click", function () {
  144. compileAndRun(snippetCode);
  145. });
  146. }
  147. }
  148. }
  149. };
  150. var hash = location.hash.substr(1);
  151. currentSnippetToken = hash.split("#")[0];
  152. if (!hash.split("#")[1]) hash += "#0";
  153. xmlHttp.open("GET", snippetUrl + "/" + hash.replace("#", "/"));
  154. xmlHttp.send();
  155. var link = document.getElementById("link");
  156. if (link) {
  157. link.href = "//www.babylonjs-playground.com/#" + hash;
  158. }
  159. } catch (e) {
  160. }
  161. }
  162. };
  163. checkHash();
  164. })();