babylon.engine.js 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763
  1. var BABYLON = BABYLON || {};
  2. (function () {
  3. BABYLON.Engine = function (canvas, antialias) {
  4. this._renderingCanvas = canvas;
  5. // GL
  6. try {
  7. this._gl = canvas.getContext("webgl", { antialias: antialias }) || canvas.getContext("experimental-webgl", { antialias: antialias });
  8. } catch (e) {
  9. throw new Error("WebGL not supported");
  10. }
  11. if (this._gl === undefined) {
  12. throw new Error("WebGL not supported");
  13. }
  14. // Options
  15. this.forceWireframe = false;
  16. this.cullBackFaces = true;
  17. // Scenes
  18. this.scenes = [];
  19. // Textures
  20. this._workingCanvas = document.createElement("canvas");
  21. this._workingContext = this._workingCanvas.getContext("2d");
  22. // Viewport
  23. this._hardwareScalingLevel = 1.0;
  24. this.resize();
  25. // Caps
  26. this._caps = {};
  27. this._caps.maxTexturesImageUnits = this._gl.getParameter(this._gl.MAX_TEXTURE_IMAGE_UNITS);
  28. this._caps.maxTextureSize = this._gl.getParameter(this._gl.MAX_TEXTURE_SIZE);
  29. this._caps.maxCubemapTextureSize = this._gl.getParameter(this._gl.MAX_CUBE_MAP_TEXTURE_SIZE);
  30. this._caps.maxRenderTextureSize = this._gl.getParameter(this._gl.MAX_RENDERBUFFER_SIZE);
  31. // Cache
  32. this._loadedTexturesCache = [];
  33. this._activeTexturesCache = [];
  34. this._buffersCache = {
  35. vertexBuffer: null,
  36. indexBuffer: null
  37. };
  38. this._currentEffect = null;
  39. this._currentState = {
  40. culling: null
  41. };
  42. this._compiledEffects = {};
  43. this._gl.enable(this._gl.DEPTH_TEST);
  44. this._gl.depthFunc(this._gl.LEQUAL);
  45. // Fullscreen
  46. this.isFullscreen = false;
  47. var that = this;
  48. document.addEventListener("fullscreenchange", function () {
  49. that.isFullscreen = document.fullscreen;
  50. }, false);
  51. document.addEventListener("mozfullscreenchange", function () {
  52. that.isFullscreen = document.mozFullScreen;
  53. }, false);
  54. document.addEventListener("webkitfullscreenchange", function () {
  55. that.isFullscreen = document.webkitIsFullScreen;
  56. }, false);
  57. document.addEventListener("msfullscreenchange", function () {
  58. that.isFullscreen = document.msIsFullScreen;
  59. }, false);
  60. };
  61. // Properties
  62. BABYLON.Engine.prototype.getAspectRatio = function () {
  63. return this._aspectRatio;
  64. };
  65. BABYLON.Engine.prototype.getRenderWidth = function () {
  66. return this._renderingCanvas.width;
  67. };
  68. BABYLON.Engine.prototype.getRenderHeight = function () {
  69. return this._renderingCanvas.height;
  70. };
  71. BABYLON.Engine.prototype.getRenderingCanvas = function () {
  72. return this._renderingCanvas;
  73. };
  74. BABYLON.Engine.prototype.setHardwareScalingLevel = function (level) {
  75. this._hardwareScalingLevel = level;
  76. this.resize();
  77. };
  78. BABYLON.Engine.prototype.getLoadedTexturesCache = function () {
  79. return this._loadedTexturesCache;
  80. };
  81. BABYLON.Engine.prototype.getCaps = function () {
  82. return this._caps;
  83. };
  84. // Methods
  85. BABYLON.Engine.prototype.switchFullscreen = function (element) {
  86. if (this.isFullscreen) {
  87. BABYLON.Tools.ExitFullscreen();
  88. } else {
  89. BABYLON.Tools.RequestFullscreen(element ? element : this._renderingCanvas);
  90. }
  91. };
  92. BABYLON.Engine.prototype.clear = function (color, backBuffer, depthStencil) {
  93. this._gl.clearColor(color.r, color.g, color.b, 1.0);
  94. this._gl.clearDepth(1.0);
  95. var mode = 0;
  96. if (backBuffer || this.forceWireframe)
  97. mode |= this._gl.COLOR_BUFFER_BIT;
  98. if (depthStencil)
  99. mode |= this._gl.DEPTH_BUFFER_BIT;
  100. this._gl.clear(mode);
  101. };
  102. BABYLON.Engine.prototype.beginFrame = function () {
  103. BABYLON.Tools._MeasureFps();
  104. this._gl.viewport(0, 0, this._renderingCanvas.width, this._renderingCanvas.height);
  105. };
  106. BABYLON.Engine.prototype.endFrame = function () {
  107. this.flushFramebuffer();
  108. };
  109. BABYLON.Engine.prototype.resize = function () {
  110. this._renderingCanvas.width = this._renderingCanvas.clientWidth / this._hardwareScalingLevel;
  111. this._renderingCanvas.height = this._renderingCanvas.clientHeight / this._hardwareScalingLevel;
  112. this._aspectRatio = this._renderingCanvas.width / this._renderingCanvas.height;
  113. };
  114. BABYLON.Engine.prototype.bindFramebuffer = function (texture) {
  115. var gl = this._gl;
  116. gl.bindFramebuffer(gl.FRAMEBUFFER, texture._framebuffer);
  117. gl.viewport(0.0, 0.0, texture._size, texture._size);
  118. this.wipeCaches();
  119. };
  120. BABYLON.Engine.prototype.unBindFramebuffer = function (texture) {
  121. if (texture.generateMipMaps) {
  122. var gl = this._gl;
  123. gl.bindTexture(gl.TEXTURE_2D, texture);
  124. gl.generateMipmap(gl.TEXTURE_2D);
  125. gl.bindTexture(gl.TEXTURE_2D, null);
  126. }
  127. };
  128. BABYLON.Engine.prototype.flushFramebuffer = function () {
  129. this._gl.flush();
  130. };
  131. BABYLON.Engine.prototype.restoreDefaultFramebuffer = function () {
  132. this._gl.bindFramebuffer(this._gl.FRAMEBUFFER, null);
  133. this._gl.viewport(0, 0, this._renderingCanvas.width, this._renderingCanvas.height);
  134. this.wipeCaches();
  135. };
  136. // VBOs
  137. BABYLON.Engine.prototype.createVertexBuffer = function (vertices) {
  138. var vbo = this._gl.createBuffer();
  139. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, vbo);
  140. this._gl.bufferData(this._gl.ARRAY_BUFFER, new Float32Array(vertices), this._gl.STATIC_DRAW);
  141. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, null);
  142. this._buffersCache.vertexBuffer = null;
  143. vbo.references = 1;
  144. return vbo;
  145. };
  146. BABYLON.Engine.prototype.createDynamicVertexBuffer = function (capacity) {
  147. var vbo = this._gl.createBuffer();
  148. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, vbo);
  149. this._gl.bufferData(this._gl.ARRAY_BUFFER, capacity, this._gl.DYNAMIC_DRAW);
  150. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, null);
  151. this._buffersCache.vertexBuffer = null;
  152. vbo.references = 1;
  153. return vbo;
  154. };
  155. BABYLON.Engine.prototype.updateDynamicVertexBuffer = function (vertexBuffer, vertices) {
  156. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, vertexBuffer);
  157. this._gl.bufferSubData(this._gl.ARRAY_BUFFER, 0, new Float32Array(vertices));
  158. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, null);
  159. };
  160. BABYLON.Engine.prototype.createIndexBuffer = function (indices, is32Bits) {
  161. var vbo = this._gl.createBuffer();
  162. this._gl.bindBuffer(this._gl.ELEMENT_ARRAY_BUFFER, vbo);
  163. this._gl.bufferData(this._gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this._gl.STATIC_DRAW);
  164. this._gl.bindBuffer(this._gl.ELEMENT_ARRAY_BUFFER, null);
  165. this._buffersCache.indexBuffer = null;
  166. vbo.references = 1;
  167. vbo.is32Bits = is32Bits;
  168. return vbo;
  169. };
  170. BABYLON.Engine.prototype.bindBuffers = function (vertexBuffer, indexBuffer, vertexDeclaration, vertexStrideSize, effect) {
  171. if (this._buffersCache.vertexBuffer != vertexBuffer) {
  172. this._gl.bindBuffer(this._gl.ARRAY_BUFFER, vertexBuffer);
  173. this._buffersCache.vertexBuffer = vertexBuffer;
  174. var offset = 0;
  175. for (var index = 0; index < vertexDeclaration.length; index++) {
  176. var order = effect.getAttribute(index);
  177. if (order >= 0) {
  178. this._gl.vertexAttribPointer(order, vertexDeclaration[index], this._gl.FLOAT, false, vertexStrideSize, offset);
  179. offset += vertexDeclaration[index] * 4;
  180. }
  181. }
  182. }
  183. if (this._buffersCache.indexBuffer != indexBuffer) {
  184. this._gl.bindBuffer(this._gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
  185. this._buffersCache.indexBuffer = indexBuffer;
  186. }
  187. };
  188. BABYLON.Engine.prototype._releaseBuffer = function (buffer) {
  189. buffer.references--;
  190. if (buffer.references === 0) {
  191. this._gl.deleteBuffer(buffer);
  192. }
  193. };
  194. BABYLON.Engine.prototype.draw = function (useTriangles, indexStart, indexCount) {
  195. this._gl.drawElements(useTriangles ? this._gl.TRIANGLES : this._gl.LINES, indexCount, this._gl.UNSIGNED_SHORT, indexStart * 2);
  196. };
  197. // Shaders
  198. BABYLON.Engine.prototype.createEffect = function (baseName, attributesNames, uniformsNames, samplers, defines) {
  199. var name = baseName + "@" + defines;
  200. if (this._compiledEffects[name]) {
  201. return this._compiledEffects[name];
  202. }
  203. var effect = new BABYLON.Effect(baseName, attributesNames, uniformsNames, samplers, this, defines);
  204. this._compiledEffects[name] = effect;
  205. return effect;
  206. };
  207. var compileShader = function (gl, source, type, defines) {
  208. var shader = gl.createShader(type === "vertex" ? gl.VERTEX_SHADER : gl.FRAGMENT_SHADER);
  209. gl.shaderSource(shader, (defines ? defines + "\n" : "") + source);
  210. gl.compileShader(shader);
  211. if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
  212. throw new Error(gl.getShaderInfoLog(shader));
  213. }
  214. return shader;
  215. };
  216. BABYLON.Engine.prototype.createShaderProgram = function (vertexCode, fragmentCode, defines) {
  217. var vertexShader = compileShader(this._gl, vertexCode, "vertex", defines);
  218. var fragmentShader = compileShader(this._gl, fragmentCode, "fragment", defines);
  219. var shaderProgram = this._gl.createProgram();
  220. this._gl.attachShader(shaderProgram, vertexShader);
  221. this._gl.attachShader(shaderProgram, fragmentShader);
  222. this._gl.linkProgram(shaderProgram);
  223. this._gl.deleteShader(vertexShader);
  224. this._gl.deleteShader(fragmentShader);
  225. return shaderProgram;
  226. };
  227. BABYLON.Engine.prototype.getUniforms = function (shaderProgram, uniformsNames) {
  228. var results = [];
  229. for (var index = 0; index < uniformsNames.length; index++) {
  230. results.push(this._gl.getUniformLocation(shaderProgram, uniformsNames[index]));
  231. }
  232. return results;
  233. };
  234. BABYLON.Engine.prototype.getAttributes = function (shaderProgram, attributesNames) {
  235. var results = [];
  236. for (var index = 0; index < attributesNames.length; index++) {
  237. try {
  238. results.push(this._gl.getAttribLocation(shaderProgram, attributesNames[index]));
  239. } catch(e) {
  240. results.push(-1);
  241. }
  242. }
  243. return results;
  244. };
  245. BABYLON.Engine.prototype.enableEffect = function (effect) {
  246. if (!effect || !effect.getAttributesCount() || this._currentEffect === effect) {
  247. return;
  248. }
  249. this._buffersCache.vertexBuffer = null;
  250. // Use program
  251. this._gl.useProgram(effect.getProgram());
  252. for (var index = 0; index < effect.getAttributesCount() ; index++) {
  253. // Attributes
  254. var order = effect.getAttribute(index);
  255. if (order >= 0) {
  256. this._gl.enableVertexAttribArray(effect.getAttribute(index));
  257. }
  258. }
  259. this._currentEffect = effect;
  260. };
  261. BABYLON.Engine.prototype.setMatrix = function (uniform, matrix) {
  262. if (!uniform)
  263. return;
  264. this._gl.uniformMatrix4fv(uniform, false, matrix.toArray());
  265. };
  266. BABYLON.Engine.prototype.setVector2 = function (uniform, x, y) {
  267. if (!uniform)
  268. return;
  269. this._gl.uniform2f(uniform, x, y);
  270. };
  271. BABYLON.Engine.prototype.setVector3 = function (uniform, vector3) {
  272. if (!uniform)
  273. return;
  274. this._gl.uniform3f(uniform, vector3.x, vector3.y, vector3.z);
  275. };
  276. BABYLON.Engine.prototype.setBool = function (uniform, bool) {
  277. if (!uniform)
  278. return;
  279. this._gl.uniform1i(uniform, bool);
  280. };
  281. BABYLON.Engine.prototype.setVector4 = function (uniform, x, y, z, w) {
  282. if (!uniform)
  283. return;
  284. this._gl.uniform4f(uniform, x, y, z, w);
  285. };
  286. BABYLON.Engine.prototype.setColor3 = function (uniform, color3) {
  287. if (!uniform)
  288. return;
  289. this._gl.uniform3f(uniform, color3.r, color3.g, color3.b);
  290. };
  291. BABYLON.Engine.prototype.setColor4 = function (uniform, color3, alpha) {
  292. if (!uniform)
  293. return;
  294. this._gl.uniform4f(uniform, color3.r, color3.g, color3.b, alpha);
  295. };
  296. // States
  297. BABYLON.Engine.prototype.setState = function (culling) {
  298. // Culling
  299. if (this._currentState.culling !== culling) {
  300. if (culling) {
  301. this._gl.cullFace(this.cullBackFaces ? this._gl.BACK : this._gl.FRONT);
  302. this._gl.enable(this._gl.CULL_FACE);
  303. } else {
  304. this._gl.disable(this._gl.CULL_FACE);
  305. }
  306. this._currentState.culling = culling;
  307. }
  308. };
  309. BABYLON.Engine.prototype.setDepthBuffer = function (enable) {
  310. if (enable) {
  311. this._gl.enable(this._gl.DEPTH_TEST);
  312. } else {
  313. this._gl.disable(this._gl.DEPTH_TEST);
  314. }
  315. };
  316. BABYLON.Engine.prototype.setDepthWrite = function (enable) {
  317. this._gl.depthMask(enable);
  318. };
  319. BABYLON.Engine.prototype.setColorWrite = function (enable) {
  320. this._gl.colorMask(enable, enable, enable, enable);
  321. };
  322. BABYLON.Engine.prototype.setAlphaMode = function (mode) {
  323. switch (mode) {
  324. case BABYLON.Engine.ALPHA_DISABLE:
  325. this.setDepthWrite(true);
  326. this._gl.disable(this._gl.BLEND);
  327. break;
  328. case BABYLON.Engine.ALPHA_COMBINE:
  329. this.setDepthWrite(false);
  330. this._gl.blendFuncSeparate(this._gl.SRC_ALPHA, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ZERO, this._gl.ONE);
  331. this._gl.enable(this._gl.BLEND);
  332. break;
  333. case BABYLON.Engine.ALPHA_ADD:
  334. this.setDepthWrite(false);
  335. this._gl.blendFuncSeparate(this._gl.ONE, this._gl.ONE, this._gl.ZERO, this._gl.ONE);
  336. this._gl.enable(this._gl.BLEND);
  337. break;
  338. }
  339. };
  340. BABYLON.Engine.prototype.setAlphaTesting = function (enable) {
  341. this._alphaTest = enable;
  342. };
  343. BABYLON.Engine.prototype.getAlphaTesting = function () {
  344. return this._alphaTest;
  345. };
  346. // Textures
  347. BABYLON.Engine.prototype.wipeCaches = function () {
  348. this._activeTexturesCache = [];
  349. this._currentEffect = null;
  350. this._currentState = {
  351. culling: null
  352. };
  353. this._buffersCache = {
  354. vertexBuffer: null,
  355. indexBuffer: null
  356. };
  357. };
  358. var getExponantOfTwo = function (value, max) {
  359. var count = 1;
  360. do {
  361. count *= 2;
  362. } while (count < value);
  363. if (count > max)
  364. count = max;
  365. return count;
  366. };
  367. BABYLON.Engine.prototype.createTexture = function (url, noMipmap, invertY) {
  368. var texture = this._gl.createTexture();
  369. var that = this;
  370. var img = new Image();
  371. img.onload = function () {
  372. that._workingCanvas.width = getExponantOfTwo(img.width, that._caps.maxTextureSize);
  373. that._workingCanvas.height = getExponantOfTwo(img.height, that._caps.maxTextureSize);
  374. that._workingContext.drawImage(img, 0, 0, img.width, img.height, 0, 0, that._workingCanvas.width, that._workingCanvas.height);
  375. that._gl.bindTexture(that._gl.TEXTURE_2D, texture);
  376. that._gl.pixelStorei(that._gl.UNPACK_FLIP_Y_WEBGL, invertY === undefined ? true : invertY);
  377. that._gl.texImage2D(that._gl.TEXTURE_2D, 0, that._gl.RGBA, that._gl.RGBA, that._gl.UNSIGNED_BYTE, that._workingCanvas);
  378. that._gl.texParameteri(that._gl.TEXTURE_2D, that._gl.TEXTURE_MAG_FILTER, that._gl.LINEAR);
  379. if (noMipmap) {
  380. that._gl.texParameteri(that._gl.TEXTURE_2D, that._gl.TEXTURE_MIN_FILTER, that._gl.LINEAR);
  381. } else {
  382. that._gl.texParameteri(that._gl.TEXTURE_2D, that._gl.TEXTURE_MIN_FILTER, that._gl.LINEAR_MIPMAP_LINEAR);
  383. that._gl.generateMipmap(that._gl.TEXTURE_2D);
  384. }
  385. that._gl.bindTexture(that._gl.TEXTURE_2D, null);
  386. that._activeTexturesCache = [];
  387. texture._baseWidth = img.width;
  388. texture._baseHeight = img.height;
  389. texture._width = that._workingCanvas.width;
  390. texture._height = that._workingCanvas.height;
  391. texture.isReady = true;
  392. };
  393. img.src = url;
  394. texture.url = url;
  395. texture.noMipmap = noMipmap;
  396. texture.references = 1;
  397. this._loadedTexturesCache.push(texture);
  398. return texture;
  399. };
  400. BABYLON.Engine.prototype.createDynamicTexture = function (size, noMipmap) {
  401. var texture = this._gl.createTexture();
  402. var width = getExponantOfTwo(size, this._caps.maxTextureSize);
  403. var height = getExponantOfTwo(size, this._caps.maxTextureSize);
  404. this._gl.bindTexture(this._gl.TEXTURE_2D, texture);
  405. this._gl.texParameteri(this._gl.TEXTURE_2D, this._gl.TEXTURE_MAG_FILTER, this._gl.LINEAR);
  406. if (noMipmap) {
  407. this._gl.texParameteri(this._gl.TEXTURE_2D, this._gl.TEXTURE_MIN_FILTER, this._gl.LINEAR);
  408. } else {
  409. this._gl.texParameteri(this._gl.TEXTURE_2D, this._gl.TEXTURE_MIN_FILTER, this._gl.LINEAR_MIPMAP_LINEAR);
  410. }
  411. this._gl.bindTexture(this._gl.TEXTURE_2D, null);
  412. this._activeTexturesCache = [];
  413. texture._baseWidth = width;
  414. texture._baseHeight = height;
  415. texture._width = width;
  416. texture._height = height;
  417. texture.isReady = false;
  418. texture.noMipmap = noMipmap;
  419. texture.references = 1;
  420. this._loadedTexturesCache.push(texture);
  421. return texture;
  422. };
  423. BABYLON.Engine.prototype.updateDynamicTexture = function (texture, canvas) {
  424. this._gl.bindTexture(this._gl.TEXTURE_2D, texture);
  425. this._gl.pixelStorei(this._gl.UNPACK_FLIP_Y_WEBGL, true);
  426. this._gl.texImage2D(this._gl.TEXTURE_2D, 0, this._gl.RGBA, this._gl.RGBA, this._gl.UNSIGNED_BYTE, canvas);
  427. if (!texture.noMipmap) {
  428. this._gl.generateMipmap(this._gl.TEXTURE_2D);
  429. }
  430. this._gl.bindTexture(this._gl.TEXTURE_2D, null);
  431. this._activeTexturesCache = [];
  432. texture.isReady = true;
  433. };
  434. BABYLON.Engine.prototype.createRenderTargetTexture = function (size, generateMipMaps) {
  435. var gl = this._gl;
  436. var texture = gl.createTexture();
  437. gl.bindTexture(gl.TEXTURE_2D, texture);
  438. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
  439. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, generateMipMaps ? gl.LINEAR_MIPMAP_LINEAR : gl.LINEAR);
  440. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  441. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  442. gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, size, size, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  443. // Create the depth buffer
  444. var depthBuffer = gl.createRenderbuffer();
  445. gl.bindRenderbuffer(gl.RENDERBUFFER, depthBuffer);
  446. gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, size, size);
  447. // Create the framebuffer
  448. var framebuffer = gl.createFramebuffer();
  449. gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
  450. gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);
  451. gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthBuffer);
  452. // Unbind
  453. gl.bindTexture(gl.TEXTURE_2D, null);
  454. gl.bindRenderbuffer(gl.RENDERBUFFER, null);
  455. gl.bindFramebuffer(gl.FRAMEBUFFER, null);
  456. texture._framebuffer = framebuffer;
  457. texture._depthBuffer = depthBuffer;
  458. texture._size = size;
  459. texture.isReady = true;
  460. texture.generateMipMaps = generateMipMaps;
  461. texture.references = 1;
  462. this._activeTexturesCache = [];
  463. this._loadedTexturesCache.push(texture);
  464. return texture;
  465. };
  466. var extensions = ["_px.jpg", "_py.jpg", "_pz.jpg", "_nx.jpg", "_ny.jpg", "_nz.jpg"];
  467. var cascadeLoad = function (rootUrl, index, loadedImages, onfinish) {
  468. var img = new Image();
  469. img.onload = function () {
  470. loadedImages.push(this);
  471. if (index != extensions.length - 1) {
  472. cascadeLoad(rootUrl, index + 1, loadedImages, onfinish);
  473. } else {
  474. onfinish(loadedImages);
  475. }
  476. };
  477. img.src = rootUrl + extensions[index];
  478. };
  479. BABYLON.Engine.prototype.createCubeTexture = function (rootUrl) {
  480. var gl = this._gl;
  481. var texture = gl.createTexture();
  482. texture.isCube = true;
  483. texture.url = rootUrl;
  484. texture.references = 1;
  485. this._loadedTexturesCache.push(texture);
  486. var that = this;
  487. cascadeLoad(rootUrl, 0, [], function (imgs) {
  488. var width = getExponantOfTwo(imgs[0].width);
  489. var height = width;
  490. that._workingCanvas.width = width;
  491. that._workingCanvas.height = height;
  492. var faces = [
  493. gl.TEXTURE_CUBE_MAP_POSITIVE_X, gl.TEXTURE_CUBE_MAP_POSITIVE_Y, gl.TEXTURE_CUBE_MAP_POSITIVE_Z,
  494. gl.TEXTURE_CUBE_MAP_NEGATIVE_X, gl.TEXTURE_CUBE_MAP_NEGATIVE_Y, gl.TEXTURE_CUBE_MAP_NEGATIVE_Z
  495. ];
  496. gl.bindTexture(gl.TEXTURE_CUBE_MAP, texture);
  497. gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
  498. for (var index = 0; index < faces.length; index++) {
  499. that._workingContext.drawImage(imgs[index], 0, 0, imgs[index].width, imgs[index].height, 0, 0, width, height);
  500. gl.texImage2D(faces[index], 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, that._workingCanvas);
  501. }
  502. gl.generateMipmap(gl.TEXTURE_CUBE_MAP);
  503. gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
  504. gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
  505. gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  506. gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  507. gl.bindTexture(gl.TEXTURE_CUBE_MAP, null);
  508. that._activeTexturesCache = [];
  509. texture._width = width;
  510. texture._height = height;
  511. texture.isReady = true;
  512. });
  513. return texture;
  514. };
  515. BABYLON.Engine.prototype._releaseTexture = function (texture) {
  516. var gl = this._gl;
  517. if (texture._framebuffer) {
  518. gl.deleteFramebuffer(texture._framebuffer);
  519. }
  520. if (texture._depthBuffer) {
  521. gl.deleteRenderbuffer(texture._depthBuffer);
  522. }
  523. gl.deleteTexture(texture);
  524. // Unbind channels
  525. for (var channel = 0; channel < this._caps.maxTexturesImageUnits; channel++) {
  526. this._gl.activeTexture(this._gl["TEXTURE" + channel]);
  527. this._gl.bindTexture(this._gl.TEXTURE_2D, null);
  528. this._gl.bindTexture(this._gl.TEXTURE_CUBE_MAP, null);
  529. this._activeTexturesCache[channel] = null;
  530. }
  531. };
  532. BABYLON.Engine.prototype.bindSamplers = function (effect) {
  533. this._gl.useProgram(effect.getProgram());
  534. var samplers = effect.getSamplers();
  535. for (var index = 0; index < samplers.length; index++) {
  536. var uniform = effect.getUniform(samplers[index]);
  537. this._gl.uniform1i(uniform, index);
  538. }
  539. this._currentEffect = null;
  540. };
  541. BABYLON.Engine.prototype.setTexture = function (channel, texture) {
  542. if (!texture || !texture.isReady()) {
  543. if (this._activeTexturesCache[channel] != null) {
  544. this._gl.activeTexture(this._gl["TEXTURE" + channel]);
  545. this._gl.bindTexture(this._gl.TEXTURE_2D, null);
  546. this._gl.bindTexture(this._gl.TEXTURE_CUBE_MAP, null);
  547. this._activeTexturesCache[channel] = null;
  548. }
  549. return;
  550. }
  551. if (this._activeTexturesCache[channel] == texture) {
  552. return;
  553. }
  554. this._activeTexturesCache[channel] = texture;
  555. var internalTexture = texture.getInternalTexture();
  556. this._gl.activeTexture(this._gl["TEXTURE" + channel]);
  557. if (internalTexture.isCube) {
  558. this._gl.bindTexture(this._gl.TEXTURE_CUBE_MAP, internalTexture);
  559. if (internalTexture._cachedCoordinatesMode !== texture.coordinatesMode) {
  560. internalTexture._cachedCoordinatesMode = texture.coordinatesMode;
  561. this._gl.texParameteri(this._gl.TEXTURE_CUBE_MAP, this._gl.TEXTURE_WRAP_S, texture.coordinatesMode !== BABYLON.CubeTexture.CUBIC_MODE ? this._gl.REPEAT : this._gl.CLAMP_TO_EDGE);
  562. this._gl.texParameteri(this._gl.TEXTURE_CUBE_MAP, this._gl.TEXTURE_WRAP_T, texture.coordinatesMode !== BABYLON.CubeTexture.CUBIC_MODE ? this._gl.REPEAT : this._gl.CLAMP_TO_EDGE);
  563. }
  564. } else {
  565. this._gl.bindTexture(this._gl.TEXTURE_2D, internalTexture);
  566. if (internalTexture._cachedWrapU !== texture.wrapU) {
  567. internalTexture._cachedWrapU = texture.wrapU;
  568. this._gl.texParameteri(this._gl.TEXTURE_2D, this._gl.TEXTURE_WRAP_S, texture.wrapU ? this._gl.REPEAT : this._gl.CLAMP_TO_EDGE);
  569. }
  570. if (internalTexture._cachedWrapV !== texture.wrapV) {
  571. internalTexture._cachedWrapV = texture.wrapV;
  572. this._gl.texParameteri(this._gl.TEXTURE_2D, this._gl.TEXTURE_WRAP_T, texture.wrapV ? this._gl.REPEAT : this._gl.CLAMP_TO_EDGE);
  573. }
  574. }
  575. };
  576. // Dispose
  577. BABYLON.Engine.prototype.dispose = function () {
  578. // Release scenes
  579. while (this.scenes.length) {
  580. this.scenes[0].dispose();
  581. }
  582. // Release effects
  583. for (var name in this._compiledEffects.length) {
  584. this._gl.deleteProgram(this._compiledEffects[name]._program);
  585. }
  586. };
  587. // Statics
  588. BABYLON.Engine.ShadersRepository = "Babylon/Shaders/";
  589. BABYLON.Engine.ALPHA_DISABLE = 0;
  590. BABYLON.Engine.ALPHA_ADD = 1;
  591. BABYLON.Engine.ALPHA_COMBINE = 2;
  592. BABYLON.Engine.epsilon = 0.001;
  593. BABYLON.Engine.collisionsEpsilon = 0.001;
  594. BABYLON.Engine.isSupported = function () {
  595. try {
  596. var tempcanvas = document.createElement("canvas");
  597. var gl = tempcanvas.getContext("webgl") || tempcanvas.getContext("experimental-webgl");
  598. return gl != null && !!window.WebGLRenderingContext;
  599. } catch (e) {
  600. return false;
  601. }
  602. };
  603. })();