melonjs 15.3.0 → 15.4.0

package/src/system/event.js

@@ -41,6 +41,28 @@ export const BOOT = "me.boot";
  */
 export const TICK = "me.tick";
 
+/**
+ * event generated when the main browser or window is losing focus
+ * @public
+ * @constant
+ * @type {string}
+ * @name BLUR
+ * @memberof event
+ * @see event.on
+ */
+export const BLUR = "me.blur";
+
+/**
+ * event generated when the main browser or window is gaining back focus
+ * @public
+ * @constant
+ * @type {string}
+ * @name FOCUS
+ * @memberof event
+ * @see event.on
+ */
+export const FOCUS = "me.focus";
+
 /**
  * event when the game is paused <br>
  * Data passed : none <br>

package/src/system/platform.js

@@ -1,21 +1,21 @@
- /**
-  * The device platform type
-  * @namespace platform
-  * @memberof device
-  * @property {string} ua the user agent string for the current device
-  * @property {boolean} iOS `true` if the device is an iOS platform
-  * @property {boolean} android `true` if the device is an Android platform
-  * @property {boolean} android2 `true` if the device is an Android 2.x platform
-  * @property {boolean} linux `true` if the device is a Linux platform
-  * @property {boolean} chromeOS `true` if the device is running on ChromeOS.
-  * @property {boolean} wp `true` if the device is a Windows Phone platform
-  * @property {boolean} BlackBerry`true` if the device is a BlackBerry platform
-  * @property {boolean} Kindle`true` if the device is a Kindle platform
-  * @property {boolean} ejecta `true` if running under Ejecta
-  * @property {boolean} isWeixin `true` if running under Wechat
-  * @property {boolean} nodeJS `true` if running under node.js
-  * @property {boolean} isMobile `true` if a mobile device
-  */
+/**
+* The device platform type
+* @namespace platform
+* @memberof device
+* @property {string} ua the user agent string for the current device
+* @property {boolean} iOS `true` if the device is an iOS platform
+* @property {boolean} android `true` if the device is an Android platform
+* @property {boolean} android2 `true` if the device is an Android 2.x platform
+* @property {boolean} linux `true` if the device is a Linux platform
+* @property {boolean} chromeOS `true` if the device is running on ChromeOS.
+* @property {boolean} wp `true` if the device is a Windows Phone platform
+* @property {boolean} BlackBerry`true` if the device is a BlackBerry platform
+* @property {boolean} Kindle`true` if the device is a Kindle platform
+* @property {boolean} ejecta `true` if running under Ejecta
+* @property {boolean} isWeixin `true` if running under Wechat
+* @property {boolean} nodeJS `true` if running under node.js
+* @property {boolean} isMobile `true` if a mobile device
+*/
 
 export const ua = typeof globalThis.navigator !== "undefined" ? globalThis.navigator.userAgent : "";
 export const iOS = /iPhone|iPad|iPod/i.test(ua);

package/src/system/pooling.js

@@ -38,15 +38,15 @@ class ObjectPool {
      * me.pool.register("cherrysprite", Cherry, true);
      */
     register(className, classObj, recycling = false) {
-         if (typeof (classObj) !== "undefined") {
-             this.objectClass[className] = {
-                 "class" : classObj,
-                 "pool" : (recycling ? [] : undefined)
-             };
-         } else {
-             throw new Error("Cannot register object '" + className + "', invalid class");
-         }
-     }
+        if (typeof (classObj) !== "undefined") {
+            this.objectClass[className] = {
+                "class" : classObj,
+                "pool" : (recycling ? [] : undefined)
+            };
+        } else {
+            throw new Error("Cannot register object '" + className + "', invalid class");
+        }
+    }
 
     /**
      * Pull a new instance of the requested object (if added into the object pool)

package/src/tweens/tween.js

@@ -23,7 +23,7 @@ import { Interpolation } from "./interpolation.js";
  * author lechecacharro<br>
  * author Josh Faul / http://jocafa.com/
  */
- export default class Tween {
+export default class Tween {
 
     /**
      * @param {object} object - object on which to apply the tween

package/src/utils/function.js

@@ -23,8 +23,7 @@ export function defer(func, thisArg, ...args) {
 }
 
 /**
- * returns a function that, when invoked will only be triggered at most
- * once during a given window of time
+ * returns a function that, when invoked will only be triggered at most once during a given window of time
  * @public
  * @memberof utils.function
  * @name throttle

package/src/video/canvas/canvas_renderer.js

@@ -12,7 +12,7 @@ import * as event from "./../../system/event.js";
  * a canvas renderer object
  * @augments Renderer
  */
- export default class CanvasRenderer extends Renderer {
+export default class CanvasRenderer extends Renderer {
     /**
      * @param {Application.Settings} [options] - optional parameters for the renderer
      */
@@ -527,11 +527,7 @@ import * as event from "./../../system/event.js";
     setColor(color) {
         let context = this.getContext();
         context.strokeStyle =
-        context.fillStyle = (
-            color instanceof Color ?
-            color.toRGBA() :
-            color
-        );
+        context.fillStyle = (color instanceof Color ? color.toRGBA() : color);
     }
 
     /**

package/src/video/renderer.js

@@ -18,7 +18,7 @@ import Point from "../geometries/point.js";
  * @classdesc
  * a base renderer object
  */
- export default class Renderer {
+export default class Renderer {
     /**
      * @param {Application.Settings} [options] - optional parameters for the renderer
      */
@@ -33,7 +33,7 @@ import Point from "../geometries/point.js";
         /**
          * the requested video size ratio
          * @public
-         * @type {Number}
+         * @type {number}
          */
         this.designRatio = this.settings.width / this.settings.height;
 
@@ -190,7 +190,7 @@ import Point from "../geometries/point.js";
         }
 
         let _context = canvas.getContext("2d", {
-                "alpha" : transparent
+            "alpha" : transparent
         });
 
         if (!_context.canvas) {
@@ -406,10 +406,10 @@ import Point from "../geometries/point.js";
 
     /**
      * creates a Blob object representing the last rendered frame
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning a Blob object representing the last rendered frame
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning a Blob object representing the last rendered frame
      * @example
      * renderer.convertToBlob().then((blob) => console.log(blob));
      */
@@ -426,10 +426,10 @@ import Point from "../geometries/point.js";
     /**
      * creates an ImageBitmap object of the last frame rendered
      * (not supported by standard Canvas)
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning an ImageBitmap.
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning an ImageBitmap.
      * @example
      * renderer.transferToImageBitmap().then((image) => console.log(image));
      */
@@ -447,10 +447,10 @@ import Point from "../geometries/point.js";
 
     /**
      * returns a data URL containing a representation of the last frame rendered
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning a string containing the requested data URL.
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning a string containing the requested data URL.
      * @example
      * renderer.toDataURL().then((dataURL) => console.log(dataURL));
      */

package/src/video/texture/atlas.js

@@ -10,18 +10,18 @@ import { ETA } from "./../../math/math.js";
  * @ignore
  */
 export function createAtlas(width, height, name = "default", repeat = "no-repeat") {
-   return {
-       "meta" : {
-           "app" : "melonJS",
-           "size" : { "w" : width, "h" : height },
-           "repeat" : repeat,
-           "image" : "default"
-       },
-       "frames" : [{
-           "filename" : name,
-           "frame" : { "x" : 0, "y" : 0, "w" : width, "h" : height }
-       }]
-   };
+    return {
+        "meta" : {
+            "app" : "melonJS",
+            "size" : { "w" : width, "h" : height },
+            "repeat" : repeat,
+            "image" : "default"
+        },
+        "frames" : [{
+            "filename" : name,
+            "frame" : { "x" : 0, "y" : 0, "w" : width, "h" : height }
+        }]
+    };
 }
 
 /**

package/src/video/texture/canvas_texture.js

@@ -62,7 +62,7 @@ class CanvasTexture {
 
     /**
      * enable/disable image smoothing (scaling interpolation)
-     * @param {boolean} [enable=false]
+     * @param {boolean} [enable=false] - whether to enable or not image smoothing (scaling interpolation)
      */
     setAntiAlias(enable = false) {
         let canvas = this.canvas;
@@ -105,7 +105,7 @@ class CanvasTexture {
      * @param {number} y - The y-axis coordinate of the top-left corner of the rectangle from which the ImageData will be extracted
      * @param {number} width - The width of the rectangle from which the ImageData will be extracted. Positive values are to the right, and negative to the left
      * @param {number} height - The height of the rectangle from which the ImageData will be extracted. Positive values are down, and negative are up
-     * @return {ImageData} The ImageData extracted from this CanvasTexture.
+     * @returns {ImageData} The ImageData extracted from this CanvasTexture.
      */
     getImageData(x, y, width, height) {
         // clamp values
@@ -119,10 +119,10 @@ class CanvasTexture {
 
     /**
      * creates a Blob object representing the image contained in this canvas texture
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning a Blob object representing the image contained in this canvas texture
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning a Blob object representing the image contained in this canvas texture
      * @example
      * canvasTexture.convertToBlob().then((blob) => console.log(blob));
      */
@@ -140,10 +140,10 @@ class CanvasTexture {
 
     /**
      * creates an ImageBitmap object from the most recently rendered image of this canvas texture
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning an ImageBitmap.
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning an ImageBitmap.
      * @example
      * canvasTexture.transferToImageBitmap().then((bitmap) => console.log(bitmap));
      */
@@ -164,10 +164,10 @@ class CanvasTexture {
     /**
      * returns a data URL containing a representation of the most recently rendered image of this canvas texture
      * (not supported by OffscreenCanvas)
-     * @param {Object} [options] - An object with the following properties:
-     * @param {String} [options.type="image/png"] - A string indicating the image format
-     * @param {Number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
-     * @return {Promise} A Promise returning a string containing the requested data URL.
+     * @param {object} [options] - An object with the following properties:
+     * @param {string} [options.type="image/png"] - A string indicating the image format
+     * @param {number} [options.quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.
+     * @returns {Promise} A Promise returning a string containing the requested data URL.
      * @example
      * renderer.toDataURL().then((dataURL) => console.log(dataURL));
      */

package/src/video/video.js

@@ -61,7 +61,7 @@ export function init(width, height, options) {
     }
 
     try {
-         // initialize the default game Application with the given options
+        // initialize the default game Application with the given options
         game.init(width, height, options);
     } catch (e) {
         console.log(e.message);
@@ -123,7 +123,7 @@ export function init(width, height, options) {
  * @param {number} width - width
  * @param {number} height - height
  * @param {boolean} [returnOffscreenCanvas=false] - will return an OffscreenCanvas if supported
- * @returns {HTMLCanvasElement|OffscreenCanvas}
+ * @returns {HTMLCanvasElement|OffscreenCanvas} a new Canvas element of the given size
  */
 export function createCanvas(width, height, returnOffscreenCanvas = false) {
     let _canvas;
@@ -152,7 +152,7 @@ export function createCanvas(width, height, returnOffscreenCanvas = false) {
 /**
  * return a reference to the parent DOM element holding the main canvas
  * @memberof video
- * @returns {HTMLElement}
+ * @returns {HTMLElement} the HTML parent element
  */
 export function getParent() {
     return game.getParentElement();

package/src/video/webgl/buffer/vertex.js

@@ -5,7 +5,7 @@
  * @ignore
  */
 
- export default class VertexArrayBuffer {
+export default class VertexArrayBuffer {
 
     constructor(vertex_size, vertex_per_obj) {
         // the size of one vertex in float
@@ -38,7 +38,7 @@
      * @ignore
      */
     isFull(vertex = this.objSize) {
-         return (this.vertexCount + vertex >= this.maxVertex);
+        return (this.vertexCount + vertex >= this.maxVertex);
     }
 
     /**

package/src/video/webgl/compositors/compositor.js

@@ -5,19 +5,19 @@ import GLShader from "../glshader.js";
  * @classdesc
  * A base Compositor object.
  */
- export default class Compositor {
+export default class Compositor {
     /**
      * @param {WebGLRenderer} renderer - the current WebGL renderer session
-     * @param {Object} settings - additional settings to initialize this compositors
-     * @param {object[]} attribute - an array of attributes definition
-     * @param {string} attribute.name - name of the attribute in the vertex shader
-     * @param {number} attribute.size - number of components per vertex attribute. Must be 1, 2, 3, or 4.
-     * @param {GLenum} attribute.type - data type of each component in the array
-     * @param {boolean} attribute.normalized - whether integer data values should be normalized into a certain range when being cast to a float
-     * @param {number} attribute.offset - offset in bytes of the first component in the vertex attribute array
-     * @param {object} shader - an array of attributes definition
-     * @param {string} shader.vertex - a string containing the GLSL source code to set
-     * @param {string} shader.fragment - a string containing the GLSL source code to set
+     * @param {object} settings - additional settings to initialize this compositors
+     * @param {object[]} settings.attribute - an array of attributes definition
+     * @param {string} settings.attribute.name - name of the attribute in the vertex shader
+     * @param {number} settings.attribute.size - number of components per vertex attribute. Must be 1, 2, 3, or 4.
+     * @param {GLenum} settings.attribute.type - data type of each component in the array
+     * @param {boolean} settings.attribute.normalized - whether integer data values should be normalized into a certain range when being cast to a float
+     * @param {number} settings.attribute.offset - offset in bytes of the first component in the vertex attribute array
+     * @param {object} settings.shader - an array of attributes definition
+     * @param {string} settings.shader.vertex - a string containing the GLSL source code to set
+     * @param {string} settings.shader.fragment - a string containing the GLSL source code to set
      */
     constructor (renderer, settings) {
         this.init(renderer, settings);
@@ -119,7 +119,6 @@ import GLShader from "../glshader.js";
     }
 
     /**
-     * @ignore
      * called by the WebGL renderer when a compositor become the current one
      */
     bind() {
@@ -192,7 +191,7 @@ import GLShader from "../glshader.js";
 
     /**
      * set/change the current projection matrix
-     * @param {Matrix3d} matrix
+     * @param {Matrix3d} matrix - the new projection matrix
      */
     setProjection(matrix) {
         this.currentShader.setUniform("uProjectionMatrix", matrix);

package/src/video/webgl/compositors/primitive_compositor.js

@@ -8,7 +8,7 @@ import Compositor from "./compositor.js";
  * Pushes texture regions or shape geometry into WebGL buffers, automatically flushes to GPU
  * @augments Compositor
  */
- export default class PrimitiveCompositor extends Compositor {
+export default class PrimitiveCompositor extends Compositor {
 
     /**
      * Initialize the compositor
@@ -35,8 +35,8 @@ import Compositor from "./compositor.js";
     drawVertices(mode, verts, vertexCount = verts.length) {
         let viewMatrix = this.viewMatrix;
         let vertexData = this.vertexData;
-        let color = this.renderer.currentColor;
         let alpha = this.renderer.getGlobalAlpha();
+        let colorUint32 = this.renderer.currentColor.toUint32(alpha);
 
         if (vertexData.isFull(vertexCount)) {
             // is the vertex buffer full if we add more vertices
@@ -52,11 +52,11 @@ import Compositor from "./compositor.js";
         if (!viewMatrix.isIdentity()) {
             verts.forEach((vert) => {
                 viewMatrix.apply(vert);
-                vertexData.push(vert.x, vert.y, undefined, undefined, color.toUint32(alpha));
+                vertexData.push(vert.x, vert.y, undefined, undefined, colorUint32);
             });
         } else {
             verts.forEach((vert) => {
-                vertexData.push(vert.x, vert.y, undefined, undefined, color.toUint32(alpha));
+                vertexData.push(vert.x, vert.y, undefined, undefined, colorUint32);
             });
         }
 

package/src/video/webgl/compositors/quad_compositor.js

@@ -18,7 +18,7 @@ let V_ARRAY = [
  * Pushes texture regions or shape geometry into WebGL buffers, automatically flushes to GPU
  * @augments Compositor
  */
- export default class QuadCompositor extends Compositor {
+export default class QuadCompositor extends Compositor {
 
     /**
      * Initialize the compositor
@@ -108,7 +108,6 @@ let V_ARRAY = [
     /**
      * delete the given WebGL texture
      * @param {WebGLTexture} [texture] - a WebGL texture to delete
-     * @param {number} [unit] - Texture unit to delete
      */
     deleteTexture2D(texture) {
         this.gl.deleteTexture(texture);

package/src/video/webgl/glshader.js

@@ -9,7 +9,7 @@ import { minify } from "./utils/string.js";
  * @classdesc
  * a base GL Shader object
  */
- export default class GLShader {
+export default class GLShader {
     /**
      * @param {WebGLRenderingContext} gl - the current WebGL rendering context
      * @param {string} vertex - a string containing the GLSL source code to set

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

@@ -13,17 +13,17 @@ export function setPrecision(src, precision) {
 /**
  * return the highest precision format supported by this device for GL Shaders
  * @ignore
- * @param {WebGLRenderingContext} gl
+ * @param {WebGLRenderingContext} gl - the current WebGL context
  * @returns {boolean} "lowp", "mediump", or "highp"
  */
 export function getMaxShaderPrecision(gl) {
     if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.HIGH_FLOAT ).precision > 0 &&
         gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.HIGH_FLOAT ).precision > 0) {
-            return "highp";
+        return "highp";
     }
     if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.MEDIUM_FLOAT ).precision > 0 &&
         gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.MEDIUM_FLOAT ).precision > 0) {
-            return "mediump";
+        return "mediump";
     }
     return "lowp";
 }