melonjs 10.12.0 → 11.0.0

package/dist/melonjs.module.d.ts

@@ -2806,11 +2806,12 @@ export class Light2d extends Renderable {
     /**
      * @param {number} x - The horizontal position of the light.
      * @param {number} y - The vertical position of the light.
-     * @param {number} radius - The radius of the light.
+     * @param {number} radiusX - The horizontal radius of the light.
+     * @param {number} [radiusY=radiusX] - The vertical radius of the light.
      * @param {Color|string} [color="#FFF"] the color of the light
      * @param {number} [intensity=0.7] - The intensity of the light.
      */
-    constructor(x: number, y: number, radius: number, color?: Color | string, intensity?: number);
+    constructor(x: number, y: number, radiusX: number, radiusY?: number, color?: Color | string, intensity?: number);
     /**
      * the color of the light
      * @type {Color}
@@ -2818,10 +2819,15 @@ export class Light2d extends Renderable {
      */
     color: Color;
     /**
-     * The radius of the light
+     * The horizontal radius of the light
      * @type {number}
      */
-    radius: number;
+    radiusX: number;
+    /**
+     * The vertical radius of the light
+     * @type {number}
+     */
+    radiusY: number;
     /**
      * The intensity of the light
      * @type {number}
@@ -9759,6 +9765,7 @@ export namespace device {
 }
 export var event: Readonly<{
     __proto__: any;
+    DOM_READY: string;
     BOOT: string;
     STATE_PAUSE: string;
     STATE_RESUME: string;

package/dist/melonjs.module.js

@@ -1,5 +1,5 @@
 /*!
- * melonJS Game Engine - v10.12.0
+ * melonJS Game Engine - v11.0.0
  * http://www.melonjs.org
  * melonjs is licensed under the MIT License.
  * http://www.opensource.org/licenses/mit-license
@@ -309,10 +309,10 @@ var store$2 = sharedStore;
 (shared$3.exports = function (key, value) {
   return store$2[key] || (store$2[key] = value !== undefined ? value : {});
 })('versions', []).push({
-  version: '3.23.1',
+  version: '3.23.2',
   mode: 'global',
   copyright: '© 2014-2022 Denis Pushkarev (zloirock.ru)',
-  license: 'https://github.com/zloirock/core-js/blob/v3.23.1/LICENSE',
+  license: 'https://github.com/zloirock/core-js/blob/v3.23.2/LICENSE',
   source: 'https://github.com/zloirock/core-js'
 });
 
@@ -4337,6 +4337,17 @@ var EventEmitter = eventemitter3.exports;
 // internal instance of the event emiter
 var eventEmitter = new EventEmitter();
 
+/**
+ * event when the DOM is Ready is booting
+ * @public
+ * @constant
+ * @type {string}
+ * @name DOM_READY
+ * @memberof event
+ * @see event.on
+ */
+const DOM_READY = "dom_ready";
+
 /**
  * event when the system is booting
  * @public
@@ -4843,6 +4854,7 @@ function off(eventName, listener) {
 
 var event = /*#__PURE__*/Object.freeze({
 	__proto__: null,
+	DOM_READY: DOM_READY,
 	BOOT: BOOT,
 	STATE_PAUSE: STATE_PAUSE,
 	STATE_RESUME: STATE_RESUME,
@@ -28375,33 +28387,17 @@ var save = {
     }
 };
 
-// private properties
-let accelInitialized = false;
-let deviceOrientationInitialized = false;
+// track if DOMContentLoaded was called already
+let readyBound = false;
 
-// swipe utility fn & flag
-let swipeEnabled = true;
+// is the DOM ready ?
+let isDOMReady = false;
 
-/**
- * @ignore
- */
-function _disableSwipeFn(e) {
-    e.preventDefault();
-    if (typeof globalThis.scroll === "function") {
-        globalThis.scroll(0, 0);
-    }
-    return false;
-}
-// DOM loading stuff
-let readyBound = false, isReady = false, readyList = [];
-
-/**
- * // called to check if the device is ready
- * @ignore
- */
+// check if the dom is ready
 function _domReady() {
+
     // Make sure that the DOM is not already loaded
-    if (!isReady) {
+    if (!isDOMReady) {
         // be sure document.body is there
         if (typeof globalThis.document !== "undefined" && !globalThis.document.body) {
             return setTimeout(_domReady, 13);
@@ -28411,7 +28407,7 @@ function _domReady() {
         if (typeof globalThis.document !== "undefined" && typeof globalThis.document.removeEventListener === "function") {
             globalThis.document.removeEventListener(
                 "DOMContentLoaded",
-                this._domReady,
+                _domReady,
                 false
             );
         }
@@ -28422,13 +28418,58 @@ function _domReady() {
         }
 
         // execute all callbacks
-        while (readyList.length) {
-            readyList.shift().call(globalThis, []);
-        }
+        emit(DOM_READY);
 
         // Remember that the DOM is ready
-        isReady = true;
+        isDOMReady = true;
+    }
+}
+// https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event
+function DOMContentLoaded(fn) {
+    // If the DOM is already ready
+    if (isDOMReady) {
+        // Execute the function immediately
+        fn.call(globalThis, []);
+    }
+    else {
+        // else add the function to the DOM_READY event
+        once(DOM_READY, fn, globalThis);
+        // bind dom load event if not done yet
+        if (!readyBound) {
+            // directly call domReady if document is already "ready"
+            if (((typeof process !== "undefined") && (process.release.name === "node")) || (typeof globalThis.document !== "undefined" && globalThis.document.readyState === "complete")) {
+                // defer the fn call to ensure our script is fully loaded
+                globalThis.setTimeout(_domReady, 0);
+            }
+            else {
+                if (typeof globalThis.document !== "undefined" && typeof globalThis.document.addEventListener === "function") {
+                    // Use the handy event callback
+                    globalThis.document.addEventListener("DOMContentLoaded", _domReady, false);
+                }
+                // A fallback to globalThis.onload, that will always work
+                globalThis.addEventListener("load", _domReady, false);
+            }
+            readyBound = true;
+        }
+    }
+}
+
+// private properties
+let accelInitialized = false;
+let deviceOrientationInitialized = false;
+
+// swipe utility fn & flag
+let swipeEnabled = true;
+
+/**
+ * @ignore
+ */
+function _disableSwipeFn(e) {
+    e.preventDefault();
+    if (typeof globalThis.scroll === "function") {
+        globalThis.scroll(0, 0);
     }
+    return false;
 }
 // a cache DOMRect object
 let _domRect = {left: 0, top: 0, x: 0, y: 0, width: 0, height: 0, right: 0, bottom: 0};
@@ -28784,7 +28825,7 @@ let device = {
      * @readonly
      * @name nodeJS
      */
-    nodeJS : (typeof process !== "undefined") && (process.release.name === "node"),
+    nodeJS : (typeof globalThis.process !== "undefined") && (typeof globalThis.process.release !== "undefined") && (globalThis.process.release.name === "node"),
 
     /**
      * equals to true if the device is running on ChromeOS.
@@ -28972,33 +29013,7 @@ let device = {
     * });
     */
     onReady(fn) {
-        // If the DOM is already ready
-        if (isReady) {
-            // Execute the function immediately
-            fn.call(globalThis, []);
-        }
-        else {
-            // Add the function to the wait list
-            readyList.push(fn);
-
-            // attach listeners if not yet done
-            if (!readyBound) {
-                // directly call domReady if document is already "ready"
-                if (device.nodeJS === true || (typeof globalThis.document !== "undefined" && globalThis.document.readyState === "complete")) {
-                    // defer the fn call to ensure our script is fully loaded
-                    globalThis.setTimeout(_domReady, 0);
-                }
-                else {
-                    if (typeof globalThis.document !== "undefined" && typeof globalThis.document.addEventListener === "function") {
-                        // Use the handy event callback
-                        globalThis.document.addEventListener("DOMContentLoaded", _domReady, false);
-                    }
-                    // A fallback to globalThis.onload, that will always work
-                    globalThis.addEventListener("load", _domReady, false);
-                }
-                readyBound = true;
-            }
-        }
+        DOMContentLoaded(fn);
     },
 
     /**
@@ -32800,10 +32815,10 @@ class BasePlugin {
          * this can be overridden by the plugin
          * @public
          * @type {string}
-         * @default "10.12.0"
+         * @default "11.0.0"
          * @name plugin.Base#version
          */
-        this.version = "10.12.0";
+        this.version = "11.0.0";
     }
 }
 
@@ -36102,19 +36117,41 @@ class Trigger extends Renderable {
 /** @ignore */
 function createGradient(light) {
     var context = light.texture.context;
-    var x1 = light.texture.width / 2;
-    var y1 = light.texture.height / 2;
-    var gradient = context.createRadialGradient(x1, y1, 0, x1, y1, light.radius);
+
+    var x1 = light.texture.width / 2,
+        y1 = light.texture.height / 2;
+
+    var radiusX = light.radiusX,
+        radiusY = light.radiusY;
+
+    var scaleX, scaleY, invScaleX, invScaleY;
+    var gradient;
+
 
     light.texture.clear();
 
+    if (radiusX >= radiusY) {
+        scaleX = 1;
+        invScaleX = 1;
+        scaleY = radiusY/radiusX;
+        invScaleY = radiusX/radiusY;
+        gradient = context.createRadialGradient(x1, y1 * invScaleY, 0, x1, radiusY * invScaleY, radiusX);
+    }
+    else {
+        scaleY = 1;
+        invScaleY = 1;
+        scaleX = radiusX/radiusY;
+        invScaleX = radiusY/radiusX;
+        gradient = context.createRadialGradient(x1 * invScaleX, y1, 0, x1 * invScaleX, y1, radiusY);
+    }
+
     gradient.addColorStop( 0, light.color.toRGBA(light.intensity));
     gradient.addColorStop( 1, light.color.toRGBA(0.0));
 
-    context.beginPath();
     context.fillStyle = gradient;
-    context.arc(x1, y1, light.radius, 0, Math.PI * 2, false);
-    context.fill();
+
+    context.setTransform(scaleX, 0, 0, scaleY, 0, 0);
+    context.fillRect(0, 0, light.texture.width * invScaleX, light.texture.height * invScaleY);
 }
 
 /**
@@ -36129,13 +36166,14 @@ class Light2d extends Renderable {
    /**
     * @param {number} x - The horizontal position of the light.
     * @param {number} y - The vertical position of the light.
-    * @param {number} radius - The radius of the light.
+    * @param {number} radiusX - The horizontal radius of the light.
+    * @param {number} [radiusY=radiusX] - The vertical radius of the light.
     * @param {Color|string} [color="#FFF"] the color of the light
     * @param {number} [intensity=0.7] - The intensity of the light.
     */
-    constructor(x, y, radius, color = "#FFF", intensity = 0.7) {
+    constructor(x, y, radiusX, radiusY = radiusX, color = "#FFF", intensity = 0.7) {
         // call the parent constructor
-        super(x, y, radius * 2, radius * 2);
+        super(x, y, radiusX * 2, radiusY * 2);
 
         /**
          * the color of the light
@@ -36145,10 +36183,16 @@ class Light2d extends Renderable {
         this.color = pool.pull("Color").parseCSS(color);
 
         /**
-         * The radius of the light
+         * The horizontal radius of the light
          * @type {number}
          */
-        this.radius = radius;
+        this.radiusX = radiusX;
+
+        /**
+         * The vertical radius of the light
+         * @type {number}
+         */
+        this.radiusY = radiusY;
 
         /**
          * The intensity of the light
@@ -37526,7 +37570,7 @@ class DroptargetEntity extends DropTarget {
  * @name version
  * @type {string}
  */
-const version = "10.12.0";
+const version = "11.0.0";
 
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "melonjs",
-  "version": "10.12.0",
+  "version": "11.0.0",
   "description": "melonJS Game Engine",
   "homepage": "http://www.melonjs.org/",
   "keywords": [
@@ -55,7 +55,7 @@
   ],
   "dependencies": {
     "@teppeis/multimaps": "^2.0.0",
-    "core-js": "^3.23.1",
+    "core-js": "^3.23.2",
     "earcut": "2.2.3",
     "eventemitter3": "^4.0.7",
     "howler": "2.2.3"
@@ -77,7 +77,7 @@
     "karma-html-detailed-reporter": "^2.1.0",
     "karma-jasmine": "^5.1.0",
     "karma-nyan-reporter": "0.2.5",
-    "rollup": "^2.75.6",
+    "rollup": "^2.75.7",
     "rollup-plugin-bundle-size": "^1.0.3",
     "rollup-plugin-string": "^3.0.0",
     "terser": "^5.14.1",
@@ -90,7 +90,7 @@
     "lint": "eslint src rollup.config.js",
     "test": "npm run test-node && karma start tests/karma.conf.cjs",
     "test-node": "node build/melonjs.module.js",
-    "doc": "mkdirp docs && webdoc --quiet --site-root docs -R README.md",
+    "doc": "mkdirp docs && webdoc --quiet --site-root melonJS/docs -R README.md",
     "serve": "python3 -m http.server",
     "prepublishOnly": "npm run dist && npm run test",
     "clean": "del-cli --force build/*.js dist/*.js dist/*.d.ts docs src/**/*.d.ts",

package/src/renderable/light2d.js

@@ -4,19 +4,41 @@ import Renderable from "./renderable.js";
 /** @ignore */
 function createGradient(light) {
     var context = light.texture.context;
-    var x1 = light.texture.width / 2;
-    var y1 = light.texture.height / 2;
-    var gradient = context.createRadialGradient(x1, y1, 0, x1, y1, light.radius);
+
+    var x1 = light.texture.width / 2,
+        y1 = light.texture.height / 2;
+
+    var radiusX = light.radiusX,
+        radiusY = light.radiusY;
+
+    var scaleX, scaleY, invScaleX, invScaleY;
+    var gradient;
+
 
     light.texture.clear();
 
+    if (radiusX >= radiusY) {
+        scaleX = 1;
+        invScaleX = 1;
+        scaleY = radiusY/radiusX;
+        invScaleY = radiusX/radiusY;
+        gradient = context.createRadialGradient(x1, y1 * invScaleY, 0, x1, radiusY * invScaleY, radiusX);
+    }
+    else {
+        scaleY = 1;
+        invScaleY = 1;
+        scaleX = radiusX/radiusY;
+        invScaleX = radiusY/radiusX;
+        gradient = context.createRadialGradient(x1 * invScaleX, y1, 0, x1 * invScaleX, y1, radiusY);
+    }
+
     gradient.addColorStop( 0, light.color.toRGBA(light.intensity));
     gradient.addColorStop( 1, light.color.toRGBA(0.0));
 
-    context.beginPath();
     context.fillStyle = gradient;
-    context.arc(x1, y1, light.radius, 0, Math.PI * 2, false);
-    context.fill();
+
+    context.setTransform(scaleX, 0, 0, scaleY, 0, 0);
+    context.fillRect(0, 0, light.texture.width * invScaleX, light.texture.height * invScaleY);
 }
 
 /**
@@ -31,13 +53,14 @@ class Light2d extends Renderable {
    /**
     * @param {number} x - The horizontal position of the light.
     * @param {number} y - The vertical position of the light.
-    * @param {number} radius - The radius of the light.
+    * @param {number} radiusX - The horizontal radius of the light.
+    * @param {number} [radiusY=radiusX] - The vertical radius of the light.
     * @param {Color|string} [color="#FFF"] the color of the light
     * @param {number} [intensity=0.7] - The intensity of the light.
     */
-    constructor(x, y, radius, color = "#FFF", intensity = 0.7) {
+    constructor(x, y, radiusX, radiusY = radiusX, color = "#FFF", intensity = 0.7) {
         // call the parent constructor
-        super(x, y, radius * 2, radius * 2);
+        super(x, y, radiusX * 2, radiusY * 2);
 
         /**
          * the color of the light
@@ -47,10 +70,16 @@ class Light2d extends Renderable {
         this.color = pool.pull("Color").parseCSS(color);
 
         /**
-         * The radius of the light
+         * The horizontal radius of the light
+         * @type {number}
+         */
+        this.radiusX = radiusX;
+
+        /**
+         * The vertical radius of the light
          * @type {number}
          */
-        this.radius = radius;
+        this.radiusY = radiusY;
 
         /**
          * The intensity of the light

package/src/system/device.js

@@ -4,6 +4,7 @@ import save from "./save.js";
 import { prefixed } from "./../utils/agent.js";
 import state from "./../state/state.js";
 import * as event from "./event.js";
+import { DOMContentLoaded } from "./dom.js";
 
 // private properties
 let accelInitialized = false;
@@ -23,45 +24,6 @@ function _disableSwipeFn(e) {
     return false;
 };
 
-// DOM loading stuff
-let readyBound = false, isReady = false, readyList = [];
-
-/**
- * // called to check if the device is ready
- * @ignore
- */
-function _domReady() {
-    // Make sure that the DOM is not already loaded
-    if (!isReady) {
-        // be sure document.body is there
-        if (typeof globalThis.document !== "undefined" && !globalThis.document.body) {
-            return setTimeout(_domReady, 13);
-        }
-
-        // clean up loading event
-        if (typeof globalThis.document !== "undefined" && typeof globalThis.document.removeEventListener === "function") {
-            globalThis.document.removeEventListener(
-                "DOMContentLoaded",
-                this._domReady,
-                false
-            );
-        }
-
-        if (typeof globalThis.removeEventListener === "function") {
-            // remove the event on globalThis.onload (always added in `onReady`)
-            globalThis.removeEventListener("load", _domReady, false);
-        }
-
-        // execute all callbacks
-        while (readyList.length) {
-            readyList.shift().call(globalThis, []);
-        }
-
-        // Remember that the DOM is ready
-        isReady = true;
-    }
-};
-
 // a cache DOMRect object
 let _domRect = {left: 0, top: 0, x: 0, y: 0, width: 0, height: 0, right: 0, bottom: 0};
 
@@ -418,7 +380,7 @@ let device = {
      * @readonly
      * @name nodeJS
      */
-    nodeJS : (typeof process !== "undefined") && (process.release.name === "node"),
+    nodeJS : (typeof globalThis.process !== "undefined") && (typeof globalThis.process.release !== "undefined") && (globalThis.process.release.name === "node"),
 
     /**
      * equals to true if the device is running on ChromeOS.
@@ -606,33 +568,7 @@ let device = {
     * });
     */
     onReady(fn) {
-        // If the DOM is already ready
-        if (isReady) {
-            // Execute the function immediately
-            fn.call(globalThis, []);
-        }
-        else {
-            // Add the function to the wait list
-            readyList.push(fn);
-
-            // attach listeners if not yet done
-            if (!readyBound) {
-                // directly call domReady if document is already "ready"
-                if (device.nodeJS === true || (typeof globalThis.document !== "undefined" && globalThis.document.readyState === "complete")) {
-                    // defer the fn call to ensure our script is fully loaded
-                    globalThis.setTimeout(_domReady, 0);
-                }
-                else {
-                    if (typeof globalThis.document !== "undefined" && typeof globalThis.document.addEventListener === "function") {
-                        // Use the handy event callback
-                        globalThis.document.addEventListener("DOMContentLoaded", _domReady, false);
-                    }
-                    // A fallback to globalThis.onload, that will always work
-                    globalThis.addEventListener("load", _domReady, false);
-                }
-                readyBound = true;
-            }
-        }
+        DOMContentLoaded(fn);
     },
 
     /**

package/src/system/dom.js

@@ -0,0 +1,69 @@
+import * as event from "./event.js";
+
+// track if DOMContentLoaded was called already
+let readyBound = false;
+
+// is the DOM ready ?
+let isDOMReady = false;
+
+// check if the dom is ready
+function _domReady() {
+
+    // Make sure that the DOM is not already loaded
+    if (!isDOMReady) {
+        // be sure document.body is there
+        if (typeof globalThis.document !== "undefined" && !globalThis.document.body) {
+            return setTimeout(_domReady, 13);
+        }
+
+        // clean up loading event
+        if (typeof globalThis.document !== "undefined" && typeof globalThis.document.removeEventListener === "function") {
+            globalThis.document.removeEventListener(
+                "DOMContentLoaded",
+                _domReady,
+                false
+            );
+        }
+
+        if (typeof globalThis.removeEventListener === "function") {
+            // remove the event on globalThis.onload (always added in `onReady`)
+            globalThis.removeEventListener("load", _domReady, false);
+        }
+
+        // execute all callbacks
+        event.emit(event.DOM_READY);
+
+        // Remember that the DOM is ready
+        isDOMReady = true;
+    }
+};
+
+// https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event
+export function DOMContentLoaded(fn) {
+    // If the DOM is already ready
+    if (isDOMReady) {
+        // Execute the function immediately
+        fn.call(globalThis, []);
+    }
+    else {
+        // else add the function to the DOM_READY event
+        event.once(event.DOM_READY, fn, globalThis);
+        // bind dom load event if not done yet
+        if (!readyBound) {
+            // directly call domReady if document is already "ready"
+            if (((typeof process !== "undefined") && (process.release.name === "node")) || (typeof globalThis.document !== "undefined" && globalThis.document.readyState === "complete")) {
+                // defer the fn call to ensure our script is fully loaded
+                globalThis.setTimeout(_domReady, 0);
+            }
+            else {
+                if (typeof globalThis.document !== "undefined" && typeof globalThis.document.addEventListener === "function") {
+                    // Use the handy event callback
+                    globalThis.document.addEventListener("DOMContentLoaded", _domReady, false);
+                }
+                // A fallback to globalThis.onload, that will always work
+                globalThis.addEventListener("load", _domReady, false);
+            }
+            readyBound = true;
+        }
+    }
+}

package/src/system/event.js

@@ -8,6 +8,17 @@ import EventEmitter from "eventemitter3";
 // internal instance of the event emiter
 var eventEmitter = new EventEmitter();
 
+/**
+ * event when the DOM is Ready is booting
+ * @public
+ * @constant
+ * @type {string}
+ * @name DOM_READY
+ * @memberof event
+ * @see event.on
+ */
+export const DOM_READY = "dom_ready";
+
 /**
  * event when the system is booting
  * @public