source/js/app/app.js - solar-system-webgl

API Docs for: 0.1.0
Show:

File: source/js/app/app.js

  1. /**
  2. * Initialises the application
  3. * @module App
  4. */
  5. define(['solar_system', 'gl', 'camera', 'controls', 'lighting', 'glUtils'], function (SolarSystem, gl, camera, controls, lighting) {
  6.  
  7. var timeLastFrame = false;
  8.  
  9. /**
  10. * Initialises the application.
  11. *
  12. * @class App
  13. * @constructor
  14. */
  15. function init() {
  16. waitUntilAssetsDownloadedThen(startTheApp);
  17. }
  18.  
  19. /**
  20. * Waits until each Astronomical Object has declared it is ready to be rendered, i.e. texture images have been downloaded.
  21. * @method waitUntilAssetsDownloadedThen
  22. * @param {Function} callback The function to call once all assets are downloaded.
  23. */
  24. function waitUntilAssetsDownloadedThen(callback) {
  25. var allAssetsDownloaded = true;
  26. for (var i = 0; i < SolarSystem.length; i++) {
  27. if (!SolarSystem[i].isReady) {
  28. allAssetsDownloaded = false;
  29. break;
  30. }
  31. }
  32.  
  33. if (allAssetsDownloaded) {
  34. callback();
  35. }
  36. else {
  37. setTimeout(function () {
  38. waitUntilAssetsDownloadedThen(callback);
  39. }, 25);
  40. }
  41. }
  42.  
  43. /**
  44. * Provides a handle to the external host by adding a class to the body, telling the host the application is ready. Then initialises the controls and starts the animation.
  45. * @method startTheApp
  46. */
  47. function startTheApp() {
  48. document.body.className += ' webgl_solarsystem__loaded';
  49. controls.bindToAnimation(function () {
  50. draw();
  51. });
  52. run();
  53. }
  54.  
  55. /**
  56. * Runs on every animation frame.
  57. * @method run
  58. */
  59. function run() {
  60. requestAnimationFrame(run);
  61. if (controls.paused()) {
  62. timeLastFrame = false;
  63. }
  64. else {
  65. draw();
  66. animate(controls.millisecondsPerDay());
  67. }
  68. }
  69.  
  70. /**
  71. * Draws to the canvas.
  72. * @method draw
  73. */
  74. function draw() {
  75. cleanCanvas();
  76. lighting.prepare();
  77. for (var i = 0; i < SolarSystem.length; i++) {
  78. var planet = SolarSystem[i];
  79. planet.draw(camera.getProjectionViewMatrix());
  80. }
  81. }
  82.  
  83. /**
  84. * Cleans the canvas.
  85. * @method cleanCanvas
  86. */
  87. function cleanCanvas() {
  88. // clear the background (with black)
  89. gl.clearColor(0.0, 0.0, 0.0, 1.0);
  90. gl.enable(gl.DEPTH_TEST);
  91. gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  92. }
  93.  
  94. /**
  95. * Animates the objects in the Solar System.
  96. * @method animate
  97. * @param {float} millisecondsPerDay Determines the speed at which objects spin and orbit.
  98. */
  99. function animate(millisecondsPerDay) {
  100. var deltaT = millisecondsSinceLastFrame();
  101. for (var i = 0; i < SolarSystem.length; i++) {
  102. SolarSystem[i].animate(millisecondsPerDay, deltaT);
  103. }
  104. }
  105.  
  106. /**
  107. * Returns the number of milliseconds since the last frame.
  108. * @method millisecondsSinceLastFrame
  109. * @return {int} Number of milliseconds since the last frame.
  110. */
  111. function millisecondsSinceLastFrame() {
  112. var timeThisFrame = Date.now(),
  113. millisecondsSinceLastFrame = 0;
  114.  
  115. if (!timeLastFrame) {
  116. timeLastFrame = timeThisFrame;
  117. }
  118.  
  119. millisecondsSinceLastFrame = timeThisFrame - timeLastFrame;
  120. timeLastFrame = timeThisFrame;
  121. return millisecondsSinceLastFrame;
  122. }
  123.  
  124. return {
  125. init: init
  126. };
  127. });