melonjs 10.10.0 → 11.0.0

package/src/video/renderer.js

@@ -38,7 +38,7 @@ class Renderer {
          * @public
          * @name settings
          * @memberof Renderer#
-         * @enum {object}
+         * @type {object}
          */
         this.settings = options;
 
@@ -113,7 +113,6 @@ class Renderer {
      * prepare the framebuffer for drawing a new frame
      * @name clear
      * @memberof Renderer
-     * @function
      */
     clear() {}
 
@@ -121,7 +120,6 @@ class Renderer {
      * Reset context state
      * @name reset
      * @memberof Renderer
-     * @function
      */
     reset() {
         this.resetTransform();
@@ -140,7 +138,6 @@ class Renderer {
      * return a reference to the system canvas
      * @name getCanvas
      * @memberof Renderer
-     * @function
      * @returns {HTMLCanvasElement}
      */
     getCanvas() {
@@ -151,7 +148,6 @@ class Renderer {
      * return a reference to the screen canvas
      * @name getScreenCanvas
      * @memberof Renderer
-     * @function
      * @returns {HTMLCanvasElement}
      */
     getScreenCanvas() {
@@ -163,7 +159,6 @@ class Renderer {
      * (will return buffered context if double buffering is enabled, or a reference to the Screen Context)
      * @name getScreenContext
      * @memberof Renderer
-     * @function
      * @returns {CanvasRenderingContext2D}
      */
     getScreenContext() {
@@ -174,7 +169,6 @@ class Renderer {
      * returns the current blend mode for this renderer
      * @name getBlendMode
      * @memberof Renderer
-     * @function
      * @returns {string} blend mode
      */
     getBlendMode() {
@@ -186,7 +180,6 @@ class Renderer {
      * Also configures anti-aliasing and blend modes based on constructor options.
      * @name getContext2d
      * @memberof Renderer
-     * @function
      * @param {HTMLCanvasElement} canvas
      * @param {boolean} [transparent=true] use false to disable transparency
      * @returns {CanvasRenderingContext2D}
@@ -224,7 +217,6 @@ class Renderer {
      * return the width of the system Canvas
      * @name getWidth
      * @memberof Renderer
-     * @function
      * @returns {number}
      */
     getWidth() {
@@ -235,7 +227,6 @@ class Renderer {
      * return the height of the system Canvas
      * @name getHeight
      * @memberof Renderer
-     * @function
      * @returns {number} height of the system Canvas
      */
     getHeight() {
@@ -246,7 +237,6 @@ class Renderer {
      * get the current fill & stroke style color.
      * @name getColor
      * @memberof Renderer
-     * @function
      * @returns {Color} current global color
      */
     getColor() {
@@ -257,7 +247,6 @@ class Renderer {
      * return the current global alpha
      * @name globalAlpha
      * @memberof Renderer
-     * @function
      * @returns {number}
      */
     globalAlpha() {
@@ -268,7 +257,6 @@ class Renderer {
      * check if the given rect or bounds overlaps with the renderer screen coordinates
      * @name overlaps
      * @memberof Renderer
-     * @function
      * @param {Rect|Bounds} bounds
      * @returns {boolean} true if overlaps
      */
@@ -284,7 +272,6 @@ class Renderer {
      * resizes the system canvas
      * @name resize
      * @memberof Renderer
-     * @function
      * @param {number} width new width of the canvas
      * @param {number} height new height of the canvas
      */
@@ -305,7 +292,6 @@ class Renderer {
      * enable/disable image smoothing (scaling interpolation) for the given context
      * @name setAntiAlias
      * @memberof Renderer
-     * @function
      * @param {CanvasRenderingContext2D} context
      * @param {boolean} [enable=false]
      */
@@ -335,7 +321,6 @@ class Renderer {
      * set/change the current projection matrix (WebGL only)
      * @name setProjection
      * @memberof Renderer
-     * @function
      * @param {Matrix3d} matrix
      */
     setProjection(matrix) {
@@ -346,7 +331,6 @@ class Renderer {
      * stroke the given shape
      * @name stroke
      * @memberof Renderer
-     * @function
      * @param {Rect|RoundRect|Polygon|Line|Ellipse} shape a shape object to stroke
      * @param {boolean} [fill=false] fill the shape with the current color if true
      */
@@ -380,7 +364,6 @@ class Renderer {
      * fill the given shape
      * @name fill
      * @memberof Renderer
-     * @function
      * @param {Rect|RoundRect|Polygon|Line|Ellipse} shape a shape object to fill
      */
     fill(shape) {
@@ -391,7 +374,6 @@ class Renderer {
      * tint the given image or canvas using the given color
      * @name tint
      * @memberof Renderer
-     * @function
      * @param {HTMLImageElement|HTMLCanvasElement|OffscreenCanvas} src the source image to be tinted
      * @param {Color|string} color the color that will be used to tint the image
      * @param {string} [mode="multiply"] the composition mode used to tint the image
@@ -422,7 +404,6 @@ class Renderer {
      * Mask are not preserved through renderer context save and restore.
      * @name setMask
      * @memberof Renderer
-     * @function
      * @param {Rect|RoundRect|Polygon|Line|Ellipse} [mask] the shape defining the mask to be applied
      * @param {boolean} [invert=false] either the given shape should define what is visible (default) or the opposite
      */
@@ -434,7 +415,6 @@ class Renderer {
      * @name clearMask
      * @see Renderer#setMask
      * @memberof Renderer
-     * @function
      */
     clearMask() {}
 
@@ -442,7 +422,6 @@ class Renderer {
      * set a coloring tint for sprite based renderables
      * @name setTint
      * @memberof Renderer
-     * @function
      * @param {Color} tint the tint color
      * @param {number} [alpha] an alpha value to be applied to the tint
      */
@@ -457,7 +436,6 @@ class Renderer {
      * @name clearTint
      * @see Renderer#setTint
      * @memberof Renderer
-     * @function
      */
     clearTint() {
         // reset to default

package/src/video/texture/atlas.js

@@ -381,6 +381,8 @@ export class TextureAtlas {
      * add uvs mapping for the given region
      * @param {object} atlas the atlas dictionnary where the region is define
      * @param {object} name region (or frame) name
+     * @param {number} w the width of the region
+     * @param {number} h the height of the region
      * @returns {Float32Array} the created region UVs
      */
     addUVs(atlas, name, w, h) {

package/src/video/texture/cache.js

@@ -4,7 +4,6 @@ import { TextureAtlas, createAtlas } from "./atlas.js";
 import { isPowerOfTwo} from "./../../math/math.js";
 import {ArrayMultimap} from "@teppeis/multimaps";
 
-
 /**
  * a basic texture cache object
  * @ignore

package/src/video/texture/canvas_texture.js

@@ -1,5 +1,11 @@
 import { createCanvas } from "./../video.js";
 
+// default video settings
+var defaultAttributes = {
+    offscreenCanvas : false,
+    willReadFrequently : false
+};
+
 /**
  * Creates a Canvas Texture of the given size
  */
@@ -7,20 +13,26 @@ class CanvasTexture {
     /**
      * @param {number} width the desired width of the canvas
      * @param {number} height the desired height of the canvas
-     * @param {number} [offscreenCanvas=true] if the the canvas should be an OffscreenCanvas
+     * @param {object} attributes The attributes to create both the canvas and 2d context
+     * @param {boolean} [attributes.offscreenCanvas=false] will create an offscreenCanvas if true instead of a standard canvas
+     * @param {boolean} [attributes.willReadFrequently=false] Indicates whether or not a lot of read-back operations are planned
      */
-    constructor(width, height, offscreenCanvas = true) {
+    constructor(width, height, attributes = defaultAttributes) {
+
+        // clean up the given attributes
+        attributes = Object.assign(defaultAttributes, attributes || {});
+
         /**
          * the canvas created for this CanvasTexture
          * @type {HTMLCanvasElement|OffscreenCanvas}
          */
-        this.canvas = createCanvas(width, height, offscreenCanvas);
+        this.canvas = createCanvas(width, height, attributes.offscreenCanvas);
 
         /**
          * the rendering context of this CanvasTexture
          * @type {CanvasRenderingContext2D}
          */
-        this.context = this.canvas.getContext("2d");
+        this.context = this.canvas.getContext("2d", { willReadFrequently: attributes.willReadFrequently });
     }
 
     /**

package/src/video/video.js

@@ -382,17 +382,17 @@ export function init(width, height, options) {
  * @function video.createCanvas
  * @param {number} width width
  * @param {number} height height
- * @param {boolean} [offscreen=false] will returns an OffscreenCanvas if supported
+ * @param {boolean} [offscreenCanvas=false] will return an OffscreenCanvas if supported
  * @returns {HTMLCanvasElement|OffscreenCanvas}
  */
-export function createCanvas(width, height, offscreen = false) {
+export function createCanvas(width, height, offscreenCanvas = false) {
     var _canvas;
 
     if (width === 0 || height === 0) {
         throw new Error("width or height was zero, Canvas could not be initialized !");
     }
 
-    if (device.OffscreenCanvas === true && offscreen === true) {
+    if (device.OffscreenCanvas === true && offscreenCanvas === true) {
         _canvas = new OffscreenCanvas(0, 0);
         // stubbing style for compatibility,
         // as OffscreenCanvas is detached from the DOM

package/src/video/webgl/glshader.js

@@ -103,7 +103,6 @@ class GLShader {
      * Installs this shader program as part of current rendering state
      * @name bind
      * @memberof GLShader
-     * @function
      */
     bind() {
         this.gl.useProgram(this.program);
@@ -113,7 +112,6 @@ class GLShader {
      * returns the location of an attribute variable in this shader program
      * @name getAttribLocation
      * @memberof GLShader
-     * @function
      * @param {string} name the name of the attribute variable whose location to get.
      * @returns {GLint} number indicating the location of the variable name if found. Returns -1 otherwise
      */
@@ -130,7 +128,6 @@ class GLShader {
      * Set the uniform to the given value
      * @name setUniform
      * @memberof GLShader
-     * @function
      * @param {string} name the uniform name
      * @param {object|Float32Array} value the value to assign to that uniform
      * @example
@@ -153,7 +150,6 @@ class GLShader {
      * activate the given vertex attribute for this shader
      * @name setVertexAttributes
      * @memberof GLShader
-     * @function
      * @param {WebGLRenderingContext} gl the current WebGL rendering context
      * @param {object[]} attributes an array of vertex attributes
      * @param {number} vertexByteSize the size of a single vertex in bytes
@@ -177,7 +173,6 @@ class GLShader {
      * destroy this shader objects resources (program, attributes, uniforms)
      * @name destroy
      * @memberof GLShader
-     * @function
      */
     destroy() {
         this.uniforms = null;

package/src/video/webgl/utils/uniforms.js

@@ -47,9 +47,8 @@ export function extractUniforms(gl, shader) {
 
         descriptor[name] = {
             "get" : (function (name) {
-                /**
+                /*
                  * A getter for the uniform location
-                 * @ignore
                  */
                 return function () {
                     return locations[name];
@@ -57,18 +56,16 @@ export function extractUniforms(gl, shader) {
             })(name),
             "set" : (function (name, type, fn) {
                 if (type.indexOf("mat") === 0) {
-                    /**
+                    /*
                      * A generic setter for uniform matrices
-                     * @ignore
                      */
                     return function (val) {
                         gl[fn](locations[name], false, val);
                     };
                 }
                 else {
-                    /**
+                    /*
                      * A generic setter for uniform vectors
-                     * @ignore
                      */
                     return function (val) {
                         var fnv = fn;

package/src/video/webgl/webgl_compositor.js

@@ -156,7 +156,6 @@ class WebGLCompositor {
      * add vertex attribute property definition to the compositor
      * @name addAttribute
      * @memberof WebGLCompositor
-     * @function
      * @param {string} name name of the attribute in the vertex shader
      * @param {number} size number of components per vertex attribute. Must be 1, 2, 3, or 4.
      * @param {GLenum} type data type of each component in the array
@@ -204,7 +203,6 @@ class WebGLCompositor {
      * Sets the viewport
      * @name setViewport
      * @memberof WebGLCompositor
-     * @function
      * @param {number} x x position of viewport
      * @param {number} y y position of viewport
      * @param {number} w width of viewport
@@ -218,7 +216,6 @@ class WebGLCompositor {
      * Create a WebGL texture from an image
      * @name createTexture2D
      * @memberof WebGLCompositor
-     * @function
      * @param {number} unit Destination texture unit
      * @param {Image|HTMLCanvasElement|ImageData|Uint8Array[]|Float32Array[]} image Source image
      * @param {number} filter gl.LINEAR or gl.NEAREST
@@ -263,7 +260,6 @@ class WebGLCompositor {
      * delete the given WebGL texture
      * @name bindTexture2D
      * @memberof WebGLCompositor
-     * @function
      * @param {WebGLTexture} [texture] a WebGL texture to delete
      * @param {number} [unit] Texture unit to delete
      */
@@ -276,7 +272,6 @@ class WebGLCompositor {
      * returns the WebGL texture associated to the given texture unit
      * @name bindTexture2D
      * @memberof WebGLCompositor
-     * @function
      * @param {number} unit Texture unit to which a texture is bound
      * @returns {WebGLTexture} texture a WebGL texture
      */
@@ -288,7 +283,6 @@ class WebGLCompositor {
      * assign the given WebGL texture to the current batch
      * @name bindTexture2D
      * @memberof WebGLCompositor
-     * @function
      * @param {WebGLTexture} texture a WebGL texture
      * @param {number} unit Texture unit to which the given texture is bound
      */
@@ -316,7 +310,6 @@ class WebGLCompositor {
      * unbind the given WebGL texture, forcing it to be reuploaded
      * @name unbindTexture2D
      * @memberof WebGLCompositor
-     * @function
      * @param {WebGLTexture} [texture] a WebGL texture
      * @param {number} [unit] a WebGL texture
      * @returns {number} unit the unit number that was associated with the given texture
@@ -363,7 +356,6 @@ class WebGLCompositor {
      * set/change the current projection matrix
      * @name setProjection
      * @memberof WebGLCompositor
-     * @function
      * @param {Matrix3d} matrix
      */
     setProjection(matrix) {
@@ -375,7 +367,6 @@ class WebGLCompositor {
      * @name useShader
      * @see GLShader
      * @memberof WebGLCompositor
-     * @function
      * @param {GLShader} shader a reference to a GLShader instance
      */
     useShader(shader) {
@@ -392,7 +383,6 @@ class WebGLCompositor {
      * Add a textured quad
      * @name addQuad
      * @memberof WebGLCompositor
-     * @function
      * @param {TextureAtlas} texture Source texture atlas
      * @param {number} x Destination x-coordinate
      * @param {number} y Destination y-coordinate
@@ -449,7 +439,6 @@ class WebGLCompositor {
      * Flush batched texture operations to the GPU
      * @param {number} [mode=gl.TRIANGLES] the GL drawing mode
      * @memberof WebGLCompositor
-     * @function
      */
     flush(mode = this.mode) {
         var vertex = this.vertexBuffer;
@@ -477,7 +466,6 @@ class WebGLCompositor {
      * Draw an array of vertices
      * @name drawVertices
      * @memberof WebGLCompositor
-     * @function
      * @param {GLenum} mode primitive type to render (gl.POINTS, gl.LINE_STRIP, gl.LINE_LOOP, gl.LINES, gl.TRIANGLE_STRIP, gl.TRIANGLE_FAN, gl.TRIANGLES)
      * @param {Vector2d[]} verts vertices
      * @param {number} [vertexCount=verts.length] amount of points defined in the points array
@@ -507,7 +495,6 @@ class WebGLCompositor {
      * Specify the color values used when clearing color buffers. The values are clamped between 0 and 1.
      * @name clearColor
      * @memberof WebGLCompositor
-     * @function
      * @param {number} [r=0] - the red color value used when the color buffers are cleared
      * @param {number} [g=0] - the green color value used when the color buffers are cleared
      * @param {number} [b=0] - the blue color value used when the color buffers are cleared
@@ -521,7 +508,6 @@ class WebGLCompositor {
      * Clear the frame buffer
      * @name clear
      * @memberof WebGLCompositor
-     * @function
      */
     clear() {
         this.gl.clear(this.gl.COLOR_BUFFER_BIT);