threex.windowresize.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. // This THREEx helper makes it easy to handle window resize.
  2. // It will update renderer and camera when window is resized.
  3. //
  4. // # Usage
  5. //
  6. // **Step 1**: Start updating renderer and camera
  7. //
  8. // ```var windowResize = new THREEx.WindowResize(aRenderer, aCamera)```
  9. //
  10. // **Step 2**: stop updating renderer and camera
  11. //
  12. // ```windowResize.destroy()```
  13. // # Code
  14. //
  15. /** @namespace */
  16. var THREEx = THREEx || {}
  17. /**
  18. * Update renderer and camera when the window is resized
  19. *
  20. * @param {Object} renderer the renderer to update
  21. * @param {Object} Camera the camera to update
  22. */
  23. THREEx.WindowResize = function(renderer, camera){
  24. var callback = function(){
  25. // notify the renderer of the size change
  26. renderer.setSize( window.innerWidth, window.innerHeight )
  27. // update the camera
  28. camera.aspect = window.innerWidth / window.innerHeight
  29. camera.updateProjectionMatrix()
  30. }
  31. // bind the resize event
  32. window.addEventListener('resize', callback, false)
  33. // return .stop() the function to stop watching window resize
  34. return {
  35. trigger : function(){
  36. callback()
  37. },
  38. /**
  39. * Stop watching window resize
  40. */
  41. destroy : function(){
  42. window.removeEventListener('resize', callback)
  43. }
  44. }
  45. }