littlejsengine 1.13.1 → 1.13.4

package/examples/shorts/shapes.js

@@ -1,24 +1,24 @@
 function gameRender()
 {
     // polygon shapes
-    for(let j=3; j<7; ++j)
+    for (let j=3; j<7; ++j)
     {
         let points = [];
-        for(let i=0; i<j; ++i)
+        for (let i=0; i<j; ++i)
         {
             let angle = i * Math.PI * 2 / j;
-            points.push(vec2(j*4-18,0).add(vec2(Math.sin(angle), Math.cos(angle))));
+            points.push(vec2(j*4-18,0).add(vec2(0,1).rotate(angle)));
         }
-        drawPoly(points, hsl(j/4,1,.5)); // draw a star
+        drawPoly(points, hsl(j/4+time/9,1,.5)); // draw a regular polygon
     }
 
     // circles and ellipses
-    drawCircle(vec2(0,5), 1, hsl(.15,1,.5));
-    drawEllipse(vec2(-5,5), 2, 1, 0, hsl(0,1,.5));
-    drawEllipse(vec2(5,5), .5, 2, .5, hsl(.55,1,.5));
+    drawCircle(vec2(0,5), 1+wave(.5), hsl(.15,1,.5));
+    drawEllipse(vec2(-5,5), vec2(2,1), hsl(0,1,.5));
+    drawEllipse(vec2(5,5), vec2(.5,2), hsl(.55,1,.5), .5);
 
     // rects and lines
-    drawRect(vec2(0,-5), vec2(13,2), hsl(.6,1,.5));
-    drawLine(vec2(-5,-7), vec2(5,-3), 1,  hsl(0,0,1));
+    drawRect(vec2(0,-5), vec2(4,3), hsl(.6,1,.5), time);
+    drawLine(vec2(-5,-7), vec2(5,-3), 1,  hsl(0,0,1, .5));
     drawLine(vec2(-5,-3), vec2(5,-7), .2, hsl(1,1,.5));
 }

package/examples/shorts/slidingPuzzle.js

@@ -33,8 +33,8 @@ class PuzzlePiece extends EngineObject
 function gameInit()
 {
     // create puzzle pieces
-    for(let x=gridSize.x; x--;)
-    for(let y=gridSize.y; y--;)
+    for (let x=gridSize.x; x--;)
+    for (let y=gridSize.y; y--;)
         (x||y) && new PuzzlePiece(vec2(x,y), pieceSize);
 
     // center camera on grid

package/examples/shorts/starfield.js

@@ -1,17 +1,15 @@
 function gameRender()
 {
-    setBlendMode(1);
     // precreate variables to avoid overhead
     const pos = vec2(), size = vec2(), color = WHITE;
-    for(let i=2e3; i--;)
+    for (let i=2e3; i--;)
     {
         // use math to generate random star positions
         const offset = time*(9+i**2.1%15) + i**2.3;
-        pos.x = offset%70-35;
-        pos.y = i/120-8;
-        size.x = size.y = i%.11+.07;
-        color.setHSLA(0, 0, Math.sin(i)**4);
+        pos.x = offset%70 - 35;
+        pos.y = i/110 - 9;
+        size.x = size.y = i%.11 + .07;
+        color.set(1,1,1,Math.sin(i)**4);
         drawRect(pos, size, color);
     }
-    setBlendMode(0);
 }

package/examples/shorts/systemFont.js

@@ -6,7 +6,7 @@ function gameRender()
 
     // show every character in the system font
     let s = '';
-    for(let i=32; i<128; ++i)
+    for (let i=32; i<128; ++i)
     {
         if (i%32 == 0)
             s += '\n';

package/examples/shorts/uiSystem.js

@@ -8,6 +8,7 @@ function gameInit()
     new UISystemPlugin;
     uiSystem.defaultSoundPress = new Sound([1,0,220]);
     uiSystem.defaultSoundClick = new Sound([1,0,440]);
+    uiSystem.defaultCornerRadius = 8;
 
     // setup example menu
     uiMenu = new UIObject(mainCanvasSize.scale(.5));

package/examples/starter/build.js

@@ -36,7 +36,7 @@ fs.rmSync(`${PROGRAM_NAME}.zip`, { force: true });
 fs.mkdirSync(BUILD_FOLDER);
 
 // copy data files
-for(const file of dataFiles)
+for (const file of dataFiles)
     fs.copyFileSync(file, `${BUILD_FOLDER}/${file}`);
 
 Build
@@ -50,7 +50,6 @@ Build
 
 console.log('');
 console.log(`Build Completed in ${((Date.now() - startTime)/1e3).toFixed(2)} seconds!`);
-console.log(`Size of ${PROGRAM_NAME}.zip: ${fs.statSync(`${PROGRAM_NAME}.zip`).size} bytes`);
 
 ///////////////////////////////////////////////////////////////////////////////
 
@@ -73,7 +72,7 @@ function Build(outputFile, files=[], buildSteps=[])
 
 function closureCompilerStep(filename)
 {
-    console.log(`Running closure compiler...`);
+    console.log('Running closure compiler...');
 
     // use closer compiler to minify the code
     const filenameTemp = filename + '.tmp';
@@ -84,22 +83,23 @@ function closureCompilerStep(filename)
 
 function uglifyBuildStep(filename)
 {
-    console.log(`Running uglify...`);
+    console.log('Running uglify...');
     child_process.execSync(`npx uglifyjs ${filename} -c -m -o ${filename}`, {stdio: 'inherit'});
 };
 
 function roadrollerBuildStep(filename)
 {
-    console.log(`Running roadroller...`);
+    console.log('Running roadroller...');
     child_process.execSync(`npx roadroller ${filename} -o ${filename}`, {stdio: 'inherit'});
 };
 
 function htmlBuildStep(filename)
 {
-    console.log(`Building html...`);
+    console.log('Building html...');
 
     // create html file
-    let buffer = '<!DOCTYPE html>';
+    let buffer = ''
+    buffer += '<!DOCTYPE html>';
     buffer += '<head>';
     buffer += `<title>${PROGRAM_TITLE}</title>`;
     buffer += '<meta charset=utf-8>';
@@ -115,8 +115,9 @@ function htmlBuildStep(filename)
 
 function zipBuildStep(filename)
 {
-    console.log(`Zipping...`);
+    console.log('Zipping...');
     const sources = ['index.html', ...dataFiles];
     const sourceList = sources.join(' ');
     child_process.execSync(`npx bestzip ../${PROGRAM_NAME}.zip ${sourceList}`, {cwd:BUILD_FOLDER, stdio: 'inherit'});
+    console.log(`Size of ${PROGRAM_NAME}.zip: ${fs.statSync(`${PROGRAM_NAME}.zip`).size} bytes`);
 };

package/examples/starter/game.js

@@ -104,7 +104,10 @@ function gameUpdate()
 
     // move particles to mouse location if on screen
     if (mousePosScreen.x)
+    {
         particleEmitter.pos = mousePos;
+        particleEmitter.velocity = mouseDelta.scale(.3*timeDelta);
+    }
 }
 
 ///////////////////////////////////////////////////////////////////////////////
@@ -116,8 +119,8 @@ function gameUpdatePost()
 ///////////////////////////////////////////////////////////////////////////////
 function gameRender()
 {
-    // draw a grey square in the background without using webgl
-    drawRect(vec2(16,8), vec2(20,14), hsl(0,0,.6), 0, false);
+    // draw a grey square in the background
+    drawRect(vec2(16,8), vec2(20,14), hsl(0,0,.6));
     
     // draw the logo as a tile
     drawTile(vec2(21,5), vec2(4.5), tile(3,128));

package/examples/starter/index.html

@@ -7,7 +7,7 @@
 </head><body>
 
 <!-- LittleJS Engine -->
-<script src=../../dist/littlejs.js?11212></script>
+<script src=../../dist/littlejs.js?1133></script>
 
 <!-- LittleJS Engine Source
 <script src=../../src/engineDebug.js></script>
@@ -31,4 +31,4 @@
 -->
 
 <!-- Add your game scripts here -->
-<script src=game.js?11212></script>
+<script src=game.js?1133></script>

package/examples/stress/index.html

@@ -123,23 +123,23 @@ function gameRender()
     // update sprites
     for (const sprite of sprites)
     {
-        // keep sprites above 0
-        sprite.pos.y = LJS.max(sprite.pos.y, 0);
-
         // apply velocity and gravity
         sprite.pos.x += sprite.velocity.x;
         sprite.pos.y += sprite.velocity.y += LJS.gravity.y;
 
         // bounce
         if (sprite.pos.y < 0)
+        {
+            sprite.pos.y = 0;
             sprite.velocity.y = LJS.rand(.3,.8);
+        }
         if (sprite.pos.x < 0)
             sprite.pos.x = 0, sprite.velocity.x *= -1;
         if (sprite.pos.x > tileLayer.size.x)
             sprite.pos.x = tileLayer.size.x, sprite.velocity.x *= -1;
 
         // rotate sprite
-        sprite.angle += .02*LJS.sign(sprite.velocity.x);
+        sprite.angle += sprite.velocity.x > 0 ? .02 : -.02;
 
         // draw the sprite directly using glDraw for extra speed
         LJS.glDraw(sprite.pos.x, sprite.pos.y, 1, 1, sprite.angle, 0, 0, 1, 1,
@@ -162,5 +162,5 @@ LJS.engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost,
 
 ///////////////////////////////////////////////////////////////////////////////
 // music - Depp Loop
-const music = new LJS.ZzFXMusic([[[.6,0,76,,,1,1,.5,,,,,.1,,,.06,,.5,.2,,-700],[,0,43,.01,,.2,2,,,,,,,,,,.01],[,0,170,.003,,.008,,.97,-35,53,,,,,,.1],[.8,0,270,,,.12,3,1.65,-2,,,,,4.5,,.02],[,0,86,,,.1,,.7,,,,.5,,6.7,1,.05],[,0,41,,.05,.4,2,0,,,9,.01,,,,.08,.02],[,0,2200,,,.04,3,2,,,800,.02,,4.8,,.01,.1],[.3,0,16,,,.3,3]],[[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33],[3,1,22,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,24,,,,,,,,,,,,,,,,,,,,,,,,22,,22,,22,,,,],[5,-1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[,1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33],[3,1,24,,,,,,,,27,,,,,,,,,,,,,,,,27,,,,24,,,,24,,,,,,,,27,,,,,,,,,,,,,,,,24,,24,,24,,,,],[5,-1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[,1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[6,1,,,34,34,34,,,,,,34,34,,,,,34,,,,34,34,,,,,34,,,,34,,,,34,34,34,,,,,,34,,,,,,34,34,,,34,34,,,,,,,,,34,34],[4,1,,,,,,,24,,,,,,24,,24,,,,24,,,,24,,,,,,,,,,,,,,,,24,,,,,,24,,24,,,,24,,,,24,,,,,,,,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,23,23,35,23,23,36,23,23,35,23,23,36,23,23,35,35,23,23,35,23,23,35,23,23,36,23,23,35,23,23,36,36],[5,-1,21,,,19,,,21,,,,,,,,,,21,,,19,,,17,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,],[3,1,24,,,24,,,24,,,,,,,,,,24,,,24,,,24,,,,24.75,24.5,24.26,24.01,24.01,24.01,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25],[4,-1,,,,,,,,,,,,,,,,,,,,,,,,,,,24.75,24.5,24.26,24.01,24.01,24.01,24.01,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,23,,21,23,,35,,23,,21,23,,35,,35,,23,,21,23,,35,,21,23,,35,,21,23,,,],[6,1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,34,36,34,,33,34,34,36,31,36,34,,31,34,32,,33,36,34,,31,34,34,36,33,36,33,,31,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29],[4,1,24,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,21,,19,21,,33,,21,,19,21,,33,,33,,21,,19,21,,33,,21,,19,21,,33,,33,,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29],[2,1,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,,,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,,,],[6,1,,,36,,,,,,36,,36,,,,,,,,36,,,,,,36,,36,,,,,,,,36,,,,,,,,,,,,,,,,36,,,,,,36,,36,,,,,,],[3,1,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25,,,,,25,,,,,25,,,25,,,,,,,,25,,,,,,,,25,25,25,25]],[[1,-1,14,14,26,14,14,26,14,14,26,14,14,26,14,14,26,26,14,14,26,14,14,26,14,14,26,14,14,26,14,14,26,26,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29,19,19,31,19,19,31,19,19,31,19,19,31,19,19,31,31],[4,1,24,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,36,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,19,,19,19,31,19,19,31,19,,19,19,31,19,19,31],[2,1,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,,,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,,,],[3,1,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25],[6,1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,34,,,,,,34,,34,,,,,,,,34,,,,,,34,,34,,,,,,]]],[0,1,1,2,3,4,4]]);
+const music = new LJS.ZzFXMusic([[[.6,0,43,,,1,1,.5,,,,,.1,,,.05,,.5,.4,.2],[,0,43,.01,,.2,2,,,,,,,,,,.01],[,0,170,.003,,.008,,.97,-35,53,,,,,,.1],[.8,0,270,,,.12,3,1.65,-2,,,,,4.5,,.02],[,0,86,,,.1,,.7,,,,.5,,6.7,1,.05],[,0,41,,.05,.4,2,0,,,9,.01,,,,.08,.02],[,0,2200,,,.04,3,2,,,800,.02,,4.8,,.01,.1],[.3,0,16,,,.3,3]],[[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33],[3,1,22,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,24,,,,,,,,,,,,,,,,,,,,,,,,22,,22,,22,,,,],[5,-1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[,1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33],[3,1,24,,,,,,,,27,,,,,,,,,,,,,,,,27,,,,24,,,,24,,,,,,,,27,,,,,,,,,,,,,,,,24,,24,,24,,,,],[5,-1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[,1,21,,,,,,,,,,,,,,,,,,,,,,,,,,,,24,,,,23,,,,,,,,,,,,,,,,,,,,,,,,24,,23,,21,,,,],[6,1,,,34,34,34,,,,,,34,34,,,,,34,,,,34,34,,,,,34,,,,34,,,,34,34,34,,,,,,34,,,,,,34,34,,,34,34,,,,,,,,,34,34],[4,1,,,,,,,24,,,,,,24,,24,,,,24,,,,24,,,,,,,,,,,,,,,,24,,,,,,24,,24,,,,24,,,,24,,,,,,,,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,23,23,35,23,23,36,23,23,35,23,23,36,23,23,35,35,23,23,35,23,23,35,23,23,36,23,23,35,23,23,36,36],[5,-1,21,,,19,,,21,,,,,,,,,,21,,,19,,,17,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,],[3,1,24,,,24,,,24,,,,,,,,,,24,,,24,,,24,,,,24.75,24.5,24.26,24.01,24.01,24.01,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25],[4,-1,,,,,,,,,,,,,,,,,,,,,,,,,,,24.75,24.5,24.26,24.01,24.01,24.01,24.01,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,23,,21,23,,35,,23,,21,23,,35,,35,,23,,21,23,,35,,21,23,,35,,21,23,,,],[6,1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,34,36,34,,33,34,34,36,31,36,34,,31,34,32,,33,36,34,,31,34,34,36,33,36,33,,31,,,]],[[1,-1,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,21,21,33,21,21,33,21,21,33,21,21,33,21,21,33,33,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29],[4,1,24,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,21,,19,21,,33,,21,,19,21,,33,,33,,21,,19,21,,33,,21,,19,21,,33,,33,,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29],[2,1,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,,,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,34,34,,34,,,],[6,1,,,36,,,,,,36,,36,,,,,,,,36,,,,,,36,,36,,,,,,,,36,,,,,,,,,,,,,,,,36,,,,,,36,,36,,,,,,],[3,1,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25,,,,,25,,,,,25,,,25,,,,,,,,25,,,,,,,,25,25,25,25]],[[1,-1,14,14,26,14,14,26,14,14,26,14,14,26,14,14,26,26,14,14,26,14,14,26,14,14,26,14,14,26,14,14,26,26,17,17,29,17,17,29,17,17,29,17,17,29,17,17,29,29,19,19,31,19,19,31,19,19,31,19,19,31,19,19,31,31],[4,1,24,24,,24,24,,24,24,24,24,,24,24,,24,,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,24,24,24,24,,24,24,,36,,24,24,,24,24,,24,24,24,24,,24,24,,24,24],[7,-1,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,14,,14,14,26,14,14,26,17,,17,17,29,17,17,29,17,,17,17,29,17,17,29,19,,19,19,31,19,19,31,19,,19,19,31,19,19,31],[2,1,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,,,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,36,36,,36,,,],[3,1,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25,,,,,25,,,,,,,,25,,,,,,,,25,,,,,,,,25,25,25,25],[6,1,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,34,,,,,,34,,34,,,,,,,,34,,,,,,34,,34,,,,,,]]],[0,1,1,2,3,4,4]]);
 </script>

package/examples/style.css

@@ -109,10 +109,13 @@ button:disabled
     background-color: #666;
     border-color: #666;
 }
+input[type='checkbox']:disabled
+{
+    opacity: 0.5;
+}
 .error-line
 {
-    background-color: rgba(255, 0, 0, 0.15) !important;
-    border-left: 3px solid #ff0000 !important;
+    background-color: #f004 !important;
 }
 
 /*  LittleJS CodeMirror Theme */

package/examples/typescript/build.js

@@ -27,5 +27,5 @@ child_process.execSync(`npx tsc ${tsFiles} --outDir "./${BUILD_FOLDER}" --target
 console.log(`TypeScript built in ${((Date.now() - startTime)/1e3).toFixed(2)} seconds!`);
 
 console.log(`Moving js files back to root...`);
-for(const file of jsSourceFiles)
+for (const file of jsSourceFiles)
     fs.copyFileSync(`${BUILD_FOLDER}/${file}`, file);

package/examples/typescript/game.js

@@ -85,8 +85,8 @@ function gameUpdatePost() {
 }
 ///////////////////////////////////////////////////////////////////////////////
 function gameRender() {
-    // draw a grey square in the background without using webgl
-    LJS.drawRect(vec2(16, 8), vec2(20, 14), hsl(0, 0, .6), 0, false);
+    // draw a grey square in the background
+    LJS.drawRect(vec2(16, 8), vec2(20, 14), hsl(0, 0, .6));
     // draw the logo as a tile
     LJS.drawTile(vec2(21, 5), vec2(4.5), tile(3, 128));
 }

package/examples/typescript/game.ts

@@ -101,7 +101,10 @@ function gameUpdate()
 
     // move particles to mouse location if on screen
     if (LJS.mousePosScreen.x)
+    {
         particleEmitter.pos = LJS.mousePos;
+        particleEmitter.velocity = LJS.mouseDelta.scale(.3*LJS.timeDelta);
+    }
 }
 
 ///////////////////////////////////////////////////////////////////////////////
@@ -113,8 +116,8 @@ function gameUpdatePost()
 ///////////////////////////////////////////////////////////////////////////////
 function gameRender()
 {
-    // draw a grey square in the background without using webgl
-    LJS.drawRect(vec2(16,8), vec2(20,14), hsl(0,0,.6), 0, false);
+    // draw a grey square in the background
+    LJS.drawRect(vec2(16,8), vec2(20,14), hsl(0,0,.6));
     
     // draw the logo as a tile
     LJS.drawTile(vec2(21,5), vec2(4.5), tile(3,128));

package/examples/uiSystem/game.js

@@ -23,6 +23,7 @@ function createUI()
 {
     LJS.uiSystem.defaultSoundPress = new LJS.Sound([1,0,220]);
     LJS.uiSystem.defaultSoundClick = new LJS.Sound([1,0,440]);
+    LJS.uiSystem.defaultCornerRadius = 8;
 
     // setup root to attach all ui elements to
     uiRoot = new LJS.UIObject;
@@ -110,7 +111,7 @@ function gameRender()
 {
     // test game rendering
     LJS.drawRect(vec2(), vec2(1e3), hsl(0,0,.2));
-    for(let i=0; i<1e3; ++i)
+    for (let i=0; i<1e3; ++i)
     {
         const pos = vec2(30*Math.sin(i+LJS.time/9),20*Math.sin(i*i+LJS.time/9));
         LJS.drawTile(pos, vec2(2), tile(3,128), hsl(i/9,1,.4), LJS.time+i, !(i%2), hsl(i/9,1,.1,0));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "littlejsengine",
-  "version": "1.13.1",
+  "version": "1.13.4",
   "description": "LittleJS - Tiny and Fast HTML5 Game Engine",
   "main": "dist/littlejs.esm.js",
   "types": "dist/littlejs.d.ts",
@@ -39,4 +39,4 @@
     "typescript": "~5.1.6",
     "uglify-js": "~3.17.4"
   }
-}
+}

package/plugins/box2d.js

@@ -61,7 +61,7 @@ class Box2dObject extends EngineObject
         bodyDef.set_angle(-angle);
         this.body = box2d.world.CreateBody(bodyDef);
         this.body.object = this;
-        this.outlineColor = BLACK;
+        this.lineColor = BLACK;
     }
 
     /** Destroy this object and it's physics body */
@@ -88,7 +88,7 @@ class Box2dObject extends EngineObject
         if (this.tileInfo)
             super.render();
         else
-            this.drawFixtures(this.color, this.outlineColor, this.lineWidth, mainContext);
+            this.drawFixtures(this.color, this.lineColor, this.lineWidth, mainContext);
     }
 
     /** Render debug info */
@@ -102,13 +102,13 @@ class Box2dObject extends EngineObject
 
     /** Draws all this object's fixtures 
      *  @param {Color}  [color]
-     *  @param {Color}  [outlineColor]
+     *  @param {Color}  [lineColor]
      *  @param {number} [lineWidth]
      *  @param {CanvasRenderingContext2D} [context] */
-    drawFixtures(color=WHITE, outlineColor, lineWidth=.1, context)
+    drawFixtures(color=WHITE, lineColor, lineWidth=.1, context)
     {
         this.getFixtureList().forEach(fixture=>
-            box2d.drawFixture(fixture, this.pos, this.angle, color, outlineColor, lineWidth, context));
+            box2d.drawFixture(fixture, this.pos, this.angle, color, lineColor, lineWidth, context));
     }
 
     ///////////////////////////////////////////////////////////////////////////////
@@ -1589,10 +1589,10 @@ class Box2dPlugin
      *  @param {Vector2} pos
      *  @param {number} angle
      *  @param {Color} [color]
-     *  @param {Color} [outlineColor]
+     *  @param {Color} [lineColor]
      *  @param {number} [lineWidth]
      *  @param {CanvasRenderingContext2D} [context] */
-    drawFixture(fixture, pos, angle, color=WHITE, outlineColor=BLACK, lineWidth=.1, context=drawContext)
+    drawFixture(fixture, pos, angle, color=WHITE, lineColor=BLACK, lineWidth=.1, context=drawContext)
     {
         const shape = box2d.castObjectType(fixture.GetShape());
         switch (shape.GetType())
@@ -1602,101 +1602,25 @@ class Box2dPlugin
                 let points = [];
                 for (let i=shape.GetVertexCount(); i--;)
                     points.push(box2d.vec2From(shape.GetVertex(i)));
-                box2d.drawPoly(pos, angle, points, color, outlineColor, lineWidth, context);
+                drawPoly(points, color, lineWidth, lineColor, pos, angle, false, false, context);
                 break;
             }
             case box2d.instance.b2Shape.e_circle:
             {
                 const radius = shape.get_m_radius();
-                box2d.drawCircle(pos, radius, color, outlineColor, lineWidth, context);
+                drawCircle(pos, radius, color, lineWidth, lineColor, false, false, context);
                 break;
             }
             case box2d.instance.b2Shape.e_edge:
             {
                 const v1 = box2d.vec2From(shape.get_m_vertex1());
                 const v2 = box2d.vec2From(shape.get_m_vertex2());
-                box2d.drawLine(pos, angle, v1, v2, color, lineWidth, context);
+                drawLine(v1, v2, lineWidth, lineColor, pos, angle, false, false, context);
                 break;
             }
         }
     }
 
-    /** draws a circle
-     *  @param {Vector2} pos
-     *  @param {number} radius
-     *  @param {Color} [color]
-     *  @param {Color} [outlineColor]
-     *  @param {number} [lineWidth]
-     *  @param {CanvasRenderingContext2D} [context] */
-    drawCircle(pos, radius, color=WHITE, outlineColor=BLACK, lineWidth=.1, context=drawContext)
-    {
-        drawCanvas2D(pos, vec2(1), 0, 0, context=>
-        {
-            context.beginPath();
-            context.arc(0, 0, radius, 0, 9);
-            box2d.drawFillStroke(color, outlineColor, lineWidth, context);
-        }, 0, context);
-    }
-
-    /** draws a polygon
-     *  @param {Vector2} pos
-     *  @param {number} angle
-     *  @param {Array<Vector2>} points
-     *  @param {Color} [color]
-     *  @param {Color} [outlineColor]
-     *  @param {number} [lineWidth]
-     *  @param {CanvasRenderingContext2D} [context] */
-    drawPoly(pos, angle, points, color=WHITE, outlineColor=BLACK, lineWidth=.1, context=drawContext)
-    {
-        drawCanvas2D(pos, vec2(1), angle, 0, context=>
-        {
-            context.beginPath();
-            points.forEach(p=>context.lineTo(p.x, p.y));
-            context.closePath();
-            box2d.drawFillStroke(color, outlineColor, lineWidth, context);
-        }, 0, context);
-    }
-
-    /** draws a line
-     *  @param {Vector2} pos
-     *  @param {number} angle
-     *  @param {Vector2} posA
-     *  @param {Vector2} posB
-     *  @param {Color} [color]
-     *  @param {number} [lineWidth]
-     *  @param {CanvasRenderingContext2D} [context] */
-    drawLine(pos, angle, posA, posB, color=WHITE, lineWidth=.1, context=drawContext)
-    {
-        drawCanvas2D(pos, vec2(1), angle, 0, context=>
-        {
-            context.beginPath();
-            context.lineTo(posA.x, posA.y);
-            context.lineTo(posB.x, posB.y);
-            box2d.drawFillStroke(0, color, lineWidth, context);
-        }, 0, context);
-    }
-
-    /** performs a fill or stroke as a helper to the other draw functions
-     *  @param {Color} [color]
-     *  @param {Color} [outlineColor]
-     *  @param {number} [lineWidth]
-     *  @param {CanvasRenderingContext2D} [context] */
-    drawFillStroke(color=WHITE, outlineColor=BLACK, lineWidth=.1, context=drawContext)
-    {
-        if (color)
-        {
-            context.fillStyle = color.toString();
-            context.fill();
-        }
-        if (outlineColor && lineWidth)
-        {
-            context.lineWidth = lineWidth;
-            context.lineJoin = context.lineCap = 'round';
-            context.strokeStyle = outlineColor.toString();
-            context.stroke();
-        }
-    }
-
     ///////////////////////////////////////////////////////////////////////////////
     // helper functions
 
@@ -1797,6 +1721,7 @@ async function box2dInit()
     function setupDebugDraw()
     {
         // setup debug draw
+        const debugLineWidth = .1;
         const debugDraw = new box2d.instance.JSDraw();
         const box2dColor = (c)=> new Color(c.get_r(), c.get_g(), c.get_b());
         const box2dColorPointer = (c)=>
@@ -1814,33 +1739,33 @@ async function box2dInit()
             color = getDebugColor(color);
             point1 = box2d.vec2FromPointer(point1);
             point2 = box2d.vec2FromPointer(point2);
-            box2d.drawLine(vec2(), 0, point1, point2, color, undefined, overlayContext);
+            drawLine(point1, point2, debugLineWidth, color, vec2(), 0, false, false, overlayContext);
         };
         debugDraw.DrawPolygon = function(vertices, vertexCount, color)
         {
             color = getDebugColor(color);
             const points = getPointsList(vertices, vertexCount);
-            box2d.drawPoly(vec2(), 0, points, undefined, color, undefined, overlayContext);
+            drawPoly(points, CLEAR_WHITE, debugLineWidth, color, vec2(), 0, false, false, overlayContext);
         };
         debugDraw.DrawSolidPolygon = function(vertices, vertexCount, color)
         {
             color = getDebugColor(color);
             const points = getPointsList(vertices, vertexCount);
-            box2d.drawPoly(vec2(), 0, points, color, color, undefined, overlayContext);
+            drawPoly(points, color, 0, color, vec2(), 0, false, false, overlayContext);
         };
         debugDraw.DrawCircle = function(center, radius, color)
         {
             color = getDebugColor(color);
             center = box2d.vec2FromPointer(center);
-            box2d.drawCircle(center, radius, undefined, color, undefined, overlayContext);
+            drawCircle(center, radius, CLEAR_WHITE, debugLineWidth, color, false, false, overlayContext);
         };
         debugDraw.DrawSolidCircle = function(center, radius, axis, color)
         {
             color = getDebugColor(color);
             center = box2d.vec2FromPointer(center);
             axis = box2d.vec2FromPointer(axis).scale(radius);
-            box2d.drawCircle(center, radius, color, color, undefined, overlayContext);
-            box2d.drawLine(center, 0, vec2(), axis, color, undefined, overlayContext);
+            drawCircle(center, radius, color, debugLineWidth, color, false, false, overlayContext);
+            drawLine(vec2(), axis, debugLineWidth, color, center, 0, false, false, overlayContext);
         };
         debugDraw.DrawTransform = function(transform)
         {
@@ -1849,8 +1774,8 @@ async function box2dInit()
             const angle = -transform.get_q().GetAngle();
             const p1 = vec2(1,0), c1 = rgb(.75,0,0,.8);
             const p2 = vec2(0,1), c2 = rgb(0,.75,0,.8);
-            box2d.drawLine(pos, angle, vec2(), p1, c1, undefined, overlayContext);
-            box2d.drawLine(pos, angle, vec2(), p2, c2, undefined, overlayContext);
+            drawLine(vec2(), p1, debugLineWidth, c1, pos, angle, false, false, overlayContext);
+            drawLine(vec2(), p2, debugLineWidth, c2, pos, angle, false, false, overlayContext);
         }
             
         debugDraw.AppendFlags(box2d.instance.b2Draw.e_shapeBit);