littlejsengine 1.14.9 → 1.14.11

package/dist/littlejs.d.ts

@@ -78,12 +78,12 @@ declare module "littlejsengine" {
      *  @example
      *  // Basic engine startup
      *  engineInit(
-     *    () => { console.log('Game initialized!'); },  // gameInit
-     *    () => { updateGameLogic(); },                 // gameUpdate
-     *    () => { updateUI(); },                        // gameUpdatePost
-     *    () => { drawBackground(); },                  // gameRender
-     *    () => { drawHUD(); },                         // gameRenderPost
-     *    ['tiles.png', 'tilesLevel.png']               // images to load
+     *    () => { LOG('Game initialized!'); },  // gameInit
+     *    () => { updateGameLogic(); },         // gameUpdate
+     *    () => { updateUI(); },                // gameUpdatePost
+     *    () => { drawBackground(); },          // gameRender
+     *    () => { drawHUD(); },                 // gameRenderPost
+     *    ['tiles.png', 'tilesLevel.png']       // images to load
      *  );
      *  @memberof Engine */
     export function engineInit(gameInit: Function | (() => Promise<any>), gameUpdate: Function, gameUpdatePost: Function, gameRender: Function, gameRenderPost: Function, imageSources?: Array<string>, rootElement?: HTMLElement): Promise<void>;
@@ -143,11 +143,15 @@ declare module "littlejsengine" {
      *  @default
      *  @memberof Debug */
     export let showWatermark: boolean;
-    /** Asserts if the expression is false, does not do anything in release builds
+    /** Asserts if the expression is false, does nothing in release builds
      *  @param {boolean} assert
      *  @param {...Object} [output] - error message output
      *  @memberof Debug */
     export function ASSERT(assert: boolean, ...output?: any[]): void;
+    /** Log to console if debug is enabled, does nothing in release builds
+     *  @param {...Object} [output] - message output
+     *  @memberof Debug */
+    export function LOG(...output?: any[]): void;
     /** Draw a debug rectangle in world space
      *  @param {Vector2} pos
      *  @param {Vector2} [size=Vector2()]
@@ -952,10 +956,7 @@ declare module "littlejsengine" {
         /** Returns the integer direction of this vector, corresponding to multiples of 90 degree rotation (0-3)
          * @return {number} */
         direction(): number;
-        /** Returns a copy of this vector that has been inverted
-         * @return {Vector2} */
-        invert(): Vector2;
-        /** Returns a copy of this vector absolute values
+        /** Returns a copy of this vector with absolute values
          * @return {Vector2} */
         abs(): Vector2;
         /** Returns a copy of this vector with each axis floored

package/dist/littlejs.esm.js

@@ -33,7 +33,7 @@ const engineName = 'LittleJS';
  *  @type {string}
  *  @default
  *  @memberof Engine */
-const engineVersion = '1.14.9';
+const engineVersion = '1.14.11';
 
 /** Frames per second to update
  *  @type {number}
@@ -122,12 +122,12 @@ function engineAddPlugin(updateFunction, renderFunction)
  *  @example
  *  // Basic engine startup
  *  engineInit(
- *    () => { console.log('Game initialized!'); },  // gameInit
- *    () => { updateGameLogic(); },                 // gameUpdate
- *    () => { updateUI(); },                        // gameUpdatePost
- *    () => { drawBackground(); },                  // gameRender
- *    () => { drawHUD(); },                         // gameRenderPost
- *    ['tiles.png', 'tilesLevel.png']               // images to load
+ *    () => { LOG('Game initialized!'); },  // gameInit
+ *    () => { updateGameLogic(); },         // gameUpdate
+ *    () => { updateUI(); },                // gameUpdatePost
+ *    () => { drawBackground(); },          // gameRender
+ *    () => { drawHUD(); },                 // gameRenderPost
+ *    ['tiles.png', 'tilesLevel.png']       // images to load
  *  );
  *  @memberof Engine */
 async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost, imageSources=[], rootElement=document.body)
@@ -173,16 +173,20 @@ async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, game
         if (!debugSpeedUp)
             frameTimeBufferMS = min(frameTimeBufferMS, 50); // clamp min framerate
 
+        let wasUpdated = false;
         if (paused)
         {
+            // update everything except the game and objects
+            wasUpdated = true;
             updateCanvas();
+            inputUpdate();
+            pluginUpdateList.forEach(f=>f());
 
             // update object transforms even when paused
             for (const o of engineObjects)
                 o.parent || o.updateTransforms();
 
-            inputUpdate();
-            pluginUpdateList.forEach(f=>f());
+            // do post update
             debugUpdate();
             gameUpdatePost();
             inputUpdatePost();
@@ -199,12 +203,13 @@ async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, game
             }
 
             // update multiple frames if necessary in case of slow framerate
-            for (;frameTimeBufferMS >= 0; frameTimeBufferMS -= 1e3 / frameRate)
+            for (; frameTimeBufferMS >= 0; frameTimeBufferMS -= 1e3 / frameRate)
             {
                 // increment frame and update time
                 time = frame++ / frameRate;
 
                 // update game and objects
+                wasUpdated = true;
                 updateCanvas();
                 inputUpdate();
                 gameUpdate();
@@ -215,7 +220,6 @@ async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, game
                 debugUpdate();
                 gameUpdatePost();
                 inputUpdatePost();
-
                 if (debugVideoCaptureIsActive())
                     renderFrame();
             }
@@ -232,6 +236,10 @@ async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, game
         {
             if (headlessMode) return;
 
+            // canvas must be updated before rendering
+            if (!wasUpdated)
+                updateCanvas();
+
             // render sort then render while removing destroyed objects
             enginePreRender();
             gameRender();
@@ -391,7 +399,7 @@ async function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, game
         promises.push(new Promise(resolve =>
         {
             let t = 0;
-            console.log(`${engineName} Engine v${engineVersion}`);
+            LOG(`${engineName} Engine v${engineVersion}`);
             updateSplash();
             function updateSplash()
             {
@@ -688,12 +696,6 @@ function drawEngineSplashScreen(t)
  *  @memberof Debug */
 const debug = true;
 
-/** True if asserts are enabled
- *  @type {boolean}
- *  @default
- *  @memberof Debug */
-const enableAsserts = true;
-
 /** Size to render debug points by default
  *  @type {number}
  *  @default
@@ -724,15 +726,16 @@ let debugPrimitives = [], debugPhysics = false, debugRaycast = false, debugParti
 ///////////////////////////////////////////////////////////////////////////////
 // Debug helper functions
 
-/** Asserts if the expression is false, does not do anything in release builds
+/** Asserts if the expression is false, does nothing in release builds
  *  @param {boolean} assert
  *  @param {...Object} [output] - error message output
  *  @memberof Debug */
-function ASSERT(assert, ...output)
-{
-    if (enableAsserts)
-        console.assert(assert, ...output);
-}
+function ASSERT(assert, ...output) { console.assert(assert, ...output); }
+
+/** Log to console if debug is enabled, does nothing in release builds
+ *  @param {...Object} [output] - message output
+ *  @memberof Debug */
+function LOG(...output) { console.log(...output); }
 
 /** Draw a debug rectangle in world space
  *  @param {Vector2} pos
@@ -1127,7 +1130,8 @@ function debugRender()
         {
             overlayContext.fillText(`${engineName} v${engineVersion}`, x, y += h/2 );
             overlayContext.fillText('Time: ' + formatTime(time), x, y += h);
-            overlayContext.fillText('FPS: ' + averageFPS.toFixed(1), x, y += h);
+            overlayContext.fillText('FPS: ' + averageFPS.toFixed(1) + (glEnable?' WebGL':' Canvas2D'), 
+                x, y += h);
             overlayContext.fillText('Objects: ' + engineObjects.length, x, y += h);
             overlayContext.fillText('Draw Count: ' + drawCount, x, y += h);
             overlayContext.fillText('---------', x, y += h);
@@ -1146,12 +1150,18 @@ function debugRender()
             overlayContext.fillText('6: Toggle Video Capture', x, y += h);
 
             let keysPressed = '';
+            let mousePressed = '';
             for (const i in inputData[0])
             {
-                if (keyIsDown(i, 0))
+                if (!keyIsDown(i, 0))
+                    continue;
+                if (parseInt(i) < 3)
+                    mousePressed += i + ' ' ;
+                else if (keyIsDown(i, 0))
                     keysPressed += i + ' ' ;
             }
-            keysPressed && overlayContext.fillText('Keys Down: ' + keysPressed, x, y += h);
+            mousePressed && overlayContext.fillText('Mouse: ' + mousePressed, x, y += h);
+            keysPressed && overlayContext.fillText('Keys: ' + keysPressed, x, y += h);
 
             let buttonsPressed = '';
             if (inputData[1])
@@ -1219,7 +1229,7 @@ function debugVideoCaptureStart()
     }
 
     // start recording
-    console.log('Video capture started.');
+    LOG('Video capture started.');
     debugVideoCapture.start();
     debugVideoCaptureTimer = new Timer(0);
 
@@ -1246,7 +1256,7 @@ function debugVideoCaptureStop()
         return; // not recording
 
     // stop recording
-    console.log(`Video capture ended. ${debugVideoCaptureTimer.get().toFixed(2)} seconds recorded.`);
+    LOG(`Video capture ended. ${debugVideoCaptureTimer.get().toFixed(2)} seconds recorded.`);
     debugVideoCapture.stop();
     debugVideoCapture = 0;
     debugVideoCaptureIcon.style.display = 'none';
@@ -1480,7 +1490,12 @@ function wave(frequency=1, amplitude=1, t=time, offset=0)
  *  @param {number} t - time in seconds
  *  @return {string}
  *  @memberof Utilities */
-function formatTime(t) { return (t/60|0) + ':' + (t%60<10?'0':'') + (t%60|0); }
+function formatTime(t)
+{
+    const sign = t < 0 ? '-' : '';
+    t = abs(t)|0;
+    return sign + (t/60|0) + ':' + (t%60<10?'0':'') + t%60;
+}
 
 /** Fetches a JSON file from a URL and returns the parsed JSON object. Must be used with await!
  *  @param {string} url - URL of JSON file
@@ -1816,11 +1831,7 @@ class Vector2
     direction()
     { return abs(this.x) > abs(this.y) ? this.x < 0 ? 3 : 1 : this.y < 0 ? 2 : 0; }
 
-    /** Returns a copy of this vector that has been inverted
-     * @return {Vector2} */
-    invert() { return new Vector2(this.y, -this.x); }
-
-    /** Returns a copy of this vector absolute values
+    /** Returns a copy of this vector with absolute values
      * @return {Vector2} */
     abs() { return new Vector2(abs(this.x), abs(this.y)); }
 
@@ -1862,13 +1873,10 @@ class Vector2
     toString(digits=3)
     {
         ASSERT_NUMBER_VALID(digits);
-        if (debug)
-        {
-            if (this.isValid())
-                return `(${(this.x<0?'':' ') + this.x.toFixed(digits)},${(this.y<0?'':' ') + this.y.toFixed(digits)} )`;
-            else
-                return `(${this.x}, ${this.y})`;
-        }
+        if (this.isValid())
+            return `(${(this.x<0?'':' ') + this.x.toFixed(digits)},${(this.y<0?'':' ') + this.y.toFixed(digits)} )`;
+        else
+            return `(${this.x}, ${this.y})`;
     }
 
     /** Checks if this is a valid vector
@@ -2257,7 +2265,7 @@ class Timer
 
     /** Returns this timer expressed as a string
      * @return {string} */
-    toString() { if (debug) { return this.isSet() ? Math.abs(this.get()) + ' seconds ' + (this.get()<0 ? 'before' : 'after' ) : 'unset'; }}
+    toString() { return this.isSet() ? Math.abs(this.get()) + ' seconds ' + (this.get()<0 ? 'before' : 'after' ) : 'unset'; }
 
     /** Get how long since elapsed, returns 0 if not set (returns negative if currently active)
      * @return {number} */
@@ -2485,6 +2493,12 @@ let touchGamepadEnable = false;
  *  @memberof Settings */
 let touchGamepadAnalog = true;
 
+/** Number of buttons on touch gamepad
+ *  @type {number}
+ *  @default
+ *  @memberof Settings */
+let touchGamepadButtonCount = 4;
+
 /** Size of virtual gamepad for touch devices in pixels
  *  @type {number}
  *  @default
@@ -4515,7 +4529,7 @@ function inputInit()
     function onMouseLeave()
     {
         // set mouse position and delta when leaving canvas
-        mousePosScreen = vec2(Infinity);
+        mousePosScreen = vec2(-1);
         mouseDeltaScreen = vec2(0);
     }
 }
@@ -4570,10 +4584,12 @@ function gamepadsUpdate()
         const data = inputData[1] || (inputData[1] = []);
         for (let i=10; i--;)
         {
-            const j = i === 3 ? 2 : i === 2 ? 3 : i; // fix button locations
-            const wasDown = gamepadIsDown(j,0);
-            data[j] = touchGamepadButtons[i] ? wasDown ? 1 : 3 : wasDown ? 4 : 0;
+            const wasDown = gamepadIsDown(i,0);
+            data[i] = touchGamepadButtons[i] ? wasDown ? 1 : 3 : wasDown ? 4 : 0;
         }
+
+        // disable normal gamepads when touch gamepad is active
+        return;
     }
 
     // return if gamepads are disabled or not supported
@@ -4648,6 +4664,15 @@ const isTouchDevice = !headlessMode && window.ontouchstart !== undefined;
 // touch gamepad internal variables
 let touchGamepadTimer = new Timer, touchGamepadButtons = [], touchGamepadStick = vec2();
 
+function touchGamepadButtonCenter()
+{
+    // draw right face buttons
+    let center = vec2(mainCanvasSize.x-touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
+    if (touchGamepadButtonCount <= 2)
+        center.x += touchGamepadSize/2;
+    return center;
+}
+
 // enable touch input mouse passthrough
 function touchInputInit()
 {
@@ -4695,8 +4720,8 @@ function touchInputInit()
         // set was touching
         wasTouching = touching;
 
-        // prevent default handling like copy and magnifier lens
-        if (inputPreventDefault && document.hasFocus()) // allow document to get focus
+        // prevent default handling like copy, magnifier lens, and scrolling
+        if (inputPreventDefault && document.hasFocus() && e.cancelable)
             e.preventDefault();
 
         // must return true so the document will get focus
@@ -4725,25 +4750,36 @@ function touchInputInit()
 
         // get center of left and right sides
         const stickCenter = vec2(touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
-        const buttonCenter = mainCanvasSize.subtract(vec2(touchGamepadSize, touchGamepadSize));
+        const buttonCenter = touchGamepadButtonCenter();
         const startCenter = mainCanvasSize.scale(.5);
 
         // check each touch point
         for (const touch of e.touches)
         {
             const touchPos = mouseEventToScreen(vec2(touch.clientX, touch.clientY));
-            if (touchPos.distance(stickCenter) < touchGamepadSize)
+            if (stickCenter.distance(touchPos) < touchGamepadSize)
             {
                 // virtual analog stick
                 touchGamepadStick = touchPos.subtract(stickCenter).scale(2/touchGamepadSize).clampLength();
             }
-            else if (touchPos.distance(buttonCenter) < touchGamepadSize)
+            else if (buttonCenter.distance(touchPos) < touchGamepadSize)
             {
                 // virtual face buttons
-                const button = touchPos.subtract(buttonCenter).direction();
-                touchGamepadButtons[button] = 1;
+                let button = buttonCenter.subtract(touchPos).direction();
+                button = mod(button+2, 4);
+                if (touchGamepadButtonCount === 1)
+                    button = 0;
+                else if (touchGamepadButtonCount === 2)
+                {
+                    const delta = buttonCenter.subtract(touchPos);
+                    button = -delta.x < delta.y ? 1 : 0;
+                }
+                // fix button locations (swap 2 and 3 to match gamepad layout)
+                button = button === 3 ? 2 : button === 2 ? 3 : button;
+                if (button < touchGamepadButtonCount)
+                    touchGamepadButtons[button] = 1;
             }
-            else if (touchPos.distance(startCenter) < touchGamepadSize && !wasTouching)
+            else if (startCenter.distance(touchPos) < touchGamepadSize && !wasTouching)
             {
                 // virtual start button in center
                 touchGamepadButtons[9] = 1;
@@ -4774,11 +4810,10 @@ function touchGamepadRender()
     // draw left analog stick
     context.fillStyle = touchGamepadStick.lengthSquared() > 0 ? '#fff' : '#000';
     context.beginPath();
-
-    const leftCenter = vec2(touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
+    const stickCenter = vec2(touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
     if (touchGamepadAnalog) // draw circle shaped gamepad
     {
-        context.arc(leftCenter.x, leftCenter.y, touchGamepadSize/2, 0, 9);
+        context.arc(stickCenter.x, stickCenter.y, touchGamepadSize/2, 0, 9);
         context.fill();
         context.stroke();
     }
@@ -4787,21 +4822,27 @@ function touchGamepadRender()
         for (let i=10; i--;)
         {
             const angle = i*PI/4;
-            context.arc(leftCenter.x, leftCenter.y,touchGamepadSize*.6, angle + PI/8, angle + PI/8);
-            i%2 && context.arc(leftCenter.x, leftCenter.y, touchGamepadSize*.33, angle, angle);
+            context.arc(stickCenter.x, stickCenter.y,touchGamepadSize*.6, angle + PI/8, angle + PI/8);
+            i%2 && context.arc(stickCenter.x, stickCenter.y, touchGamepadSize*.33, angle, angle);
             i===1 && context.fill();
         }
         context.stroke();
     }
 
     // draw right face buttons
-    const rightCenter = vec2(mainCanvasSize.x-touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
-    for (let i=4; i--;)
-    {
-        const pos = rightCenter.add(vec2().setDirection(i, touchGamepadSize/2));
-        context.fillStyle = touchGamepadButtons[i] ? '#fff' : '#000';
+    const buttonCenter = touchGamepadButtonCenter();
+    const buttonSize = touchGamepadButtonCount > 1 ? touchGamepadSize/4 : touchGamepadSize/2;
+    for (let i=0; i<touchGamepadButtonCount; i++)
+    {
+        let j = mod(i-1, 4);
+        let button = touchGamepadButtonCount > 2 ? 
+            j : min(j, touchGamepadButtonCount-1);
+        // fix button locations (swap 2 and 3 to match gamepad layout)
+        button = button === 3 ? 2 : button === 2 ? 3 : button;
+        const pos = buttonCenter.add(vec2().setDirection(j, touchGamepadSize/2));
+        context.fillStyle = touchGamepadButtons[button] ? '#fff' : '#000';
         context.beginPath();
-        context.arc(pos.x, pos.y, touchGamepadSize/4, 0,9);
+        context.arc(pos.x, pos.y, buttonSize, 0,9);
         context.fill();
         context.stroke();
     }
@@ -5591,6 +5632,12 @@ function tileCollisionLoad(tileMapData, tileInfo=tile(), renderOrder=0, collisio
         const tileLayer = new TileCollisionLayer(vec2(), levelSize, tileInfo, layerRenderOrder);
         tileLayers[layerIndex] = tileLayer;
 
+        // apply layer color
+        const layerColor = dataLayer.color || WHITE;
+        if (dataLayer.tintcolor)
+            layerColor.setHex(dataLayer.tintcolor);
+        ASSERT(isColor(layerColor), 'layer color is not a color');
+
         for (let x=levelSize.x; x--;)
         for (let y=levelSize.y; y--;)
         {
@@ -5598,7 +5645,7 @@ function tileCollisionLoad(tileMapData, tileInfo=tile(), renderOrder=0, collisio
             const data = dataLayer.data[x + y*levelSize.x];
             if (data)
             {
-                const layerData = new TileLayerData(data-1);
+                const layerData = new TileLayerData(data-1, 0, false, layerColor);
                 tileLayer.setData(pos, layerData);
 
                 // set collision for top layer
@@ -7492,7 +7539,7 @@ class NewgroundsPlugin
         // get medals
         const medalsResult = this.call('Medal.getList');
         this.medals = medalsResult ? medalsResult.result.data['medals'] : [];
-        debugMedals && console.log(this.medals);
+        debugMedals && LOG(this.medals);
         for (const newgroundsMedal of this.medals)
         {
             const medal = medals[newgroundsMedal['id']];
@@ -7515,7 +7562,7 @@ class NewgroundsPlugin
         // get scoreboards
         const scoreboardResult = this.call('ScoreBoard.getBoards');
         this.scoreboards = scoreboardResult ? scoreboardResult.result.data.scoreboards : [];
-        debugMedals && console.log(this.scoreboards);
+        debugMedals && LOG(this.scoreboards);
 
         // keep the session alive with a ping every minute
         const keepAliveMS = 60 * 1e3;
@@ -7584,10 +7631,10 @@ class NewgroundsPlugin
         try { xmlHttp.send(formData); }
         catch(e)
         {
-            debugMedals && console.log('newgrounds call failed', e);
+            debugMedals && LOG('newgrounds call failed', e);
             return;
         }
-        debugMedals && console.log(xmlHttp.responseText);
+        debugMedals && LOG(xmlHttp.responseText);
         return xmlHttp.responseText && JSON.parse(xmlHttp.responseText);
     }
 }
@@ -8157,7 +8204,7 @@ class UIObject
         const mouseDown = mouseIsDown(0);
         const mousePress = this.dragActivate ? mouseDown : mouseWasPressed(0);
         if (!uiSystem.hoverObject)
-        if (mousePress || !mouseDown || isActive)
+        if (mousePress || isActive || (!mouseDown && !isTouchDevice))
         {
             const size = this.size.add(vec2(isTouchDevice && this.extraTouchSize || 0));
             if (isOverlapping(this.pos, size, mousePosScreen))
@@ -10184,7 +10231,7 @@ async function box2dInit()
     }
     function box2dRender()
     {
-        if (box2dDebug || debugPhysics && debugOverlay)
+        if (box2dDebug || debugPhysics)
             box2d.world.DrawDebugData();
     }
     
@@ -10421,6 +10468,7 @@ export
 
 	// Debug
 	ASSERT,
+	LOG,
 	debugRect,
 	debugPoly,
 	debugCircle,