WebGLWindow.jslib 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. var WebGLWindow = {
  2. WebGLWindowInit : function() {
  3. // use WebAssembly.Table : makeDynCall
  4. // when enable. dynCall is undefined
  5. if(typeof dynCall === "undefined")
  6. {
  7. // make Runtime.dynCall to undefined
  8. Runtime = { dynCall : undefined }
  9. }
  10. else
  11. {
  12. // Remove the `Runtime` object from "v1.37.27: 12/24/2017"
  13. // if Runtime not defined. create and add functon!!
  14. if(typeof Runtime === "undefined") Runtime = { dynCall : dynCall }
  15. }
  16. },
  17. WebGLWindowGetCanvasName: function() {
  18. var elements = document.getElementsByTagName('canvas');
  19. var returnStr = "";
  20. if(elements.length >= 1)
  21. {
  22. returnStr = elements[0].parentNode.id;
  23. // workaround : for WebGLTemplate:Minimal temp! body element not have id!
  24. if(returnStr == '')
  25. {
  26. returnStr = elements[0].parentNode.id = 'WebGLWindow:Canvas:ParentNode';
  27. }
  28. }
  29. var bufferSize = lengthBytesUTF8(returnStr) + 1;
  30. var buffer = _malloc(bufferSize);
  31. stringToUTF8(returnStr, buffer, bufferSize);
  32. return buffer;
  33. },
  34. WebGLWindowOnFocus: function (cb) {
  35. window.addEventListener('focus', function () {
  36. (!!Runtime.dynCall) ? Runtime.dynCall("v", cb, []) : {{{ makeDynCall("v", "cb") }}}();
  37. });
  38. },
  39. WebGLWindowOnBlur: function (cb) {
  40. window.addEventListener('blur', function () {
  41. (!!Runtime.dynCall) ? Runtime.dynCall("v", cb, []) : {{{ makeDynCall("v", "cb") }}}();
  42. });
  43. },
  44. WebGLWindowOnResize: function(cb) {
  45. window.addEventListener('resize', function () {
  46. (!!Runtime.dynCall) ? Runtime.dynCall("v", cb, []) : {{{ makeDynCall("v", "cb") }}}();
  47. });
  48. },
  49. WebGLWindowInjectFullscreen : function () {
  50. document.makeFullscreen = function (id, keepAspectRatio) {
  51. // get fullscreen object
  52. var getFullScreenObject = function () {
  53. var doc = window.document;
  54. var objFullScreen = doc.fullscreenElement || doc.mozFullScreenElement || doc.webkitFullscreenElement || doc.msFullscreenElement;
  55. return (objFullScreen);
  56. }
  57. // handle fullscreen event
  58. var eventFullScreen = function (callback) {
  59. document.addEventListener("fullscreenchange", callback, false);
  60. document.addEventListener("webkitfullscreenchange", callback, false);
  61. document.addEventListener("mozfullscreenchange", callback, false);
  62. document.addEventListener("MSFullscreenChange", callback, false);
  63. }
  64. var removeEventFullScreen = function (callback) {
  65. document.removeEventListener("fullscreenchange", callback, false);
  66. document.removeEventListener("webkitfullscreenchange", callback, false);
  67. document.removeEventListener("mozfullscreenchange", callback, false);
  68. document.removeEventListener("MSFullscreenChange", callback, false);
  69. }
  70. var div = document.createElement("div");
  71. document.body.appendChild(div);
  72. // save canvas size to originSize
  73. var canvas = document.getElementsByTagName('canvas')[0];
  74. var originSize =
  75. {
  76. width : canvas.style.width,
  77. height : canvas.style.height,
  78. };
  79. var fullscreenRoot = document.getElementById(id);
  80. // when build with minimal default template
  81. // the fullscreenRoot is <body>
  82. var isBody = fullscreenRoot.tagName.toLowerCase() == "body";
  83. if(isBody)
  84. {
  85. // swip the id to div
  86. div.id = fullscreenRoot.id;
  87. fullscreenRoot.id = "";
  88. // overwrite the fullscreen root
  89. fullscreenRoot = canvas;
  90. }
  91. var beforeParent = fullscreenRoot.parentNode;
  92. var beforeStyle = window.getComputedStyle(fullscreenRoot);
  93. var beforeWidth = parseInt(beforeStyle.width);
  94. var beforeHeight = parseInt(beforeStyle.height);
  95. // to keep element index after fullscreen
  96. var index = Array.from(beforeParent.children).findIndex(function (v) { return v == fullscreenRoot; });
  97. div.appendChild(fullscreenRoot);
  98. // recv fullscreen function
  99. var fullscreenFunc = function () {
  100. if (getFullScreenObject()) {
  101. if (keepAspectRatio) {
  102. var ratio = Math.min(window.screen.width / beforeWidth, window.screen.height / beforeHeight);
  103. var width = Math.floor(beforeWidth * ratio);
  104. var height = Math.floor(beforeHeight * ratio);
  105. fullscreenRoot.style.width = width + 'px';
  106. fullscreenRoot.style.height = height + 'px';
  107. } else {
  108. fullscreenRoot.style.width = window.screen.width + 'px';
  109. fullscreenRoot.style.height = window.screen.height + 'px';
  110. }
  111. // make canvas size 100% to fix screen size
  112. canvas.style.width = "100%";
  113. canvas.style.height = "100%";
  114. } else {
  115. fullscreenRoot.style.width = beforeWidth + 'px';
  116. fullscreenRoot.style.height = beforeHeight + 'px';
  117. beforeParent.insertBefore(fullscreenRoot, Array.from(beforeParent.children)[index]);
  118. if(isBody)
  119. {
  120. beforeParent.id = div.id;
  121. }
  122. div.parentNode.removeChild(div);
  123. // set canvas size to origin size
  124. canvas.style.width = originSize.width;
  125. canvas.style.height = originSize.height;
  126. // remove this function
  127. removeEventFullScreen(fullscreenFunc);
  128. }
  129. }
  130. // listener fullscreen event
  131. eventFullScreen(fullscreenFunc);
  132. if (div.mozRequestFullScreen) div.mozRequestFullScreen();
  133. else if (div.webkitRequestFullScreen) div.webkitRequestFullScreen();
  134. else if (div.msRequestFullscreen) div.msRequestFullscreen();
  135. else if (div.requestFullscreen) div.requestFullscreen();
  136. }
  137. },
  138. MakeFullscreen : function (str) {
  139. document.makeFullscreen(UTF8ToString(str));
  140. },
  141. ExitFullscreen : function() {
  142. // get fullscreen object
  143. var doc = window.document;
  144. var objFullScreen = doc.fullscreenElement || doc.mozFullScreenElement || doc.webkitFullscreenElement || doc.msFullscreenElement;
  145. if (objFullScreen)
  146. {
  147. if (document.exitFullscreen) document.exitFullscreen();
  148. else if (document.msExitFullscreen) document.msExitFullscreen();
  149. else if (document.mozCancelFullScreen) document.mozCancelFullScreen();
  150. else if (document.webkitExitFullscreen) document.webkitExitFullscreen();
  151. }
  152. },
  153. IsFullscreen : function() {
  154. // get fullscreen object
  155. var doc = window.document;
  156. var objFullScreen = doc.fullscreenElement || doc.mozFullScreenElement || doc.webkitFullscreenElement || doc.msFullscreenElement;
  157. // check full screen elemenet is not null!
  158. return objFullScreen != null;
  159. },
  160. }
  161. mergeInto(LibraryManager.library, WebGLWindow);