littlejsengine 1.17.1 → 1.17.5

package/src/engineDraw.js

@@ -258,7 +258,7 @@ function drawTile(pos, size=vec2(1), tileInfo, color=WHITE,
     ASSERT(!additiveColor || isColor(additiveColor), 'additiveColor must be a color');
     ASSERT(!context || !useWebGL, 'context only supported in canvas 2D mode');
 
-    const textureInfo = tileInfo && tileInfo.textureInfo;
+    const textureInfo = tileInfo?.textureInfo;
     const bleed = tileInfo?.bleed ?? 0;
     if (useWebGL && glEnable)
     {
@@ -564,9 +564,12 @@ function drawEllipse(pos, size=vec2(1), color=WHITE, angle=0, lineWidth=0, lineC
     ASSERT(isColor(color) && isColor(lineColor), 'color is invalid');
     ASSERT(isNumber(angle), 'angle must be a number');
     ASSERT(isNumber(lineWidth), 'lineWidth must be a number');
-    ASSERT(lineWidth >= 0 && lineWidth < size.x && lineWidth < size.y, 'invalid lineWidth');
+    ASSERT(lineWidth >= 0, 'lineWidth must be a positive value or 0');
     ASSERT(!context || !useWebGL, 'context only supported in canvas 2D mode');
 
+    // clamp line width to prevent artifacts
+    lineWidth = clamp(lineWidth, 0, Math.min(size.x, size.y));
+
     if (useWebGL && glEnable)
     {
         // draw as a regular polygon

package/src/engineExport.js

@@ -315,7 +315,6 @@ export
     audioMasterGain,
     audioDefaultSampleRate,
     Sound,
-    SoundWave,
     SoundInstance,
     speak,
     speakStop,

package/src/engineInput.js

@@ -408,9 +408,9 @@ function inputInit()
     function touchInputInit()
     {
         // add non passive touch event listeners
-        document.addEventListener('touchstart', (e) => handleTouch(e), { passive: false });
-        document.addEventListener('touchmove',  (e) => handleTouch(e), { passive: false });
-        document.addEventListener('touchend',   (e) => handleTouch(e), { passive: false });
+        document.addEventListener('touchstart', (e)=> handleTouch(e), { passive: false });
+        document.addEventListener('touchmove',  (e)=> handleTouch(e), { passive: false });
+        document.addEventListener('touchend',   (e)=> handleTouch(e), { passive: false });
 
         // handle all touch events the same way
         let wasTouching;
@@ -616,7 +616,7 @@ function inputUpdate()
         // poll gamepads
         const maxGamepads = 8;
         const gamepads = navigator.getGamepads();
-        const gamepadCount = min(maxGamepads, gamepads.length)
+        const gamepadCount = min(maxGamepads, gamepads.length);
         for (let i=0; i<gamepadCount; ++i)
         {
             // get or create gamepad data

package/src/engineMath.js

@@ -16,25 +16,25 @@
 const PI = Math.PI;
 
 /** Returns absolute value of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const abs = Math.abs;
 
 /** Returns floored value of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const floor = Math.floor;
 
 /** Returns ceiled value of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const ceil = Math.ceil;
 
 /** Returns rounded value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const round = Math.round;
@@ -52,7 +52,7 @@ const min = Math.min;
 const max = Math.max;
 
 /** Returns the sign of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const sign = Math.sign;
@@ -64,25 +64,25 @@ const sign = Math.sign;
 const hypot = Math.hypot;
 
 /** Returns log2 of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const log2 = Math.log2;
 
 /** Returns sin of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const sin = Math.sin;
 
 /** Returns cos of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const cos = Math.cos;
 
 /** Returns tan of value passed in
- *  @param {number} value
+ *  @param {number} x
  *  @return {number}
  *  @memberof Math */
 const tan = Math.tan;

package/src/engineObject.js

@@ -277,7 +277,7 @@ class EngineObject
         if (this.collideTiles)
         {
             // check collision against tiles
-            const hitLayer = tileCollisionTest(this.pos, this.size, this)
+            const hitLayer = tileCollisionTest(this.pos, this.size, this);
             if (hitLayer)
             {
                 // if already was stuck in collision, don't do anything

package/src/engineTileLayer.js

@@ -183,17 +183,17 @@ class TileLayerData
 class CanvasLayer extends EngineObject
 {
     /** Create a canvas layer object
-     *  @param {Vector2}  [position] - World space position of the layer
+     *  @param {Vector2}  [pos] - World space position of the layer
      *  @param {Vector2}  [size] - World space size of the layer
      *  @param {number}   [angle] - Angle the layer is rotated by
      *  @param {number}   [renderOrder] - Objects sorted by renderOrder
      *  @param {Vector2}  [canvasSize] - Default size of canvas, can be changed later
      *  @param {boolean}  [useWebGL] - Should this layer use WebGL for rendering
     */
-    constructor(position, size, angle=0, renderOrder=0, canvasSize=vec2(512), useWebGL=glEnable)
+    constructor(pos, size, angle=0, renderOrder=0, canvasSize=vec2(512), useWebGL=true)
     {
         ASSERT(isVector2(canvasSize), 'canvasSize must be a Vector2');
-        super(position, size, undefined, angle, WHITE, renderOrder);
+        super(pos, size, undefined, angle, WHITE, renderOrder);
 
         /** @property {HTMLCanvasElement} - The canvas used by this layer */
         this.canvas = headlessMode ? undefined : new OffscreenCanvas(canvasSize.x, canvasSize.y);
@@ -297,16 +297,16 @@ class CanvasLayer extends EngineObject
 class TileLayer extends CanvasLayer
 {
     /** Create a tile layer object
-    *  @param {Vector2}  position - World space position
+    *  @param {Vector2}  pos - World space position
     *  @param {Vector2}  size - World space size
     *  @param {TileInfo} [tileInfo] - Default tile info for layer (used for size and texture)
     *  @param {number}   [renderOrder] - Objects are sorted by renderOrder
+    *  @param {boolean}  [useWebGL] - Should this layer use WebGL for rendering
     */
-    constructor(position, size, tileInfo=tile(), renderOrder=0)
+    constructor(pos, size, tileInfo=tile(), renderOrder=0, useWebGL=true)
     {
         const canvasSize = tileInfo ? size.multiply(tileInfo.size) : size;
-        const useWebGL = true;
-        super(position, size, 0, renderOrder, canvasSize, useWebGL);
+        super(pos, size, 0, renderOrder, canvasSize, useWebGL);
         
         /** @property {TileInfo} - Default tile info for layer */
         this.tileInfo = undefined;
@@ -318,15 +318,15 @@ class TileLayer extends CanvasLayer
         if (headlessMode)
         {
             // disable rendering in headless mode
-            this.render         = () => {};
-            this.redraw         = () => {};
-            this.redrawStart    = () => {};
-            this.redrawEnd      = () => {};
-            this.drawTileData   = () => {};
-            this.redrawTileData = () => {};
-            this.drawLayerTile  = () => {};
-            this.drawLayerRect  = () => {};
-            this.clearLayerRect = () => {};
+            this.render         = ()=> {};
+            this.redraw         = ()=> {};
+            this.redrawStart    = ()=> {};
+            this.redrawEnd      = ()=> {};
+            this.drawTileData   = ()=> {};
+            this.redrawTileData = ()=> {};
+            this.drawLayerTile  = ()=> {};
+            this.drawLayerRect  = ()=> {};
+            this.clearLayerRect = ()=> {};
             return;
         }
         
@@ -360,6 +360,12 @@ class TileLayer extends CanvasLayer
         isRedraw ? this.drawTileData(layerPos) : this.redrawTileData(layerPos);
     }
 
+    /** Clear data at a given position in the array
+     *  @param {Vector2} layerPos - Local position in array
+     *  @param {boolean} [redraw] - Force the tile to redraw if true */
+    clearData(layerPos, redraw=false)
+    { this.setData(layerPos, new TileLayerData, redraw) }
+
     /** Get data at a given position in the array
      *  @param {Vector2} layerPos - Local position in array
      *  @return {TileLayerData} */
@@ -401,7 +407,7 @@ class TileLayer extends CanvasLayer
         for (let x = this.size.x; x--;)
         for (let y = this.size.y; y--;)
             this.drawTileData(vec2(x,y), false);
-        this.hasWebGL() && glFlush();
+        this.isUsingWebGL && glFlush();
         this.onRedraw();
         this.redrawEnd();
     }
@@ -450,14 +456,13 @@ class TileLayer extends CanvasLayer
         if (!this.context) return;
         ASSERT(drawContext === this.context);
 
-        if (glEnable && this.textureInfo.glTexture)
-            glSetRenderTarget();
-
         // set stuff back to normal
+        if (this.isUsingWebGL)
+            glSetRenderTarget();
         [drawContext, mainCanvasSize, cameraPos, cameraScale, canvasClearColor] = this.savedRenderSettings;
     }
 
-    /** Draw the tile at a given position in the tile grid
+    /** Draw the tile at a given position in the tile layer
      *  This can be used to clear out tiles when they are destroyed
      *  Tiles can also be redrawn if inside a redrawStart/End block
      *  @param {Vector2} layerPos
@@ -481,7 +486,7 @@ class TileLayer extends CanvasLayer
         this.drawLayerTile(drawPos, drawSize, tileInfo, d.color, d.direction*PI/2, d.mirror);
     }
 
-    /** Draw the tile at a given position in the tile grid
+    /** Draw the tile at a given position in the tile layer
      *  This can be used to clear tiles when they are destroyed
      *  For better performance use drawTileData inside a redrawStart/End block
      *  @param {Vector2} layerPos
@@ -509,7 +514,7 @@ class TileLayer extends CanvasLayer
     angle=0, mirror, additiveColor)
     {
         const drawPos = pos.add(size.scale(.5));
-        drawTile(drawPos, size, tileInfo, color, angle, mirror, additiveColor);
+        drawTile(drawPos, size, tileInfo, color, angle, mirror, additiveColor, this.isUsingWebGL);
     }
 
     /** Clear a rectangle in layer space
@@ -549,14 +554,15 @@ class TileLayer extends CanvasLayer
 class TileCollisionLayer extends TileLayer
 {
     /** Create a tile layer object
-    *  @param {Vector2}  position      - World space position
-    *  @param {Vector2}  size          - World space size
-    *  @param {TileInfo} [tileInfo]    - Tile info for layer
+    *  @param {Vector2}  pos - World space position
+    *  @param {Vector2}  size - World space size
+    *  @param {TileInfo} [tileInfo] - Tile info for layer
     *  @param {number}   [renderOrder] - Objects are sorted by renderOrder
+    *  @param {boolean}  [useWebGL] - Should this layer use WebGL for rendering
     */
-    constructor(position, size, tileInfo=tile(), renderOrder=0)
+    constructor(pos, size, tileInfo=tile(), renderOrder=0, useWebGL=true)
     {
-        super(position, size.floor(), tileInfo, renderOrder);
+        super(pos, size.floor(), tileInfo, renderOrder, useWebGL);
 
         /** @property {Array<number>} - The tile collision grid */
         this.collisionData = [];
@@ -592,24 +598,29 @@ class TileCollisionLayer extends TileLayer
         this.collisionData.fill(0);
     }
 
-    /** Set tile collision data for a given cell in the grid
-    *  @param {Vector2} gridPos
+    /** Set tile collision data for a given cell in the layer
+    *  @param {Vector2} layerPos
     *  @param {number}  [data] */
-    setCollisionData(gridPos, data=1)
+    setCollisionData(layerPos, data=1)
     {
-        ASSERT(isVector2(gridPos), 'gridPos must be a Vector2');
-        const i = (gridPos.y|0)*this.size.x + gridPos.x|0;
-        gridPos.arrayCheck(this.size) && (this.collisionData[i] = data);
+        ASSERT(isVector2(layerPos), 'layerPos must be a Vector2');
+        const i = (layerPos.y|0)*this.size.x + layerPos.x|0;
+        layerPos.arrayCheck(this.size) && (this.collisionData[i] = data);
     }
 
-    /** Get tile collision data for a given cell in the grid
-    *  @param {Vector2} gridPos
+    /** Clear tile collision data for a given cell in the layer
+    *  @param {Vector2} layerPos */
+    clearCollisionData(layerPos)
+    { this.setCollisionData(layerPos, 0); }
+
+    /** Get tile collision data for a given cell in the layer
+    *  @param {Vector2} layerPos
     *  @return {number} */
-    getCollisionData(gridPos)
+    getCollisionData(layerPos)
     {
-        ASSERT(isVector2(gridPos), 'gridPos must be a Vector2');
-        const i = (gridPos.y|0)*this.size.x + gridPos.x|0;
-        return gridPos.arrayCheck(this.size) ? this.collisionData[i] : 0;
+        ASSERT(isVector2(layerPos), 'layerPos must be a Vector2');
+        const i = (layerPos.y|0)*this.size.x + layerPos.x|0;
+        return layerPos.arrayCheck(this.size) ? this.collisionData[i] : 0;
     }
 
     /** Check if collision with another object should occur

package/src/engineWebGL.js

@@ -259,7 +259,7 @@ function glPreRender(clear=true)
         p.x,        p.y,      0, 1];
 
     // set the same transform matrix for both shaders
-    const initUniform = (program, uniform, value) =>
+    const initUniform = (program, uniform, value)=>
     {
         glContext.useProgram(program);
         const location = glContext.getUniformLocation(program, uniform);
@@ -653,7 +653,7 @@ function glSetRenderTarget(texture, clear=false)
         glContext.bindFramebuffer(glContext.FRAMEBUFFER, glFramebuffer);
         glContext.framebufferTexture2D(glContext.FRAMEBUFFER, 
             glContext.COLOR_ATTACHMENT0, glContext.TEXTURE_2D, texture, 0);
-       glPreRender(clear);
+        glPreRender(clear);
     }
     else
     {