melonjs 14.4.0 → 15.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (245) hide show
  1. package/LICENSE.md +1 -1
  2. package/README.md +13 -57
  3. package/dist/melonjs.mjs/_virtual/_commonjsHelpers.js +1 -1
  4. package/dist/melonjs.mjs/_virtual/arraymultimap.js +1 -1
  5. package/dist/melonjs.mjs/_virtual/earcut.js +1 -1
  6. package/dist/melonjs.mjs/_virtual/howler.js +1 -1
  7. package/dist/melonjs.mjs/_virtual/index.js +1 -1
  8. package/dist/melonjs.mjs/_virtual/index2.js +1 -1
  9. package/dist/melonjs.mjs/_virtual/multimap.js +1 -1
  10. package/dist/melonjs.mjs/_virtual/setmultimap.js +1 -1
  11. package/dist/melonjs.mjs/application/application.js +1 -1
  12. package/dist/melonjs.mjs/application/header.js +1 -1
  13. package/dist/melonjs.mjs/application/resize.js +1 -1
  14. package/dist/melonjs.mjs/application/settings.js +1 -1
  15. package/dist/melonjs.mjs/audio/audio.js +5 -7
  16. package/dist/melonjs.mjs/camera/camera2d.js +1 -1
  17. package/dist/melonjs.mjs/const.js +1 -1
  18. package/dist/melonjs.mjs/entity/entity.js +43 -9
  19. package/dist/melonjs.mjs/geometries/ellipse.js +2 -3
  20. package/dist/melonjs.mjs/geometries/line.js +1 -1
  21. package/dist/melonjs.mjs/geometries/path2d.js +20 -44
  22. package/dist/melonjs.mjs/geometries/point.js +1 -6
  23. package/dist/melonjs.mjs/geometries/poly.js +2 -5
  24. package/dist/melonjs.mjs/geometries/rectangle.js +13 -9
  25. package/dist/melonjs.mjs/geometries/roundrect.js +1 -1
  26. package/dist/melonjs.mjs/index.js +10 -6
  27. package/dist/melonjs.mjs/input/gamepad.js +10 -16
  28. package/dist/melonjs.mjs/input/input.js +1 -1
  29. package/dist/melonjs.mjs/input/keyboard.js +1 -1
  30. package/dist/melonjs.mjs/input/pointer.js +1 -1
  31. package/dist/melonjs.mjs/input/pointerevent.js +3 -17
  32. package/dist/melonjs.mjs/lang/console.js +1 -1
  33. package/dist/melonjs.mjs/lang/deprecated.js +1 -1
  34. package/dist/melonjs.mjs/level/level.js +3 -3
  35. package/dist/melonjs.mjs/level/tiled/TMXGroup.js +1 -1
  36. package/dist/melonjs.mjs/level/tiled/TMXLayer.js +1 -8
  37. package/dist/melonjs.mjs/level/tiled/TMXObject.js +1 -1
  38. package/dist/melonjs.mjs/level/tiled/TMXTile.js +1 -1
  39. package/dist/melonjs.mjs/level/tiled/TMXTileMap.js +8 -4
  40. package/dist/melonjs.mjs/level/tiled/TMXTileset.js +5 -5
  41. package/dist/melonjs.mjs/level/tiled/TMXTilesetGroup.js +1 -1
  42. package/dist/melonjs.mjs/level/tiled/TMXUtils.js +1 -1
  43. package/dist/melonjs.mjs/level/tiled/constants.js +1 -1
  44. package/dist/melonjs.mjs/level/tiled/renderer/TMXHexagonalRenderer.js +1 -1
  45. package/dist/melonjs.mjs/level/tiled/renderer/TMXIsometricRenderer.js +1 -1
  46. package/dist/melonjs.mjs/level/tiled/renderer/TMXOrthogonalRenderer.js +1 -1
  47. package/dist/melonjs.mjs/level/tiled/renderer/TMXRenderer.js +1 -1
  48. package/dist/melonjs.mjs/level/tiled/renderer/TMXStaggeredRenderer.js +1 -1
  49. package/dist/melonjs.mjs/level/tiled/renderer/autodetect.js +1 -1
  50. package/dist/melonjs.mjs/loader/cache.js +24 -0
  51. package/dist/melonjs.mjs/loader/loader.js +331 -716
  52. package/dist/melonjs.mjs/loader/loadingscreen.js +4 -4
  53. package/dist/melonjs.mjs/loader/melonjs_logo.png.js +1 -1
  54. package/dist/melonjs.mjs/loader/parser.js +281 -0
  55. package/dist/melonjs.mjs/loader/settings.js +91 -0
  56. package/dist/melonjs.mjs/math/color.js +9 -8
  57. package/dist/melonjs.mjs/math/math.js +1 -1
  58. package/dist/melonjs.mjs/math/matrix2.js +7 -9
  59. package/dist/melonjs.mjs/math/matrix3.js +18 -21
  60. package/dist/melonjs.mjs/math/observable_vector2.js +3 -3
  61. package/dist/melonjs.mjs/math/observable_vector3.js +3 -4
  62. package/dist/melonjs.mjs/math/vector2.js +3 -3
  63. package/dist/melonjs.mjs/math/vector3.js +3 -4
  64. package/dist/melonjs.mjs/node_modules/@teppeis/multimaps/dist/src/arraymultimap.js +1 -1
  65. package/dist/melonjs.mjs/node_modules/@teppeis/multimaps/dist/src/index.js +1 -1
  66. package/dist/melonjs.mjs/node_modules/@teppeis/multimaps/dist/src/multimap.js +1 -1
  67. package/dist/melonjs.mjs/node_modules/@teppeis/multimaps/dist/src/setmultimap.js +1 -1
  68. package/dist/melonjs.mjs/node_modules/earcut/src/earcut.js +1 -1
  69. package/dist/melonjs.mjs/node_modules/eventemitter3/index.js +1 -1
  70. package/dist/melonjs.mjs/node_modules/eventemitter3/index2.js +1 -1
  71. package/dist/melonjs.mjs/node_modules/howler/dist/howler.js +1 -1
  72. package/dist/melonjs.mjs/particles/emitter.js +3 -3
  73. package/dist/melonjs.mjs/particles/particle.js +1 -1
  74. package/dist/melonjs.mjs/particles/settings.js +1 -1
  75. package/dist/melonjs.mjs/physics/body.js +18 -14
  76. package/dist/melonjs.mjs/physics/bounds.js +18 -70
  77. package/dist/melonjs.mjs/physics/collision.js +1 -1
  78. package/dist/melonjs.mjs/physics/detector.js +1 -1
  79. package/dist/melonjs.mjs/physics/quadtree.js +1 -1
  80. package/dist/melonjs.mjs/physics/response.js +1 -1
  81. package/dist/melonjs.mjs/physics/sat.js +1 -1
  82. package/dist/melonjs.mjs/physics/world.js +1 -1
  83. package/dist/melonjs.mjs/plugin/plugin.js +3 -3
  84. package/dist/melonjs.mjs/renderable/collectable.js +1 -1
  85. package/dist/melonjs.mjs/renderable/colorlayer.js +1 -1
  86. package/dist/melonjs.mjs/renderable/container.js +25 -19
  87. package/dist/melonjs.mjs/renderable/dragndrop.js +1 -1
  88. package/dist/melonjs.mjs/renderable/imagelayer.js +7 -1
  89. package/dist/melonjs.mjs/renderable/light2d.js +1 -1
  90. package/dist/melonjs.mjs/renderable/nineslicesprite.js +1 -1
  91. package/dist/melonjs.mjs/renderable/renderable.js +148 -105
  92. package/dist/melonjs.mjs/renderable/sprite.js +33 -54
  93. package/dist/melonjs.mjs/renderable/trigger.js +1 -1
  94. package/dist/melonjs.mjs/renderable/ui/uibaseelement.js +1 -1
  95. package/dist/melonjs.mjs/renderable/ui/uispriteelement.js +1 -1
  96. package/dist/melonjs.mjs/renderable/ui/uitextbutton.js +1 -3
  97. package/dist/melonjs.mjs/state/stage.js +1 -1
  98. package/dist/melonjs.mjs/state/state.js +2 -2
  99. package/dist/melonjs.mjs/system/device.js +2 -2
  100. package/dist/melonjs.mjs/system/dom.js +1 -1
  101. package/dist/melonjs.mjs/system/event.js +1 -1
  102. package/dist/melonjs.mjs/system/platform.js +1 -1
  103. package/dist/melonjs.mjs/system/pooling.js +8 -18
  104. package/dist/melonjs.mjs/system/save.js +1 -1
  105. package/dist/melonjs.mjs/system/timer.js +1 -1
  106. package/dist/melonjs.mjs/text/bitmaptext.js +66 -8
  107. package/dist/melonjs.mjs/text/bitmaptextdata.js +1 -1
  108. package/dist/melonjs.mjs/text/glyph.js +1 -1
  109. package/dist/melonjs.mjs/text/text.js +56 -86
  110. package/dist/melonjs.mjs/text/textmetrics.js +1 -1
  111. package/dist/melonjs.mjs/text/textstyle.js +4 -6
  112. package/dist/melonjs.mjs/tweens/easing.js +1 -1
  113. package/dist/melonjs.mjs/tweens/interpolation.js +1 -1
  114. package/dist/melonjs.mjs/tweens/tween.js +1 -1
  115. package/dist/melonjs.mjs/utils/agent.js +1 -1
  116. package/dist/melonjs.mjs/utils/array.js +1 -1
  117. package/dist/melonjs.mjs/utils/file.js +1 -1
  118. package/dist/melonjs.mjs/utils/function.js +1 -1
  119. package/dist/melonjs.mjs/utils/string.js +2 -2
  120. package/dist/melonjs.mjs/utils/utils.js +2 -4
  121. package/dist/melonjs.mjs/video/canvas/canvas_renderer.js +7 -11
  122. package/dist/melonjs.mjs/video/renderer.js +2 -13
  123. package/dist/melonjs.mjs/video/texture/atlas.js +12 -17
  124. package/dist/melonjs.mjs/video/texture/cache.js +3 -3
  125. package/dist/melonjs.mjs/video/texture/canvas_texture.js +1 -1
  126. package/dist/melonjs.mjs/video/utils/autodetect.js +1 -1
  127. package/dist/melonjs.mjs/video/video.js +2 -2
  128. package/dist/melonjs.mjs/video/webgl/buffer/vertex.js +21 -17
  129. package/dist/melonjs.mjs/video/webgl/compositors/compositor.js +235 -0
  130. package/dist/melonjs.mjs/video/webgl/compositors/primitive_compositor.js +77 -0
  131. package/dist/melonjs.mjs/video/webgl/compositors/quad_compositor.js +249 -0
  132. package/dist/melonjs.mjs/video/webgl/{webgl_compositor.js → compositors/webgl_compositor.js} +20 -205
  133. package/dist/melonjs.mjs/video/webgl/glshader.js +1 -1
  134. package/dist/melonjs.mjs/video/webgl/shaders/primitive.frag.js +1 -1
  135. package/dist/melonjs.mjs/video/webgl/shaders/primitive.vert.js +2 -2
  136. package/dist/melonjs.mjs/video/webgl/shaders/quad.frag.js +1 -1
  137. package/dist/melonjs.mjs/video/webgl/shaders/quad.vert.js +2 -2
  138. package/dist/melonjs.mjs/video/webgl/utils/attributes.js +1 -1
  139. package/dist/melonjs.mjs/video/webgl/utils/precision.js +1 -1
  140. package/dist/melonjs.mjs/video/webgl/utils/program.js +1 -1
  141. package/dist/melonjs.mjs/video/webgl/utils/string.js +1 -1
  142. package/dist/melonjs.mjs/video/webgl/utils/uniforms.js +1 -1
  143. package/dist/melonjs.mjs/video/webgl/webgl_renderer.js +139 -149
  144. package/dist/melonjs.module.js +26320 -26376
  145. package/dist/types/entity/entity.d.ts +3 -3
  146. package/dist/types/geometries/path2d.d.ts +5 -31
  147. package/dist/types/geometries/point.d.ts +2 -7
  148. package/dist/types/geometries/poly.d.ts +0 -1
  149. package/dist/types/index.d.ts +5 -3
  150. package/dist/types/loader/cache.d.ts +7 -0
  151. package/dist/types/loader/loader.d.ts +166 -181
  152. package/dist/types/loader/parser.d.ts +41 -0
  153. package/dist/types/loader/settings.d.ts +57 -0
  154. package/dist/types/particles/emitter.d.ts +4 -4
  155. package/dist/types/physics/bounds.d.ts +29 -84
  156. package/dist/types/renderable/container.d.ts +0 -11
  157. package/dist/types/renderable/renderable.d.ts +43 -31
  158. package/dist/types/renderable/sprite.d.ts +3 -3
  159. package/dist/types/renderable/ui/uitextbutton.d.ts +0 -1
  160. package/dist/types/state/state.d.ts +1 -1
  161. package/dist/types/system/pooling.d.ts +2 -2
  162. package/dist/types/text/text.d.ts +6 -20
  163. package/dist/types/text/textstyle.d.ts +1 -1
  164. package/dist/types/video/canvas/canvas_renderer.d.ts +0 -5
  165. package/dist/types/video/renderer.d.ts +1 -5
  166. package/dist/types/video/webgl/buffer/vertex.d.ts +3 -3
  167. package/dist/types/video/webgl/compositors/compositor.d.ts +107 -0
  168. package/dist/types/video/webgl/compositors/primitive_compositor.d.ts +22 -0
  169. package/dist/types/video/webgl/compositors/quad_compositor.d.ts +72 -0
  170. package/dist/types/video/webgl/compositors/webgl_compositor.d.ts +86 -0
  171. package/dist/types/video/webgl/webgl_compositor.d.ts +2 -3
  172. package/dist/types/video/webgl/webgl_renderer.d.ts +34 -28
  173. package/package.json +18 -18
  174. package/src/audio/audio.js +4 -6
  175. package/src/entity/entity.js +42 -8
  176. package/src/geometries/ellipse.js +1 -2
  177. package/src/geometries/path2d.js +19 -43
  178. package/src/geometries/point.js +0 -5
  179. package/src/geometries/poly.js +1 -4
  180. package/src/geometries/rectangle.js +12 -8
  181. package/src/index.js +7 -3
  182. package/src/input/gamepad.js +9 -15
  183. package/src/input/pointerevent.js +1 -15
  184. package/src/level/level.js +2 -2
  185. package/src/level/tiled/TMXLayer.js +0 -7
  186. package/src/level/tiled/TMXTileMap.js +7 -3
  187. package/src/level/tiled/TMXTileset.js +4 -4
  188. package/src/loader/cache.js +16 -0
  189. package/src/loader/loader.js +339 -711
  190. package/src/loader/loadingscreen.js +3 -3
  191. package/src/loader/parser.js +279 -0
  192. package/src/loader/settings.js +85 -0
  193. package/src/math/color.js +8 -7
  194. package/src/math/matrix2.js +6 -8
  195. package/src/math/matrix3.js +17 -20
  196. package/src/math/observable_vector2.js +2 -2
  197. package/src/math/observable_vector3.js +2 -3
  198. package/src/math/vector2.js +2 -2
  199. package/src/math/vector3.js +2 -3
  200. package/src/particles/emitter.js +2 -2
  201. package/src/physics/body.js +17 -13
  202. package/src/physics/bounds.js +17 -69
  203. package/src/polyfill/index.js +0 -2
  204. package/src/renderable/container.js +24 -18
  205. package/src/renderable/imagelayer.js +6 -0
  206. package/src/renderable/renderable.js +147 -104
  207. package/src/renderable/sprite.js +32 -53
  208. package/src/renderable/ui/uitextbutton.js +0 -2
  209. package/src/state/state.js +1 -1
  210. package/src/system/device.js +1 -1
  211. package/src/system/pooling.js +7 -17
  212. package/src/text/bitmaptext.js +65 -7
  213. package/src/text/text.js +55 -85
  214. package/src/text/textstyle.js +3 -5
  215. package/src/utils/string.js +1 -1
  216. package/src/utils/utils.js +1 -3
  217. package/src/video/canvas/canvas_renderer.js +5 -9
  218. package/src/video/renderer.js +0 -11
  219. package/src/video/texture/atlas.js +11 -16
  220. package/src/video/texture/cache.js +2 -2
  221. package/src/video/video.js +1 -1
  222. package/src/video/webgl/buffer/vertex.js +20 -16
  223. package/src/video/webgl/compositors/compositor.js +226 -0
  224. package/src/video/webgl/compositors/primitive_compositor.js +68 -0
  225. package/src/video/webgl/compositors/quad_compositor.js +240 -0
  226. package/src/video/webgl/shaders/primitive.vert +2 -5
  227. package/src/video/webgl/shaders/quad.vert +3 -1
  228. package/src/video/webgl/webgl_renderer.js +137 -147
  229. package/dist/melonjs.mjs/_virtual/make-built-in.js +0 -10
  230. package/dist/melonjs.mjs/_virtual/object-define-property.js +0 -10
  231. package/dist/melonjs.mjs/_virtual/object-get-own-property-descriptor.js +0 -10
  232. package/dist/melonjs.mjs/_virtual/object-get-own-property-names.js +0 -10
  233. package/dist/melonjs.mjs/_virtual/object-get-own-property-symbols.js +0 -10
  234. package/dist/melonjs.mjs/_virtual/object-property-is-enumerable.js +0 -10
  235. package/dist/melonjs.mjs/_virtual/shared.js +0 -10
  236. package/dist/melonjs.mjs/game.js +0 -29
  237. package/dist/melonjs.mjs/polyfill/console.js +0 -18
  238. package/dist/melonjs.mjs/polyfill/performance.js +0 -27
  239. package/dist/melonjs.mjs/polyfill/requestAnimationFrame.js +0 -46
  240. package/dist/melonjs.mjs/polyfill/roundrect.js +0 -242
  241. package/dist/melonjs.mjs/renderable/re_container.js +0 -1016
  242. package/dist/melonjs.mjs/video/utils/resize.js +0 -116
  243. package/src/polyfill/performance.js +0 -20
  244. package/src/polyfill/requestAnimationFrame.js +0 -39
  245. package/src/video/webgl/webgl_compositor.js +0 -486
@@ -1,13 +1,14 @@
1
1
  import Color from "./../../math/color.js";
2
2
  import Matrix2d from "./../../math/matrix2.js";
3
- import WebGLCompositor from "./webgl_compositor.js";
3
+ import QuadCompositor from "./compositors/quad_compositor";
4
+ import PrimitiveCompositor from "./compositors/primitive_compositor";
4
5
  import Renderer from "./../renderer.js";
5
6
  import TextureCache from "./../texture/cache.js";
6
7
  import { TextureAtlas, createAtlas } from "./../texture/atlas.js";
7
- import { createCanvas, renderer } from "./../video.js";
8
+ import { renderer } from "./../video.js";
8
9
  import * as event from "./../../system/event.js";
9
10
  import pool from "./../../system/pooling.js";
10
- import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
11
+ import { isPowerOfTwo } from "./../../math/math.js";
11
12
 
12
13
  /**
13
14
  * @classdesc
@@ -29,10 +30,9 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
29
30
  * @param {string} [options.powerPreference="default"] - a hint to the user agent indicating what configuration of GPU is suitable for the WebGL context ("default", "high-performance", "low-power"). To be noted that Safari and Chrome (since version 80) both default to "low-power" to save battery life and improve the user experience on these dual-GPU machines.
30
31
  * @param {number} [options.zoomX=width] - The actual width of the canvas with scaling applied
31
32
  * @param {number} [options.zoomY=height] - The actual height of the canvas with scaling applied
32
- * @param {WebGLCompositor} [options.compositor] - A class that implements the compositor API
33
+ * @param {Compositor} [options.compositor] - A class that implements the compositor API for sprite rendering
33
34
  */
34
35
  constructor(options) {
35
-
36
36
  // parent contructor
37
37
  super(options);
38
38
 
@@ -47,18 +47,18 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
47
47
  /**
48
48
  * The vendor string of the underlying graphics driver.
49
49
  * @type {string}
50
- * @default null
50
+ * @default undefined
51
51
  * @readonly
52
52
  */
53
- this.GPUVendor = null;
53
+ this.GPUVendor = undefined;
54
54
 
55
55
  /**
56
56
  * The renderer string of the underlying graphics driver.
57
57
  * @type {string}
58
- * @default null
58
+ * @default undefined
59
59
  * @readonly
60
60
  */
61
- this.GPURenderer = null;
61
+ this.GPURenderer = undefined;
62
62
 
63
63
  /**
64
64
  * The WebGL context
@@ -67,6 +67,12 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
67
67
  */
68
68
  this.context = this.gl = this.getContextGL(this.getCanvas(), options.transparent);
69
69
 
70
+ /**
71
+ * the vertex buffer used by this WebGL Renderer
72
+ * @type {WebGLBuffer}
73
+ */
74
+ this.vertexBuffer = this.gl.createBuffer();
75
+
70
76
  /**
71
77
  * Maximum number of texture unit supported under the current context
72
78
  * @type {number}
@@ -104,7 +110,13 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
104
110
  * The current compositor used by the renderer
105
111
  * @type {WebGLCompositor}
106
112
  */
107
- this.currentCompositor = null;
113
+ this.currentCompositor = undefined;
114
+
115
+ /**
116
+ * a reference to the current shader program used by the renderer
117
+ * @type {WebGLProgram}
118
+ */
119
+ this.currentProgram = undefined;
108
120
 
109
121
  /**
110
122
  * The list of active compositors
@@ -112,10 +124,12 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
112
124
  */
113
125
  this.compositors = new Map();
114
126
 
115
- // Create a default compositor
116
- var compositor = new (this.settings.compositor || WebGLCompositor)(this);
117
- this.compositors.set("default", compositor);
118
- this.setCompositor(compositor);
127
+ // bind the vertex buffer
128
+ this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexBuffer);
129
+
130
+ // Create both quad and primitive compositor
131
+ this.addCompositor(new (this.settings.compositor || QuadCompositor)(this), "quad", true);
132
+ this.addCompositor(new (this.settings.compositor || PrimitiveCompositor)(this), "primitive");
119
133
 
120
134
 
121
135
  // default WebGL state(s)
@@ -133,6 +147,10 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
133
147
  this.GPURenderer = this.gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL);
134
148
  }
135
149
 
150
+ // a private property that when set will make `setCompositor`
151
+ // to use this specific shader instead of the default one
152
+ this.customShader = undefined;
153
+
136
154
  // Create a texture cache
137
155
  this.cache = new TextureCache(this.maxTextures);
138
156
 
@@ -153,6 +171,17 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
153
171
  this.isContextValid = true;
154
172
  event.emit(event.ONCONTEXT_RESTORED, this);
155
173
  }, false );
174
+
175
+ // reset the renderer on game reset
176
+ event.on(event.GAME_RESET, () => {
177
+ this.reset();
178
+ });
179
+
180
+ // register to the CANVAS resize channel
181
+ event.on(event.CANVAS_ONRESIZE, (width, height) => {
182
+ this.flush();
183
+ this.setViewport(0, 0, width, height);
184
+ });
156
185
  }
157
186
 
158
187
  /**
@@ -161,6 +190,21 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
161
190
  reset() {
162
191
  super.reset();
163
192
 
193
+ // clear gl context
194
+ this.clear();
195
+
196
+ // initial viewport size
197
+ this.setViewport();
198
+
199
+ // rebind the vertex buffer if required (e.g in case of context loss)
200
+ if (this.gl.getParameter(this.gl.ARRAY_BUFFER_BINDING) !== this.vertexBuffer) {
201
+ this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexBuffer);
202
+ }
203
+
204
+ this.currentCompositor = undefined;
205
+ this.currentProgram = undefined;
206
+ this.customShader = undefined;
207
+
164
208
  this.compositors.forEach((compositor) => {
165
209
  if (this.isContextValid === false) {
166
210
  // on context lost/restore
@@ -170,35 +214,62 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
170
214
  }
171
215
  });
172
216
 
217
+ this.setCompositor("quad");
218
+
173
219
  this.gl.disable(this.gl.SCISSOR_TEST);
174
- if (typeof this.fontContext2D !== "undefined" ) {
175
- this.createFontTexture(this.cache);
220
+ }
221
+
222
+ /**
223
+ * add a new compositor to this renderer
224
+ * @param {Compositor} compositor - a compositor instance
225
+ * @param {String} name - a name uniquely identifying this compositor
226
+ * @param {Boolean} [activate=false] - true if the given compositor should be set as the active one
227
+ */
228
+ addCompositor(compositor, name = "default", activate = false) {
229
+ // make sure there is no existing compositor with the same name
230
+ if (typeof this.compositors.get(name) !== "undefined") {
231
+ throw new Error("Invalid Compositor name");
176
232
  }
177
233
 
234
+ // add the new compositor
235
+ this.compositors.set(name, compositor);
236
+
237
+ if (activate === true) {
238
+ // set as active one
239
+ this.setCompositor(name);
240
+ }
178
241
  }
179
242
 
180
243
  /**
181
244
  * set the active compositor for this renderer
182
- * @param {WebGLCompositor|string} compositor - a compositor name or instance
245
+ * @param {String} name - a compositor name
246
+ * @param {GLShader} [shader] - an optional shader program to be used, instead of the default one, when activating the compositor
247
+ * @return {Compositor} an instance to the current active compositor
183
248
  */
184
- setCompositor(compositor = "default") {
185
-
186
- if (typeof compositor === "string") {
187
- compositor = this.compositors.get(compositor);
188
- }
249
+ setCompositor(name = "default", shader = this.customShader) {
250
+ let compositor = this.compositors.get(name);
189
251
 
190
252
  if (typeof compositor === "undefined") {
191
- throw new Error("Invalid WebGL Compositor");
253
+ throw new Error("Invalid Compositor");
192
254
  }
193
255
 
194
256
  if (this.currentCompositor !== compositor) {
195
- if (this.currentCompositor !== null) {
257
+ if (this.currentCompositor !== undefined) {
196
258
  // flush the current compositor
197
259
  this.currentCompositor.flush();
198
260
  }
199
- // set given one as current
261
+ // set as the active one
200
262
  this.currentCompositor = compositor;
201
263
  }
264
+
265
+ if (name === "quad" && typeof shader === "object") {
266
+ this.currentCompositor.useShader(shader);
267
+ } else {
268
+ // (re)bind the compositor with the default shader (program & attributes)
269
+ this.currentCompositor.bind();
270
+ }
271
+
272
+ return this.currentCompositor;
202
273
  }
203
274
 
204
275
  /**
@@ -208,43 +279,6 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
208
279
  this.currentTransform.identity();
209
280
  }
210
281
 
211
- /**
212
- * @ignore
213
- */
214
- createFontTexture(cache) {
215
- if (typeof this.fontTexture === "undefined") {
216
- var canvas = this.getCanvas();
217
- var width = canvas.width;
218
- var height = canvas.height;
219
-
220
- if (this.WebGLVersion === 1) {
221
- if (!isPowerOfTwo(width)) {
222
- width = nextPowerOfTwo(canvas.width);
223
- }
224
- if (!isPowerOfTwo(height)) {
225
- height = nextPowerOfTwo(canvas.height);
226
- }
227
- }
228
-
229
- var image = createCanvas(width, height, true);
230
-
231
- /**
232
- * @ignore
233
- */
234
- this.fontContext2D = this.getContext2d(image);
235
-
236
- /**
237
- * @ignore
238
- */
239
- this.fontTexture = new TextureAtlas(createAtlas(canvas.width, canvas.height, "fontTexture"), image, cache);
240
- this.currentCompositor.uploadTexture(this.fontTexture, 0, 0, 0);
241
-
242
- } else {
243
- // fontTexture was already created, just add it back into the cache
244
- cache.set(this.fontContext2D.canvas, this.fontTexture);
245
- }
246
- }
247
-
248
282
  /**
249
283
  * Create a pattern with the specified repetition
250
284
  * @param {Image} image - Source image
@@ -259,6 +293,8 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
259
293
  */
260
294
  createPattern(image, repeat) {
261
295
 
296
+ this.setCompositor("quad");
297
+
262
298
  if (renderer.WebGLVersion === 1 && (!isPowerOfTwo(image.width) || !isPowerOfTwo(image.height))) {
263
299
  var src = typeof image.src !== "undefined" ? image.src : image;
264
300
  throw new Error(
@@ -292,10 +328,23 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
292
328
  }
293
329
 
294
330
  /**
295
- * prepare the framebuffer for drawing a new frame
331
+ * Sets the WebGL viewport, which specifies the affine transformation of x and y from normalized device coordinates to window coordinates
332
+ * @param {number} [x = 0] - x the horizontal coordinate for the lower left corner of the viewport origin
333
+ * @param {number} [y = 0] - y the vertical coordinate for the lower left corner of the viewport origin
334
+ * @param {number} [w = width of the canvas] - the width of viewport
335
+ * @param {number} [h = height of the canvas] - the height of viewport
336
+ */
337
+ setViewport(x = 0, y = 0, w = this.getCanvas().width, h = this.getCanvas().height) {
338
+ this.gl.viewport(x, y, w, h);
339
+ }
340
+
341
+ /**
342
+ * Clear the frame buffer
296
343
  */
297
344
  clear() {
298
- this.currentCompositor.clear(this.settings.transparent ? 0.0 : 1.0);
345
+ var gl = this.gl;
346
+ gl.clearColor(0, 0, 0, this.settings.transparent ? 0.0 : 1.0);
347
+ gl.clear(gl.COLOR_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
299
348
  }
300
349
 
301
350
  /**
@@ -305,6 +354,7 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
305
354
  */
306
355
  clearColor(color = "#000000", opaque = false) {
307
356
  var glArray;
357
+ var gl = this.gl;
308
358
 
309
359
  if (color instanceof Color) {
310
360
  glArray = color.toArray();
@@ -314,8 +364,10 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
314
364
  glArray = _color.parseCSS(color).toArray();
315
365
  pool.push(_color);
316
366
  }
367
+
317
368
  // clear gl context with the specified color
318
- this.currentCompositor.clearColor(glArray[0], glArray[1], glArray[2], (opaque === true) ? 1.0 : glArray[3]);
369
+ gl.clearColor(glArray[0], glArray[1], glArray[2], (opaque === true) ? 1.0 : glArray[3]);
370
+ gl.clear(gl.COLOR_BUFFER_BIT);
319
371
  }
320
372
 
321
373
  /**
@@ -332,39 +384,6 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
332
384
  this.restore();
333
385
  }
334
386
 
335
- /**
336
- * @ignore
337
- */
338
- drawFont(bounds) {
339
- var fontContext = this.getFontContext();
340
-
341
- // Force-upload the new texture
342
- this.currentCompositor.uploadTexture(this.fontTexture, 0, 0, 0, true);
343
-
344
- // Add the new quad
345
- var uvs = this.fontTexture.getUVs(bounds.left + "," + bounds.top + "," + bounds.width + "," + bounds.height);
346
- this.currentCompositor.addQuad(
347
- this.fontTexture,
348
- bounds.left,
349
- bounds.top,
350
- bounds.width,
351
- bounds.height,
352
- uvs[0],
353
- uvs[1],
354
- uvs[2],
355
- uvs[3],
356
- this.currentTint.toUint32(this.getGlobalAlpha())
357
- );
358
-
359
- // Clear font context2D
360
- fontContext.clearRect(
361
- bounds.left,
362
- bounds.top,
363
- bounds.width,
364
- bounds.height
365
- );
366
- }
367
-
368
387
  /**
369
388
  * Draw an image to the gl context
370
389
  * @param {Image} image - An element to draw into the context. The specification permits any canvas image source (CanvasImageSource), specifically, a CSSImageValue, an HTMLImageElement, an SVGImageElement, an HTMLVideoElement, an HTMLCanvasElement, an ImageBitmap, or an OffscreenCanvas.
@@ -410,6 +429,8 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
410
429
  dy |= 0;
411
430
  }
412
431
 
432
+ this.setCompositor("quad");
433
+
413
434
  var texture = this.cache.get(image);
414
435
  var uvs = texture.getUVs(sx + "," + sy + "," + sw + "," + sh);
415
436
  this.currentCompositor.addQuad(texture, dx, dy, dw, dh, uvs[0], uvs[1], uvs[2], uvs[3], this.currentTint.toUint32(this.getGlobalAlpha()));
@@ -426,6 +447,7 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
426
447
  */
427
448
  drawPattern(pattern, x, y, width, height) {
428
449
  var uvs = pattern.getUVs("0,0," + width + "," + height);
450
+ this.setCompositor("quad");
429
451
  this.currentCompositor.addQuad(pattern, x, y, width, height, uvs[0], uvs[1], uvs[2], uvs[3], this.currentTint.toUint32(this.getGlobalAlpha()));
430
452
  }
431
453
 
@@ -532,20 +554,6 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
532
554
  }
533
555
  }
534
556
 
535
- /**
536
- * return a reference to the font 2d Context
537
- * @ignore
538
- */
539
- getFontContext() {
540
- if (typeof this.fontContext2D === "undefined" ) {
541
- // warn the end user about performance impact
542
- console.warn("[WebGL Renderer] WARNING : Using Standard me.Text with WebGL will severly impact performances !");
543
- // create the font texture if not done yet
544
- this.createFontTexture(this.cache);
545
- }
546
- return this.fontContext2D;
547
- }
548
-
549
557
  /**
550
558
  * restores the canvas context
551
559
  */
@@ -666,10 +674,7 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
666
674
  * @param {boolean} [fill=false]
667
675
  */
668
676
  strokeArc(x, y, radius, start, end, antiClockwise = false, fill = false) {
669
- if (this.getGlobalAlpha() < 1 / 255) {
670
- // Fast path: don't draw fully transparent
671
- return;
672
- }
677
+ this.setCompositor("primitive");
673
678
  this.path2D.beginPath();
674
679
  this.path2D.arc(x, y, radius, start, end, antiClockwise);
675
680
  if (fill === false) {
@@ -702,15 +707,12 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
702
707
  * @param {boolean} [fill=false] - also fill the shape with the current color if true
703
708
  */
704
709
  strokeEllipse(x, y, w, h, fill = false) {
705
- if (this.getGlobalAlpha() < 1 / 255) {
706
- // Fast path: don't draw fully transparent
707
- return;
708
- }
710
+ this.setCompositor("primitive");
709
711
  this.path2D.beginPath();
710
712
  this.path2D.ellipse(x, y, w, h, 0, 0, 360);
711
713
  this.path2D.closePath();
712
714
  if (fill === false) {
713
- this.currentCompositor.drawVertices(this.gl.LINE_LOOP, this.path2D.points);
715
+ this.currentCompositor.drawVertices(this.gl.LINE_STRIP, this.path2D.points);
714
716
  } else {
715
717
  this.currentCompositor.drawVertices(this.gl.TRIANGLES, this.path2D.triangulatePath());
716
718
  }
@@ -735,14 +737,11 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
735
737
  * @param {number} endY - the end y coordinate
736
738
  */
737
739
  strokeLine(startX, startY, endX, endY) {
738
- if (this.getGlobalAlpha() < 1 / 255) {
739
- // Fast path: don't draw fully transparent
740
- return;
741
- }
740
+ this.setCompositor("primitive");
742
741
  this.path2D.beginPath();
743
742
  this.path2D.moveTo(startX, startY);
744
743
  this.path2D.lineTo(endX, endY);
745
- this.currentCompositor.drawVertices(this.gl.LINE_STRIP, this.path2D.points);
744
+ this.currentCompositor.drawVertices(this.gl.LINES, this.path2D.points);
746
745
  }
747
746
 
748
747
 
@@ -763,22 +762,19 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
763
762
  * @param {boolean} [fill=false] - also fill the shape with the current color if true
764
763
  */
765
764
  strokePolygon(poly, fill = false) {
766
- if (this.getGlobalAlpha() < 1 / 255) {
767
- // Fast path: don't draw fully transparent
768
- return;
769
- }
765
+ this.setCompositor("primitive");
770
766
  this.translate(poly.pos.x, poly.pos.y);
771
767
  this.path2D.beginPath();
772
- this.path2D.moveTo(poly.points[0].x, poly.points[0].y);
773
- var point;
774
- for (var i = 1; i < poly.points.length; i++) {
775
- point = poly.points[i];
776
- this.path2D.lineTo(point.x, point.y);
768
+
769
+ var points = poly.points;
770
+ for (var i = 1; i < points.length; i++) {
771
+ this.path2D.moveTo(points[i-1].x, points[i-1].y);
772
+ this.path2D.lineTo(points[i].x, points[i].y);
777
773
  }
778
- this.path2D.lineTo(poly.points[0].x, poly.points[0].y);
774
+ this.path2D.lineTo(points[points.length - 1].x, points[points.length - 1].y);
779
775
  this.path2D.closePath();
780
776
  if (fill === false) {
781
- this.currentCompositor.drawVertices(this.gl.LINE_LOOP, this.path2D.points);
777
+ this.currentCompositor.drawVertices(this.gl.LINES, this.path2D.points);
782
778
  } else {
783
779
  // draw all triangles
784
780
  this.currentCompositor.drawVertices(this.gl.TRIANGLES, this.path2D.triangulatePath());
@@ -803,14 +799,11 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
803
799
  * @param {boolean} [fill=false] - also fill the shape with the current color if true
804
800
  */
805
801
  strokeRect(x, y, width, height, fill = false) {
806
- if (this.getGlobalAlpha() < 1 / 255) {
807
- // Fast path: don't draw fully transparent
808
- return;
809
- }
802
+ this.setCompositor("primitive");
810
803
  this.path2D.beginPath();
811
804
  this.path2D.rect(x, y, width, height);
812
805
  if (fill === false) {
813
- this.currentCompositor.drawVertices(this.gl.LINE_LOOP, this.path2D.points);
806
+ this.currentCompositor.drawVertices(this.gl.LINES, this.path2D.points);
814
807
  } else {
815
808
  this.currentCompositor.drawVertices(this.gl.TRIANGLES, this.path2D.triangulatePath());
816
809
  }
@@ -837,14 +830,11 @@ import { isPowerOfTwo, nextPowerOfTwo } from "./../../math/math.js";
837
830
  * @param {boolean} [fill=false] - also fill the shape with the current color if true
838
831
  */
839
832
  strokeRoundRect(x, y, width, height, radius, fill = false) {
840
- if (this.getGlobalAlpha() < 1 / 255) {
841
- // Fast path: don't draw fully transparent
842
- return;
843
- }
833
+ this.setCompositor("primitive");
844
834
  this.path2D.beginPath();
845
835
  this.path2D.roundRect(x, y, width, height, radius);
846
836
  if (fill === false) {
847
- this.currentCompositor.drawVertices(this.gl.LINE_LOOP, this.path2D.points);
837
+ this.currentCompositor.drawVertices(this.gl.LINE_STRIP, this.path2D.points);
848
838
  } else {
849
839
  this.path2D.closePath();
850
840
  this.currentCompositor.drawVertices(this.gl.TRIANGLES, this.path2D.triangulatePath());
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var makeBuiltIn = {exports: {}};
9
-
10
- export { makeBuiltIn as m };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var objectDefineProperty = {};
9
-
10
- export { objectDefineProperty as __exports };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var objectGetOwnPropertyDescriptor = {};
9
-
10
- export { objectGetOwnPropertyDescriptor as __exports };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var objectGetOwnPropertyNames = {};
9
-
10
- export { objectGetOwnPropertyNames as __exports };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var objectGetOwnPropertySymbols = {};
9
-
10
- export { objectGetOwnPropertySymbols as __exports };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var objectPropertyIsEnumerable = {};
9
-
10
- export { objectPropertyIsEnumerable as __exports };
@@ -1,10 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- var shared = {exports: {}};
9
-
10
- export { shared as s };
@@ -1,29 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.3.0
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- import { on, BOOT } from './system/event.js';
9
- import Application from './application/application.js';
10
-
11
- /**
12
- * game is a default instance of a melonJS Application and represents your current game,
13
- * it contains all the objects, tilemap layers, current viewport, collision map, etc...<br>
14
- * @namespace game
15
- * @see Application
16
- */
17
-
18
- // create a default melonJS application instance
19
- let game = new Application();
20
-
21
- // initialize the game manager on system boot
22
- on(BOOT, () => {
23
- // initialize the default game instance
24
- game.init();
25
- });
26
-
27
- var game$1 = game;
28
-
29
- export { game$1 as default };
@@ -1,18 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- if (typeof globalThis !== "undefined") {
9
- if (typeof globalThis.console === "undefined") {
10
- globalThis.console = {};
11
- globalThis.console.log = function() {};
12
- globalThis.console.assert = function() {};
13
- globalThis.console.warn = function() {};
14
- globalThis.console.error = function() {
15
- alert(Array.prototype.slice.call(arguments).join(", "));
16
- };
17
- }
18
- }
@@ -1,27 +0,0 @@
1
- /*!
2
- * melonJS Game Engine - v14.1.3
3
- * http://www.melonjs.org
4
- * melonjs is licensed under the MIT License.
5
- * http://www.opensource.org/licenses/mit-license
6
- * @copyright (C) 2011 - 2022 Olivier Biot (AltByte Pte Ltd)
7
- */
8
- if ("performance" in globalThis === false) {
9
- globalThis.performance = {};
10
- }
11
-
12
- Date.now = (Date.now || function () { // thanks IE8
13
- return new Date().getTime();
14
- });
15
-
16
- if ("now" in globalThis.performance === false) {
17
-
18
- let nowOffset = Date.now();
19
-
20
- if (performance.timing && performance.timing.navigationStart) {
21
- nowOffset = performance.timing.navigationStart;
22
- }
23
-
24
- globalThis.performance.now = function now() {
25
- return Date.now() - nowOffset;
26
- };
27
- }