npm - littlejsengine - Versions diffs - 1.12.4 → 1.13.1 - Mend

littlejsengine 1.12.4 → 1.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (88) hide show

package/dist/box2d.wasm.js +630 -0
package/dist/box2d.wasm.wasm +0 -0
package/dist/littlejs.d.ts +437 -219
package/dist/littlejs.esm.js +5950 -5307
package/dist/littlejs.esm.min.js +4 -1
package/dist/littlejs.js +5921 -5295
package/dist/littlejs.min.js +4 -1
package/dist/littlejs.release.js +5485 -4886
package/examples/box2d/game.js +37 -42
package/examples/box2d/gameObjects.js +41 -37
package/examples/box2d/index.html +2 -2
package/examples/box2d/scenes.js +24 -20
package/examples/box2d/tiles.png +0 -0
package/examples/breakout/game.js +1 -1
package/examples/breakout/gameObjects.js +2 -2
package/examples/breakout/index.html +1 -1
package/examples/breakoutTutorial/README.md +2 -2
package/examples/breakoutTutorial/game.js +1 -1
package/examples/breakoutTutorial/index.html +1 -1
package/examples/empty/index.html +1 -1
package/examples/htmlMenu/index.html +1 -1
package/examples/index.html +410 -159
package/examples/module/game.js +1 -1
package/examples/module/index.html +1 -1
package/examples/platformer/game.js +6 -15
package/examples/platformer/gameCharacter.js +6 -6
package/examples/platformer/gameEffects.js +74 -57
package/examples/platformer/gameLevel.js +61 -70
package/examples/platformer/gameObjects.js +4 -4
package/examples/platformer/index.html +1 -1
package/examples/puzzle/index.html +1 -1
package/examples/shorts/base.html +24 -3
package/examples/shorts/box2d.js +46 -0
package/examples/shorts/box2dCar.js +45 -0
package/examples/shorts/flappyGame.js +52 -0
package/examples/shorts/helloWorld.js +6 -3
package/examples/shorts/hillGlideGame.js +56 -0
package/examples/shorts/landerGame.js +32 -0
package/examples/shorts/maze.js +47 -0
package/examples/shorts/medals.js +42 -0
package/examples/shorts/nineSlice.js +21 -0
package/examples/shorts/piano.js +52 -0
package/examples/shorts/platformer.js +24 -20
package/examples/shorts/{pong.js → pongGame.js} +1 -1
package/examples/shorts/postProcess.js +45 -0
package/examples/shorts/raycasting.js +71 -0
package/examples/shorts/slidingPuzzle.js +42 -0
package/examples/shorts/spaceGame.js +56 -0
package/examples/shorts/starfield.js +17 -0
package/examples/shorts/tileLayer.js +3 -5
package/examples/shorts/tiles.png +0 -0
package/examples/shorts/tiltedView.js +8 -7
package/examples/shorts/topDown.js +18 -26
package/examples/shorts/uiSystem.js +36 -0
package/examples/starter/build.bat +6 -1
package/examples/starter/game.js +4 -2
package/examples/starter/index.html +23 -13
package/examples/stress/index.html +2 -3
package/examples/style.css +136 -0
package/examples/typescript/build.js +1 -2
package/examples/typescript/game.js +2 -2
package/examples/typescript/game.ts +1 -1
package/examples/typescript/index.html +1 -1
package/examples/uiSystem/game.js +9 -25
package/examples/uiSystem/index.html +1 -1
package/package.json +1 -1
package/plugins/box2d.js +29 -35
package/plugins/drawUtilities.js +126 -0
package/plugins/newgrounds.js +1 -1
package/plugins/pluginExport.js +8 -2
package/plugins/postProcess.js +2 -2
package/plugins/uiSystem.js +162 -68
package/plugins/zzfxm.js +1 -1
package/reference.md +10 -10
package/src/engine.js +59 -39
package/src/engineAudio.js +38 -20
package/src/engineBuild.bat +6 -1
package/src/engineBuild.js +32 -7
package/src/engineDebug.js +53 -26
package/src/engineDraw.js +108 -57
package/src/engineExport.js +22 -9
package/src/engineInput.js +112 -40
package/src/engineObject.js +68 -67
package/src/engineParticles.js +26 -9
package/src/engineSettings.js +15 -16
package/src/engineTileLayer.js +312 -153
package/src/engineUtilities.js +198 -130
package/src/engineWebGL.js +58 -35

package/examples/module/game.js CHANGED Viewed

@@ -77,7 +77,7 @@ function gameInit()
         .99, 1, 1, Math.PI,   // damping, angleDamping, gravityScale, cone
         .05, .5, true, true   // fadeRate, randomness, collide, additive
     );
-    particleEmitter.elasticity = .3; // bounce when it collides
+    particleEmitter.restitution = .3; // bounce when it collides
     particleEmitter.trailScale = 2;  // stretch in direction of motion
 }

package/examples/module/index.html CHANGED Viewed

@@ -7,4 +7,4 @@
 </head><body>
 <!-- Add your game scripts here -->
-<script src=game.js type=module></script>
+<script src=game.js type=module></script>

package/examples/platformer/game.js CHANGED Viewed

@@ -16,14 +16,14 @@ import * as GamePlayer from './gamePlayer.js';
 import * as GameLevel from './gameLevel.js';
 const {vec2} = LJS;
-// enable touch gamepad on touch devices
-LJS.setTouchGamepadEnable(true);
 // globals
-export let spriteAtlas, player, score, deaths, gameLevelData;
+export let gameLevelData, spriteAtlas, player, score, deaths;
 export function addToScore(delta=1) { score += delta; }
 export function addToDeaths() { ++deaths; }
+// enable touch gamepad on touch devices
+LJS.setTouchGamepadEnable(true);
 ///////////////////////////////////////////////////////////////////////////////
 function loadLevel()
 {
@@ -41,17 +41,8 @@ function loadLevel()
 ///////////////////////////////////////////////////////////////////////////////
 async function gameInit()
 {
-    try
-    {
-        // load level data from external JSON file
-        const response = await fetch('gameLevelData.json');
-        gameLevelData = await response.json();
-        console.log('Level data loaded successfully');
-    }
-    catch (error)
-    {
-        console.error('Failed to load level data!');
-    }
+    // load the game level data
+    gameLevelData = await LJS.fetchJSON('gameLevelData.json');
     // engine settings
     LJS.setGravity(vec2(0,-.01));

package/examples/platformer/gameCharacter.js CHANGED Viewed

@@ -108,7 +108,7 @@ export class Character extends GameObjects.GameObject
         for (let y=2;y--;)
         {
             const testPos = this.pos.add(vec2(0, y + .1*moveInput.y - this.size.y/2));
-            const collisionData = LJS.getTileCollisionData(testPos);
+            const collisionData = LJS.tileCollisionGetData(testPos);
             touchingLadder ||= collisionData == GameLevel.tileType_ladder;
         }
         if (!touchingLadder)
@@ -133,7 +133,7 @@ export class Character extends GameObjects.GameObject
             moveInput.x *= .2;
             // exit ladder if ground is below
-            this.climbingLadder = moveInput.y >= 0 || LJS.getTileCollisionData(this.pos.subtract(vec2(0,1))) <= 0;
+            this.climbingLadder = moveInput.y >= 0 || LJS.tileCollisionGetData(this.pos.subtract(vec2(0,1))) <= 0;
         }
         else
         {
@@ -234,7 +234,7 @@ export class Character extends GameObjects.GameObject
         if (!this.isDead())
         {
             // bounce pos with walk cycle
-            bodyPos = bodyPos.add(vec2(0,.01+.05*Math.sin(this.walkCyclePercent*LJS.PI)));
+            bodyPos = bodyPos.add(vec2(0,.05*Math.sin(this.walkCyclePercent*LJS.PI)));
             // make bottom flush
             bodyPos = bodyPos.add(vec2(0,(this.drawSize.y-this.size.y)/2));
@@ -281,9 +281,9 @@ export class Character extends GameObjects.GameObject
             if (pos.y + 1 > this.lastPos.y - this.size.y/2)
                 return false;
-            if (LJS.getTileCollisionData(pos.add(vec2(0,1)))      // above
-                && !LJS.getTileCollisionData(pos.add(vec2(1,0)))  // left
-                && !LJS.getTileCollisionData(pos.add(vec2(1,0)))) // right
+            if (LJS.tileCollisionGetData(pos.add(vec2(0,1)))      // above
+                && !LJS.tileCollisionGetData(pos.add(vec2(1,0)))  // left
+                && !LJS.tileCollisionGetData(pos.add(vec2(1,0)))) // right
                 return false; // don't collide if something above it and nothing to left or right
             // allow standing on top of ladders

package/examples/platformer/gameEffects.js CHANGED Viewed

@@ -40,7 +40,7 @@ export const persistentParticleDestroyCallback = (particle)=>
 }
 export function makeBlood(pos, amount) { makeDebris(pos, hsl(0,1,.5), amount, .1, 0); }
-export function makeDebris(pos, color = hsl(), amount = 50, size=.2, elasticity = .3)
+export function makeDebris(pos, color = hsl(), amount = 50, size=.2, restitution = .3)
 {
     const color2 = color.lerp(hsl(), .5);
     const emitter = new LJS.ParticleEmitter(
@@ -52,7 +52,7 @@ export function makeDebris(pos, color = hsl(), amount = 50, size=.2, elasticity
         1, .95, .4, 3.14, 0,   // damp, angleDamp, gravity, particleCone, fade
         .5, 1                  // randomness, collide, additive, colorLinear, renderOrder
     );
-    emitter.elasticity = elasticity;
+    emitter.restitution = restitution;
     emitter.particleDestroyCallback = persistentParticleDestroyCallback;
     return emitter;
 }
@@ -82,6 +82,9 @@ export function explosion(pos, radius=3)
             GameLevel.decorateTile(pos.add(vec2(x,y)).floor());
     }
+    // update webgl texture
+    GameLevel.updateWebGL(GameLevel.foregroundTileLayer);
     // kill/push objects
     LJS.engineObjectsCallback(pos, radius*3, (o)=>
     {
@@ -126,7 +129,7 @@ export function explosion(pos, radius=3)
 ///////////////////////////////////////////////////////////////////////////////
-export function destroyTile(pos, makeSound = 1, cleanNeighbors = 1)
+export function destroyTile(pos, makeSound = 1, cleanup = 1)
 {
     // pos must be an int
     pos = pos.floor();
@@ -146,16 +149,17 @@ export function destroyTile(pos, makeSound = 1, cleanNeighbors = 1)
     makeDebris(centerPos, layerData.color.mutate());
     makeSound && sound_destroyObject.play(centerPos);
-     // set and clear tile
-    layer.setData(pos, new LJS.TileLayerData, 1);
+    // set and clear tile
+    layer.setData(pos, new LJS.TileLayerData, true);
     layer.setCollisionData(pos, GameLevel.tileType_empty);
-    // cleanup neighbors
-    if (cleanNeighbors)
+    // cleanup neighbors and rebuild webgl
+    if (cleanup)
     {
         for (let i=-1;i<=1;++i)
         for (let j=-1;j<=1;++j)
             GameLevel.decorateTile(pos.add(vec2(i,j)));
+        GameLevel.updateWebGL(layer);
     }
     return true;
@@ -180,16 +184,16 @@ export class Sky extends LJS.EngineObject
     {
         // fill background with a gradient
         const canvas = LJS.mainCanvas;
-        const context = LJS.mainContext;
-        const gradient = context.createLinearGradient(0, 0, 0, canvas.height);
-        gradient.addColorStop(0, this.skyColor);
-        gradient.addColorStop(1, this.horizonColor);
-        context.save();
-        context.fillStyle = gradient;
-        context.fillRect(0, 0, canvas.width, canvas.height);
-        context.globalCompositeOperation = 'lighter';
+        const gradientDelta = 5;
+        for(let y=0; y<canvas.height; y+=gradientDelta)
+        {
+            // draw horizontal lines to create a gradient
+            const color = this.skyColor.lerp(this.horizonColor, y/canvas.height);
+            LJS.drawRect(vec2(0,y), vec2(canvas.width*2, gradientDelta*2), color, 0, undefined, true)
+        }
         // draw stars
+        LJS.setBlendMode(true);
         const random = new LJS.RandomGenerator(this.seed);
         for (let i=1e3; i--;)
         {
@@ -201,61 +205,74 @@ export class Sky extends LJS.EngineObject
             const screenPos = vec2(
                 (random.float(w)+LJS.time*speed)%w-extraSpace,
                 (random.float(h)+LJS.time*speed*random.float())%h-extraSpace);
-            context.fillStyle = color;
-            context.fillRect(screenPos.x, screenPos.y, size, size);
+            LJS.drawRect(screenPos, vec2(size), color, 0, undefined, true)
         }
-        context.restore();
+        LJS.setBlendMode(false);
     }
 }
 ///////////////////////////////////////////////////////////////////////////////
 // parallax background mountain ranges
-export class ParallaxLayer extends LJS.EngineObject
+export class ParallaxLayer extends LJS.CanvasLayer
 {
-    constructor(index)
+    constructor(depth)
     {
-        super();
+        const renderOrder = depth - 3e3;
+        const canvasSize = vec2(512, 256);
+        super(vec2(), vec2(), 0, renderOrder, canvasSize);
+        this.canvasSize = canvasSize;
+        this.depth = depth;
+        // create a gradient for the mountains
+        const topColor = GameLevel.levelColor.mutate(.2).lerp(GameLevel.sky.skyColor, .8 - depth*.15);
+        const bottomColor = GameLevel.levelColor.subtract(LJS.CLEAR_WHITE).mutate(.2);
+        for(let i = canvasSize.y; i--;)
+        {
+            // draw a 1 pixel gradient line on the left side of the canvas
+            const p = i/canvasSize.y;
+            this.context.fillStyle = topColor.lerp(bottomColor, p);
+            this.context.fillRect(0, i, 1, 1);
+        }
-        const size = vec2(1024,512);
-        this.size = size;
-        this.index = index;
-        this.renderOrder = -3e3 + index;
-        this.canvas = document.createElement('canvas');
-        this.context = this.canvas.getContext('2d');
-        this.canvas.width = size.x;
-        this.canvas.height = size.y;
-        // create a gradient
-        const o1 = 40-20*index;
-        const o2 = 100-30*index;
-        const gradient = this.context.createLinearGradient(0,size.y/2-o1,0,size.y/2+o2);
-        const layerColor = GameLevel.levelColor.mutate(.1).lerp(GameLevel.sky.skyColor,1-index*.15);
-        gradient.addColorStop(0,layerColor);
-        gradient.addColorStop(1,layerColor.mutate(.5).scale(.1,1));
-        this.context.fillStyle = gradient;
-        // draw procedural mountains ranges
-        let groundLevel = size.y/2, groundSlope = LJS.rand(-1,1);
-        for (let i=size.x; i--;)
-            this.context.fillRect(i, groundLevel += groundSlope = LJS.rand() < .3 ? LJS.rand(1,-1) :
-                groundSlope + (size.y/2 - groundLevel)/300, 1, size.y);
+        // draw random mountains
+        const pointiness = .2;  // how pointy the mountains are
+        const levelness = .005; // how much the mountains level out
+        const slopeRange = 1;   // max slope of the mountains
+        const startGroundLevel = canvasSize.y/2;
+        let y = startGroundLevel, groundSlope = LJS.rand(-slopeRange, slopeRange);
+        for(let x=canvasSize.x; x--;)
+        {
+            // pull slope towards start ground level
+            y += groundSlope -= (y-startGroundLevel)*levelness;
+            // random change slope
+            if (LJS.rand() < pointiness)
+                groundSlope = LJS.rand(-slopeRange, slopeRange);
+            // draw 1 pixel wide vertical slice of mountain
+            this.context.drawImage(this.canvas, 0, 0, 1, canvasSize.y, x, y, 1, canvasSize.y - y);
+        }
+        // remove gradient sliver from left side
+        this.context.clearRect(0,0,1,canvasSize.y);
+        // make webgl texture
+        this.useWebGL(LJS.glEnable);
     }
     render()
     {
-        // position layer based on camera distance from center of level
-        const parallax = vec2(1e3,-100).scale(this.index**2);
-        const cameraDeltaFromCenter = LJS.cameraPos
-            .subtract(GameLevel.levelSize.scale(.5))
-            .divide(GameLevel.levelSize.divide(parallax));
-        const scale = this.size.scale(2+2*this.index);
-        const pos = LJS.mainCanvasSize.scale(.5)      // center screen
-           .add(vec2(-scale.x/2,-scale.y/2))          // center layer
-           .add(cameraDeltaFromCenter.scale(-.5))     // apply parallax
-           .add(vec2(0,(this.index*.1)*this.size.y)); // separate layers
-        // draw the parallax layer onto the main canvas
-        LJS.mainContext.drawImage(this.canvas, pos.x, pos.y, scale.x, scale.y);
+        const depth = this.depth
+        const distance = 4 + depth;
+        const parallax = vec2(150, 30).scale(depth**2+1);
+        const levelCenter = GameLevel.levelSize.scale(.5);
+        const cameraDeltaFromCenter = LJS.cameraPos.subtract(levelCenter).divide(levelCenter.scale(-1).divide(parallax));
+        const scale = distance/LJS.cameraScale;
+        const positonOffset = vec2(0, 2-depth);
+        const cameraOffset = cameraDeltaFromCenter.scale(1/LJS.cameraScale);
+        this.pos = LJS.cameraPos.add(positonOffset).add(cameraOffset);
+        this.size = this.canvasSize.scale(scale);
+        super.render();
     }
 }

package/examples/platformer/gameLevel.js CHANGED Viewed

@@ -14,6 +14,7 @@ import * as GameEffects from './gameEffects.js';
 import * as Game from './game.js';
 const {vec2, hsl, tile} = LJS;
+export const useWebGLTileLayers = true;
 export const tileType_ladder    = -1;
 export const tileType_empty     = 0;
 export const tileType_solid     = 1;
@@ -31,9 +32,9 @@ export function buildLevel()
     levelColor = LJS.randColor(hsl(0,0,.2), hsl(0,0,.8));
     levelBackgroundColor = levelColor.mutate().scale(.4,1);
     levelOutlineColor = levelColor.mutate().add(hsl(0,0,.4)).clamp();
-    buildLevelData();
+    loadLevelData();
-    // create sky object with gradient and stars
+    // create sky object with gradient background and stars
     sky = new GameEffects.Sky;
     // create parallax layers
@@ -41,114 +42,99 @@ export function buildLevel()
         new GameEffects.ParallaxLayer(i);
 }
-function buildLevelData()
+function loadLevelData()
 {
-    // load level data from an exported Tiled js file
-    let tileMapData = Game.gameLevelData;
-    if (!tileMapData)
-    {
-        // default level data if loading failed
-        tileMapData = {};
-        tileMapData.width = 100;
-        tileMapData.height = 20;
-        tileMapData.layers = [{data:[]}];
-        for(let i=100*20;i--;)
-            tileMapData.layers[0].data[i] = i>100 ? 2 : 0;
-    }
-    levelSize = vec2(tileMapData.width, tileMapData.height);
+    // load the level data
+    const tileMapData = Game.gameLevelData;
+    tileLayers = LJS.tileCollisionLoad(tileMapData, tile(0,16,1));
+    levelSize = tileLayers[0].size;
+    playerStartPos = vec2(0, levelSize.y); // default player start
+    foregroundTileLayer = tileLayers[0];
     // create table for tiles in the level tilemap
     const tileLookup =
     {
-        circle: 1,
-        ground: 2,
-        ladder: 4,
-        metal:  5,
-        player: 17,
-        crate:  18,
-        enemy:  19,
-        coin:   20,
+        circle: 0,
+        ground: 1,
+        ladder: 3,
+        metal:  4,
+        player: 16,
+        crate:  17,
+        enemy:  18,
+        coin:   19,
     }
-    // set all level data tiles
-    tileLayers = [];
-    playerStartPos = vec2(1, levelSize.y);
-    const layerCount = tileMapData.layers.length;
-    for (let layer=layerCount; layer--;)
+    for (let i=tileLayers.length; i--;)
     {
-        const layerData = tileMapData.layers[layer].data;
-        let tileLayer;
-        if (layer < layerCount-1)
-            tileLayer = new LJS.TileLayer(vec2(), levelSize, tile(0,16,1));
-        else
-        {
-            // only foreground layer has collision
-            tileLayer = new LJS.TileCollisionLayer(vec2(), levelSize, tile(0,16,1));
+        const tileLayer = tileLayers[i];
+        const isForeground = i == tileLayers.length - 1;
+        if (isForeground)
             foregroundTileLayer = tileLayer;
-        }
-        tileLayer.renderOrder = -1e3+layer;
-        tileLayers[layer] = tileLayer;
+        else
+            tileLayer.isSolid = false;
         for (let x=levelSize.x; x--;)
         for (let y=levelSize.y; y--;)
         {
             const pos = vec2(x,levelSize.y-1-y);
-            const tile = layerData[y*levelSize.x+x];
-            if (tile >= tileLookup.player)
+            const tileData = tileLayer.getData(pos).tile;
+            if (tileData >= tileLookup.player)
             {
                 // create object instead of tile
                 const objectPos = pos.add(vec2(.5));
-                if (tile == tileLookup.player)
+                if (tileData == tileLookup.player)
                     playerStartPos = objectPos;
-                if (tile == tileLookup.crate)
+                if (tileData == tileLookup.crate)
                     new GameObjects.Crate(objectPos);
-                if (tile == tileLookup.enemy)
+                if (tileData == tileLookup.enemy)
                     new GameObjects.Enemy(objectPos);
-                if (tile == tileLookup.coin)
+                if (tileData == tileLookup.coin)
                     new GameObjects.Coin(objectPos);
+                // replace with empty tile and empty collision
+                tileLayer.setData(pos, new LJS.TileLayerData);
+                tileLayer.setCollisionData(pos, 0);
                 continue;
             }
-            // get tile type for special tiles
-            let tileType = tileType_empty;
-            if (tile > 0)
-                tileType = tileType_breakable;
-            if (tile == tileLookup.ladder)
+            // get tile type
+            let tileType = tileData? tileType_breakable : tileType_empty;
+            if (tileData == tileLookup.ladder)
                 tileType = tileType_ladder;
-            if (tile == tileLookup.metal)
+            if (tileData == tileLookup.metal)
                 tileType = tileType_solid;
             if (tileType)
             {
                 // set collision for solid tiles
-                if (tileLayer == foregroundTileLayer)
+                if (tileLayer.isSolid)
                     tileLayer.setCollisionData(pos, tileType);
-                // randomize tile appearance
-                let direction, mirror, color;
                 if (tileType == tileType_breakable)
                 {
-                    direction = LJS.randInt(4);
-                    mirror = LJS.randInt(2);
-                    color = layer ? levelColor : levelBackgroundColor;
+                    // randomize tile appearance
+                    let direction = LJS.randInt(4);
+                    let mirror = LJS.randInt(2);
+                    let color = i ? levelColor : levelBackgroundColor;
                     color = color.mutate(.03);
-                }
-                // set tile layer data
-                const data = new LJS.TileLayerData(tile-1, direction, mirror, color);
-                tileLayer.setData(pos, data);
+                    // set tile layer data
+                    const data = new LJS.TileLayerData(tileData, direction, mirror, color);
+                    tileLayer.setData(pos, data);
+                }
             }
         }
         tileLayer.redraw();
     }
     // apply decoration to all level tiles
     const pos = vec2();
+    const layerCount = tileMapData.layers.length;
     for (let layer=layerCount; layer--;)
-    for (pos.x=levelSize.x; pos.x--;)
-    for (pos.y=levelSize.y; pos.y--;)
-        decorateTile(pos, layer);
+    {
+        for (pos.x=levelSize.x; pos.x--;)
+        for (pos.y=levelSize.y; pos.y--;)
+            decorateTile(pos, layer);
+        updateWebGL(tileLayers[layer]);
+    }
 }
 export function decorateTile(pos, layer=1)
@@ -213,4 +199,9 @@ export function getCameraTarget()
     // camera is above player
     const offset = 100/LJS.cameraScale*LJS.percent(LJS.mainCanvasSize.y, 300, 600);
     return Game.player.pos.add(vec2(0, offset));
+}
+export function updateWebGL(layer)
+{
+    layer.useWebGL(useWebGLTileLayers);
 }

package/examples/platformer/gameObjects.js CHANGED Viewed

@@ -188,7 +188,7 @@ export class Grenade extends GameObject
         super(pos, vec2(.2), Game.spriteAtlas.grenade);
         this.beepTimer = new Timer(1);
-        this.elasticity   = .3;
+        this.restitution   = .3;
         this.friction     = .9;
         this.angleDamping = .96;
         this.renderOrder  = 1e8;
@@ -253,7 +253,7 @@ export class Weapon extends LJS.EngineObject
             1, .95, 1, 0, 0,    // damp, angleDamp, gravity, particleCone, fade
             .1, 1               // randomness, collide, additive, colorLinear, renderOrder
         ), vec2(.1,0), -.8);
-        this.shellEmitter.elasticity = .5;
+        this.shellEmitter.restitution = .5;
         this.shellEmitter.particleDestroyCallback = GameEffects.persistentParticleDestroyCallback;
     }
@@ -263,7 +263,7 @@ export class Weapon extends LJS.EngineObject
         // update recoil
         if (this.recoilTimer.active())
-            this.localAngle = LJS.lerp(this.recoilTimer.getPercent(), this.localAngle, 0);
+            this.localAngle = LJS.lerp(this.localAngle, 0, this.recoilTimer.getPercent());
         this.mirror = this.parent.mirror;
         this.fireTimeBuffer += LJS.timeDelta;
@@ -375,7 +375,7 @@ export class Bullet extends LJS.EngineObject
             .5, 1, 1            // randomness, collide, additive, colorLinear, renderOrder
         );
         emitter.trailScale = 1;
-        emitter.elasticity = .3;
+        emitter.restitution = .3;
         emitter.angle = this.velocity.angle() + LJS.PI;
     }
 }

package/examples/platformer/index.html CHANGED Viewed

@@ -6,4 +6,4 @@
 <meta name=mobile-web-app-capable content=yes>
 <link rel=icon type=image/png href=../favicon.png>
 </head><body>
-<script src=game.js type=module></script>
+<script src=game.js type=module></script>

package/examples/puzzle/index.html CHANGED Viewed

@@ -5,4 +5,4 @@
 <meta name=mobile-web-app-capable content=yes>
 <link rel=icon type=image/png href=../favicon.png>
 </head><body>
-<script src=game.js type=module></script>
+<script src=game.js type=module></script>

package/examples/shorts/base.html CHANGED Viewed

@@ -1,7 +1,28 @@
 <!DOCTYPE html><meta charset=utf-8><body>
-<script src=../../dist/littlejs.js?1120></script>
-<script>
+<script src=../../dist/littlejs.js?11212></script>
+<script src=../../dist/box2d.wasm.js></script>
+<!-- LittleJS Engine Source
+<script src=../../src/engineDebug.js></script>
+<script src=../../src/engineUtilities.js></script>
+<script src=../../src/engineSettings.js></script>
+<script src=../../src/engineObject.js></script>
+<script src=../../src/engineDraw.js></script>
+<script src=../../src/engineInput.js></script>
+<script src=../../src/engineAudio.js></script>
+<script src=../../src/engineTileLayer.js></script>
+<script src=../../src/engineParticles.js></script>
+<script src=../../src/engineMedals.js></script>
+<script src=../../src/engineWebGL.js></script>
+<script src=../../src/engine.js></script>
+<script src=../../plugins/box2d.js></script>
+<script src=../../plugins/box2d.wasm.js></script>
+<script src=../../plugins/drawUtilities.js></script>
+<script src=../../plugins/postProcess.js></script>
+<script src=../../plugins/uiSystem.js></script>
+<script src=../../plugins/zzfxm.js></script>
+-->
+<script>
 'use strict';
 // use fixed size canvas for examples
@@ -23,4 +44,4 @@ function gameUpdatePost() {}
 function gameRender() {}
 function gameRenderPost() {}
-</script>
+</script>

package/examples/shorts/box2d.js ADDED Viewed

@@ -0,0 +1,46 @@
+async function gameInit()
+{
+    // setup box2d
+    await box2dInit();
+    mouseJoint = 0;
+    gravity.y = -50;
+    // create ground object
+    groundObject = new Box2dObject(vec2(-8), vec2(), 0, 0, GRAY, box2d.bodyTypeStatic);
+    groundObject.addBox(vec2(100,2));
+    // add some random objects
+    for(let i=50; i--;)
+    {
+        const o = new Box2dObject(randInCircle(5), vec2(), 0, 0, randColor());
+        randInt(2) ? o.addCircle(rand(1,2)) : o.addRandomPoly(rand(1,2));
+    }
+}
+function gameUpdate()
+{
+    // mouse controls
+    if (mouseJoint)
+    {
+        // update mouse joint
+        mouseJoint.setTarget(mousePos);
+        if (mouseWasReleased(0))
+        {
+            // release object
+            mouseJoint = mouseJoint.destroy();
+        }
+    }
+    else if (mouseWasPressed(0))
+    {
+        // grab object
+        const object = box2d.pointCast(mousePos);
+        if (object)
+            mouseJoint = new Box2dTargetJoint(object, groundObject, mousePos);
+    }
+}
+function gameRenderPost()
+{
+    // draw mouse joint
+    mouseJoint && drawLine(mousePos, mouseJoint.getAnchorB(), .2, RED);
+}