littlejsengine 1.2.0 → 1.2.3

package/engine/engine.all.release.js

@@ -659,6 +659,11 @@ let inputWASDEmulateDirection = 1;
  *  @memberof Settings */
 let touchGamepadEnable = 0;
 
+/** True if touch gamepad should be analog stick or false to use if 8 way dpad
+ *  @default
+ *  @memberof Settings */
+let touchGamepadAnalog = 1;
+
 /** Size of virutal gamepad for touch devices in pixels
  *  @default
  *  @memberof Settings */
@@ -748,7 +753,7 @@ let medalDisplayIconSize = 50;
 const engineName = 'LittleJS';
 
 /** Version of engine */
-const engineVersion = '1.2.0';
+const engineVersion = '1.2.3';
 
 /** Frames per second to update objects
  *  @default */
@@ -785,7 +790,7 @@ let averageFPS, drawCount;
 // css text used for elements created by engine
 const styleBody = 'margin:0;overflow:hidden;background:#000' +
     ';touch-action:none;user-select:none;-webkit-user-select:none;-moz-user-select:none';
-const styleCanvas = 'position:absolute';
+const styleCanvas = 'position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)';
 
 ///////////////////////////////////////////////////////////////////////////////
 
@@ -886,24 +891,13 @@ function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRender
             
             // fit to window by adding space on top or bottom if necessary
             const aspect = innerWidth / innerHeight;
-            const fixedAspect = canvasFixedSize.x / canvasFixedSize.y;
-
-            // clear css
-            mainCanvas.style.width  = overlayCanvas.style.width  = 
-            mainCanvas.style.height = overlayCanvas.style.height = 
-            mainCanvas.style.top    = overlayCanvas.style.top    = 
-            mainCanvas.style.left   = overlayCanvas.style.left   = '';
-
-            // letterbox center canvas
-            if (aspect < fixedAspect)
-            {
-                mainCanvas.style.width = overlayCanvas.style.width = innerWidth;
-                mainCanvas.style.top   = overlayCanvas.style.top = (innerHeight - innerWidth/fixedAspect)/2;
-            }
-            else
+            const fixedAspect = mainCanvas.width / mainCanvas.height;
+            mainCanvas.style.width  = overlayCanvas.style.width  = aspect < fixedAspect ? '100%' : '';
+            mainCanvas.style.height = overlayCanvas.style.height = aspect < fixedAspect ? '' : '100%';
+            if (glCanvas)
             {
-                mainCanvas.style.height = overlayCanvas.style.height = innerHeight;
-                mainCanvas.style.left   = overlayCanvas.style.left = (innerWidth - innerHeight*fixedAspect)/2;
+                glCanvas.style.width  = mainCanvas.style.width;
+                glCanvas.style.height = mainCanvas.style.height;
             }
         }
         else
@@ -911,18 +905,6 @@ function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRender
             // clear and set size to same as window
             mainCanvas.width  = min(innerWidth,  canvasMaxSize.x);
             mainCanvas.height = min(innerHeight, canvasMaxSize.y);
-
-            // center canvas
-            overlayCanvas.style.top  = mainCanvas.style.top  = (innerHeight - mainCanvas.height)/2;
-            overlayCanvas.style.left = mainCanvas.style.left = (innerWidth  - mainCanvas.width)/2;
-        }
-    
-        if (glEnable)
-        {
-            glCanvas.style.width  = mainCanvas.style.width;
-            glCanvas.style.height = mainCanvas.style.height;
-            glCanvas.style.top    = mainCanvas.style.top;
-            glCanvas.style.left   = mainCanvas.style.left;
         }
         
         // render sort then render while removing destroyed objects
@@ -1642,6 +1624,9 @@ function drawText(text, pos, size=1, color=new Color, lineWidth=0, lineColor=new
  * // draw text
  * font.drawTextScreen("LittleJS\nHello World!", vec2(200, 50));
  */
+
+let engineFontImage;
+
 class FontImage
 {
     /** Create an image font
@@ -1653,14 +1638,14 @@ class FontImage
      */
     constructor(image, tileSize=vec2(8), paddingSize=vec2(0,1), startTileIndex=0, context=overlayContext)
     {
-        if (!image)
+        if (!image && !engineFontImage)
         {
-            // use default font image
-            image = new Image();
-            image.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAAYAQAAAAA9+x6JAAAAAnRSTlMAAHaTzTgAAAGiSURBVHjaZZABhxxBEIUf6MCIBdFY+Q0PMNgf0yCgsSAaZcT9sgIPtBWwIA5wgAPEoHUyJeeSlW+gjK+fegWw1hPWNRcEyWh2npdpBmSUBrRaN1WSlQAWXaWLF0kkwR7C/N7XUvIaQr4xpeqeQigjLwBRZ/6KkufAACcv5z7GYhvgWHII8xN/4C2hvLCkmZSVgIJMHNTxpYOsJOiitEjUQnIQAFFP+opoQfCbjWmfzWiNzCjEvxAPFARmw/Y5Te0sl2zEp4M+m7cToJjdJS7y1xcFlFT7EtWBZ8nl7uLSff7UgYewtlyY6yHM4RrjNrnsfn/W0DBK9xNZctZ7gsTeXTe5eqLqXFlKnAn+vkNXzH6TqPW10ksKoSlauKk1TcncZLSTxNnQ8Av/8RGPXOFIuMCZ/fpwIZx5vU4QIRQ44HwUyHx/QrZhm5VtXFex7ja2se0KBpnPT0DSwS4xd86uAy+SqnLBgkPY5JolhJ33ENyK6n0VyRzCnzebIkFdY/NUtM66lTdhix1KUss6q5snH5ftVJXG0QITb1gUDvzD3z/BbyOLMirwCtPzAAAAAElFTkSuQmCC';
+            // load default font image
+            engineFontImage = new Image();
+            engineFontImage.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAAYAQAAAAA9+x6JAAAAAnRSTlMAAHaTzTgAAAGiSURBVHjaZZABhxxBEIUf6ECLBdFY+Q0PMNgf0yCgsSAGZcT9sgIPtBWwIA5wgAPEoHUyJeeSlW+gjK+fegWwtROWpVQEyWh2npdpBmTUFVhb29RINgLIukoXr5LIAvYQ5ve+1FqWEMqNKTX3FAJHyQDRZvmKWubAACcv5z5Gtg2oyCWE+Yk/8JZQX1jTTCpKAFGIgza+dJCNBF2UskRlsgwitHbSV0QLgt9sTPtsRlvJjEr8C/FARWA2bJ/TtJ7lko34dNDn6usJUMzuErP89UUBJbWeozrwLLncXczd508deAjLWipLO4Q5XGPcJvPu92cNDaN0P5G1FL0nSOzddZOrJ6rNhbXGmeDvO3TF7DeJWl4bvaYQTNHCTeuqKZmbjHaSOFes+IX/+IhHrnAkXOAsfn24EM68XieIECoccD4KZLk/odiwzeo2rovYdhvb2HYFgyznJyDpYJdYOmfXgVdJTaUi4xA2uWYNYec9BLeqdl9EsoTw582mSFDX2DxVLbNt9U3YYoeatBad1c2Tj8t2akrjaIGJNywKB/7h75/gN3vCMSaadIUTAAAAAElFTkSuQmCC';
         }
 
-        this.image = image;
+        this.image = image || engineFontImage;
         this.tileSize = tileSize;
         this.paddingSize = paddingSize;
         this.startTileIndex = startTileIndex;
@@ -2027,7 +2012,7 @@ if (isTouchDevice)
 // touch gamepad, virtual on screen gamepad emulator for touch devices
 
 // touch input internal variables
-let touchGamepadTimer = new Timer, touchGamepadButtons = [], touchGamepadStick = vec2(), touchGamepadAnalog = 1;
+let touchGamepadTimer = new Timer, touchGamepadButtons = [], touchGamepadStick = vec2();
 
 // create the touch gamepad, called automatically by the engine
 function touchGamepadCreate()
@@ -2074,7 +2059,7 @@ function touchGamepadCreate()
             {
                 // virtual analog stick
                 if (touchGamepadAnalog)
-                    touchGamepadStick = touchPos.subtract(stickCenter).clampLength(touchGamepadSize/2).scale(2/touchGamepadSize);
+                    touchGamepadStick = touchPos.subtract(stickCenter).scale(2/touchGamepadSize).clampLength();
                 else
                 {
                     // 8 way dpad
@@ -2115,12 +2100,28 @@ function touchGamepadRender()
     overlayContext.lineWidth = 3;
 
     // draw left analog stick
-    overlayContext.fillStyle = gamepadStick(0).length() > 0 ? '#fff' : '#000';
+    overlayContext.fillStyle = touchGamepadStick.lengthSquared() > 0 ? '#fff' : '#000';
     overlayContext.beginPath();
-    overlayContext.arc(touchGamepadSize, mainCanvasSize.y-touchGamepadSize, touchGamepadSize/2, 0,9);
-    overlayContext.fill();
-    overlayContext.stroke();
 
+    const leftCenter = vec2(touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
+    if (touchGamepadAnalog)
+    {
+        overlayContext.arc(leftCenter.x, leftCenter.y, touchGamepadSize/2, 0, 9);
+        overlayContext.fill();
+        overlayContext.stroke();
+    }
+    else // draw cross shaped gamepad
+    {
+        for(let i=10; i--;)
+        {
+            const angle = i*PI/4;
+            overlayContext.arc(leftCenter.x, leftCenter.y,touchGamepadSize*.6, angle + PI/8, angle + PI/8);
+            i%2 && overlayContext.arc(leftCenter.x, leftCenter.y, touchGamepadSize*.33, angle, angle);
+            i==1 && overlayContext.fill();
+        }
+        overlayContext.stroke();
+    }
+    
     // draw right face buttons
     const rightCenter = vec2(mainCanvasSize.x-touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
     for (let i=4; i--;)
@@ -2966,9 +2967,9 @@ class TileLayer extends EngineObject
  * let pos = vec2(2,3);
  * let particleEmiter = new ParticleEmitter
  * (
- *     pos, 1, 0, 500, PI,  // pos, emitSize, emitTime, emitRate, emiteCone
+ *     pos, 0, 1, 0, 500, PI,  // pos, angle, emitSize, emitTime, emitRate, emiteCone
  *     0, vec2(16),                            // tileIndex, tileSize
- *     new Color, new Color(0,0,0),            // colorStartA, colorStartB
+ *     new Color(1,1,1),   new Color(0,0,0),   // colorStartA, colorStartB
  *     new Color(1,1,1,0), new Color(0,0,0,0), // colorEndA, colorEndB
  *     2, .2, .2, .1, .05,  // particleTime, sizeStart, sizeEnd, particleSpeed, particleAngleSpeed
  *     .99, 1, 1, PI, .05,  // damping, angleDamping, gravityScale, particleCone, fadeRate, 
@@ -2979,6 +2980,7 @@ class ParticleEmitter extends EngineObject
 {
     /** Create a particle system with the given settings
      *  @param {Vector2} position           - World space position of the emitter
+     *  @param {Number}  [angle=0]          - Angle to rotate the object
      *  @param {Number}  [emitSize=0]       - World space size of the emitter (float for circle diameter, vec2 for rect)
      *  @param {Number}  [emitTime=0]       - How long to stay alive (0 is forever)
      *  @param {Number}  [emitRate=100]     - How many particles per second to spawn, does not emit if 0
@@ -3008,6 +3010,7 @@ class ParticleEmitter extends EngineObject
     constructor
     ( 
         pos,
+        angle,
         emitSize = 0,
         emitTime = 0,
         emitRate = 100,
@@ -3035,7 +3038,7 @@ class ParticleEmitter extends EngineObject
         renderOrder = additive ? 1e9 : 0
     )
     {
-        super(pos, new Vector2, tileIndex, tileSize, 0, undefined, renderOrder);
+        super(pos, new Vector2, tileIndex, tileSize, angle, undefined, renderOrder);
 
         // emitter settings
         /** @property {Number} - World space size of the emitter (float for circle diameter, vec2 for rect) */
@@ -3468,9 +3471,6 @@ class Newgrounds
      * @param {Number} value - The score value */
     postScore(id, value) { return this.call('ScoreBoard.postScore', {'id':id, 'value':value}, 1); }
 
-    /** Send message to log a view */
-    logView() { return this.call('App.logView', {'host':this.host}, 1); }
-
     /** Get scores from a scoreboard
      * @param {Number} id         - The scoreboard id
      * @param {String} [user=0]   - A user's id or name
@@ -3482,6 +3482,9 @@ class Newgrounds
     getScores(id, user=0, social=0, skip=0, limit=10)
     { return this.call('ScoreBoard.getScores', {'id':id, 'user':user, 'social':social, 'skip':skip, 'limit':limit}); }
 
+    /** Send message to log a view */
+    logView() { return this.call('App.logView', {'host':this.host}, 1); }
+
     /** Send a message to call a component of the Newgrounds API
      * @param {String}  component      - Name of the component
      * @param {Object}  [parameters=0] - Parameters to use for call
@@ -3578,24 +3581,24 @@ function glInit()
 
     // setup vertex and fragment shaders
     glShader = glCreateProgram(
-        'precision highp float;'+   // use highp for better accuracy, lowp for better perf
-        'uniform mat4 m;'+          // transform matrix
-        'attribute vec2 p,t;'+      // position, uv
-        'attribute vec4 c,a;'+      // color, additiveColor
-        'varying vec2 v;'+          // return uv
-        'varying vec4 d,e;'+        // return color, additiveColor
-        'void main(){'+             // shader entry point
-        'gl_Position=m*vec4(p,1,1);'+// transform position
-        'v=t;d=c;e=a;'+             // pass stuff to fragment shader
-        '}'                         // end of shader
+        'precision highp float;'+     // use highp for better accuracy, lowp for better perf
+        'uniform mat4 m;'+            // transform matrix
+        'attribute vec2 p,t;'+        // position, uv
+        'attribute vec4 c,a;'+        // color, additiveColor
+        'varying vec2 v;'+            // return uv
+        'varying vec4 d,e;'+          // return color, additiveColor
+        'void main(){'+               // shader entry point
+        'gl_Position=m*vec4(p,1,1);'+ // transform position
+        'v=t;d=c;e=a;'+               // pass stuff to fragment shader
+        '}'                           // end of shader
         ,
-        'precision highp float;'+            // use highp for better accuracy, lowp for better perf
-        'varying vec2 v;'+                   // uv
-        'varying vec4 d,e;'+                 // color, additiveColor
-        'uniform sampler2D j;'+              // texture
-        'void main(){'+                      // shader entry point
-        'gl_FragColor=texture2D(j,v)*d+e;'+  // modulate texture by color plus additive
-        '}'                                  // end of shader
+        'precision highp float;'+           // use highp for better accuracy, lowp for better perf
+        'varying vec2 v;'+                  // uv
+        'varying vec4 d,e;'+                // color, additiveColor
+        'uniform sampler2D s;'+             // texture
+        'void main(){'+                     // shader entry point
+        'gl_FragColor=texture2D(s,v)*d+e;'+ // modulate texture by color plus additive
+        '}'                                 // end of shader
     );
 
     // init buffers
@@ -3807,44 +3810,44 @@ function glDraw(x, y, sizeX, sizeY, angle, uv0X, uv0Y, uv1X, uv1Y, rgba=0xffffff
 
     // prepare to create the verts from size and angle
     const c = Math.cos(angle)/2, s = Math.sin(angle)/2;
-    const cX = c*sizeX, cY = c*sizeY, sX = s*sizeX, sY = s*sizeY;
+    const cx = c*sizeX, cy = c*sizeY, sx = s*sizeX, sy = s*sizeY;
         
     // setup 2 triangles to form a quad
     let offset = glBatchCount++ * gl_VERTICES_PER_QUAD * gl_INDICIES_PER_VERT;
 
     // vertex 0
-    glPositionData[offset++] = x - cX - sY;
-    glPositionData[offset++] = y - cY + sX;
+    glPositionData[offset++] = x - cx - sy;
+    glPositionData[offset++] = y - cy + sx;
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 1
-    glPositionData[offset++] = x + cX + sY;
-    glPositionData[offset++] = y + cY - sX;
+    glPositionData[offset++] = x + cx + sy;
+    glPositionData[offset++] = y + cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 2
-    glPositionData[offset++] = x - cX + sY;
-    glPositionData[offset++] = y + cY + sX;
+    glPositionData[offset++] = x - cx + sy;
+    glPositionData[offset++] = y + cy + sx;
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 0
-    glPositionData[offset++] = x - cX - sY;      
-    glPositionData[offset++] = y - cY + sX;  
+    glPositionData[offset++] = x - cx - sy;      
+    glPositionData[offset++] = y - cy + sx;  
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 
     // vertex 3
-    glPositionData[offset++] = x + cX - sY;
-    glPositionData[offset++] = y - cY - sX;
+    glPositionData[offset++] = x + cx - sy;
+    glPositionData[offset++] = y - cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 
     // vertex 1
-    glPositionData[offset++] = x + cX + sY;
-    glPositionData[offset++] = y + cY - sX;
+    glPositionData[offset++] = x + cx + sy;
+    glPositionData[offset++] = y + cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 }

package/engine/engine.js

@@ -22,7 +22,7 @@
 const engineName = 'LittleJS';
 
 /** Version of engine */
-const engineVersion = '1.2.0';
+const engineVersion = '1.2.3';
 
 /** Frames per second to update objects
  *  @default */
@@ -59,7 +59,7 @@ let averageFPS, drawCount;
 // css text used for elements created by engine
 const styleBody = 'margin:0;overflow:hidden;background:#000' +
     ';touch-action:none;user-select:none;-webkit-user-select:none;-moz-user-select:none';
-const styleCanvas = 'position:absolute';
+const styleCanvas = 'position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)';
 
 ///////////////////////////////////////////////////////////////////////////////
 
@@ -160,24 +160,13 @@ function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRender
             
             // fit to window by adding space on top or bottom if necessary
             const aspect = innerWidth / innerHeight;
-            const fixedAspect = canvasFixedSize.x / canvasFixedSize.y;
-
-            // clear css
-            mainCanvas.style.width  = overlayCanvas.style.width  = 
-            mainCanvas.style.height = overlayCanvas.style.height = 
-            mainCanvas.style.top    = overlayCanvas.style.top    = 
-            mainCanvas.style.left   = overlayCanvas.style.left   = '';
-
-            // letterbox center canvas
-            if (aspect < fixedAspect)
-            {
-                mainCanvas.style.width = overlayCanvas.style.width = innerWidth;
-                mainCanvas.style.top   = overlayCanvas.style.top = (innerHeight - innerWidth/fixedAspect)/2;
-            }
-            else
+            const fixedAspect = mainCanvas.width / mainCanvas.height;
+            mainCanvas.style.width  = overlayCanvas.style.width  = aspect < fixedAspect ? '100%' : '';
+            mainCanvas.style.height = overlayCanvas.style.height = aspect < fixedAspect ? '' : '100%';
+            if (glCanvas)
             {
-                mainCanvas.style.height = overlayCanvas.style.height = innerHeight;
-                mainCanvas.style.left   = overlayCanvas.style.left = (innerWidth - innerHeight*fixedAspect)/2;
+                glCanvas.style.width  = mainCanvas.style.width;
+                glCanvas.style.height = mainCanvas.style.height;
             }
         }
         else
@@ -185,18 +174,6 @@ function engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRender
             // clear and set size to same as window
             mainCanvas.width  = min(innerWidth,  canvasMaxSize.x);
             mainCanvas.height = min(innerHeight, canvasMaxSize.y);
-
-            // center canvas
-            overlayCanvas.style.top  = mainCanvas.style.top  = (innerHeight - mainCanvas.height)/2;
-            overlayCanvas.style.left = mainCanvas.style.left = (innerWidth  - mainCanvas.width)/2;
-        }
-    
-        if (glEnable)
-        {
-            glCanvas.style.width  = mainCanvas.style.width;
-            glCanvas.style.height = mainCanvas.style.height;
-            glCanvas.style.top    = mainCanvas.style.top;
-            glCanvas.style.left   = mainCanvas.style.left;
         }
         
         // render sort then render while removing destroyed objects

package/engine/engineDebug.js

@@ -160,7 +160,7 @@ const debugUpdate = ()=>
 {
     if (!debug)
         return;
-        
+
     if (keyWasPressed(192)) // ~
         debugOverlay = !debugOverlay;
     if (debugOverlay)

package/engine/engineDraw.js

@@ -254,6 +254,9 @@ function drawText(text, pos, size=1, color=new Color, lineWidth=0, lineColor=new
  * // draw text
  * font.drawTextScreen("LittleJS\nHello World!", vec2(200, 50));
  */
+
+let engineFontImage;
+
 class FontImage
 {
     /** Create an image font
@@ -265,14 +268,14 @@ class FontImage
      */
     constructor(image, tileSize=vec2(8), paddingSize=vec2(0,1), startTileIndex=0, context=overlayContext)
     {
-        if (!image)
+        if (!image && !engineFontImage)
         {
-            // use default font image
-            image = new Image();
-            image.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAAYAQAAAAA9+x6JAAAAAnRSTlMAAHaTzTgAAAGiSURBVHjaZZABhxxBEIUf6MCIBdFY+Q0PMNgf0yCgsSAaZcT9sgIPtBWwIA5wgAPEoHUyJeeSlW+gjK+fegWw1hPWNRcEyWh2npdpBmSUBrRaN1WSlQAWXaWLF0kkwR7C/N7XUvIaQr4xpeqeQigjLwBRZ/6KkufAACcv5z7GYhvgWHII8xN/4C2hvLCkmZSVgIJMHNTxpYOsJOiitEjUQnIQAFFP+opoQfCbjWmfzWiNzCjEvxAPFARmw/Y5Te0sl2zEp4M+m7cToJjdJS7y1xcFlFT7EtWBZ8nl7uLSff7UgYewtlyY6yHM4RrjNrnsfn/W0DBK9xNZctZ7gsTeXTe5eqLqXFlKnAn+vkNXzH6TqPW10ksKoSlauKk1TcncZLSTxNnQ8Av/8RGPXOFIuMCZ/fpwIZx5vU4QIRQ44HwUyHx/QrZhm5VtXFex7ja2se0KBpnPT0DSwS4xd86uAy+SqnLBgkPY5JolhJ33ENyK6n0VyRzCnzebIkFdY/NUtM66lTdhix1KUss6q5snH5ftVJXG0QITb1gUDvzD3z/BbyOLMirwCtPzAAAAAElFTkSuQmCC';
+            // load default font image
+            engineFontImage = new Image();
+            engineFontImage.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAAYAQAAAAA9+x6JAAAAAnRSTlMAAHaTzTgAAAGiSURBVHjaZZABhxxBEIUf6ECLBdFY+Q0PMNgf0yCgsSAGZcT9sgIPtBWwIA5wgAPEoHUyJeeSlW+gjK+fegWwtROWpVQEyWh2npdpBmTUFVhb29RINgLIukoXr5LIAvYQ5ve+1FqWEMqNKTX3FAJHyQDRZvmKWubAACcv5z5Gtg2oyCWE+Yk/8JZQX1jTTCpKAFGIgza+dJCNBF2UskRlsgwitHbSV0QLgt9sTPtsRlvJjEr8C/FARWA2bJ/TtJ7lko34dNDn6usJUMzuErP89UUBJbWeozrwLLncXczd508deAjLWipLO4Q5XGPcJvPu92cNDaN0P5G1FL0nSOzddZOrJ6rNhbXGmeDvO3TF7DeJWl4bvaYQTNHCTeuqKZmbjHaSOFes+IX/+IhHrnAkXOAsfn24EM68XieIECoccD4KZLk/odiwzeo2rovYdhvb2HYFgyznJyDpYJdYOmfXgVdJTaUi4xA2uWYNYec9BLeqdl9EsoTw582mSFDX2DxVLbNt9U3YYoeatBad1c2Tj8t2akrjaIGJNywKB/7h75/gN3vCMSaadIUTAAAAAElFTkSuQmCC';
         }
 
-        this.image = image;
+        this.image = image || engineFontImage;
         this.tileSize = tileSize;
         this.paddingSize = paddingSize;
         this.startTileIndex = startTileIndex;

package/engine/engineInput.js

@@ -281,7 +281,7 @@ if (isTouchDevice)
 // touch gamepad, virtual on screen gamepad emulator for touch devices
 
 // touch input internal variables
-let touchGamepadTimer = new Timer, touchGamepadButtons = [], touchGamepadStick = vec2(), touchGamepadAnalog = 1;
+let touchGamepadTimer = new Timer, touchGamepadButtons = [], touchGamepadStick = vec2();
 
 // create the touch gamepad, called automatically by the engine
 function touchGamepadCreate()
@@ -328,7 +328,7 @@ function touchGamepadCreate()
             {
                 // virtual analog stick
                 if (touchGamepadAnalog)
-                    touchGamepadStick = touchPos.subtract(stickCenter).clampLength(touchGamepadSize/2).scale(2/touchGamepadSize);
+                    touchGamepadStick = touchPos.subtract(stickCenter).scale(2/touchGamepadSize).clampLength();
                 else
                 {
                     // 8 way dpad
@@ -369,12 +369,28 @@ function touchGamepadRender()
     overlayContext.lineWidth = 3;
 
     // draw left analog stick
-    overlayContext.fillStyle = gamepadStick(0).length() > 0 ? '#fff' : '#000';
+    overlayContext.fillStyle = touchGamepadStick.lengthSquared() > 0 ? '#fff' : '#000';
     overlayContext.beginPath();
-    overlayContext.arc(touchGamepadSize, mainCanvasSize.y-touchGamepadSize, touchGamepadSize/2, 0,9);
-    overlayContext.fill();
-    overlayContext.stroke();
 
+    const leftCenter = vec2(touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
+    if (touchGamepadAnalog)
+    {
+        overlayContext.arc(leftCenter.x, leftCenter.y, touchGamepadSize/2, 0, 9);
+        overlayContext.fill();
+        overlayContext.stroke();
+    }
+    else // draw cross shaped gamepad
+    {
+        for(let i=10; i--;)
+        {
+            const angle = i*PI/4;
+            overlayContext.arc(leftCenter.x, leftCenter.y,touchGamepadSize*.6, angle + PI/8, angle + PI/8);
+            i%2 && overlayContext.arc(leftCenter.x, leftCenter.y, touchGamepadSize*.33, angle, angle);
+            i==1 && overlayContext.fill();
+        }
+        overlayContext.stroke();
+    }
+    
     // draw right face buttons
     const rightCenter = vec2(mainCanvasSize.x-touchGamepadSize, mainCanvasSize.y-touchGamepadSize);
     for (let i=4; i--;)

package/engine/engineMedals.js

@@ -235,9 +235,6 @@ class Newgrounds
      * @param {Number} value - The score value */
     postScore(id, value) { return this.call('ScoreBoard.postScore', {'id':id, 'value':value}, 1); }
 
-    /** Send message to log a view */
-    logView() { return this.call('App.logView', {'host':this.host}, 1); }
-
     /** Get scores from a scoreboard
      * @param {Number} id         - The scoreboard id
      * @param {String} [user=0]   - A user's id or name
@@ -249,6 +246,9 @@ class Newgrounds
     getScores(id, user=0, social=0, skip=0, limit=10)
     { return this.call('ScoreBoard.getScores', {'id':id, 'user':user, 'social':social, 'skip':skip, 'limit':limit}); }
 
+    /** Send message to log a view */
+    logView() { return this.call('App.logView', {'host':this.host}, 1); }
+
     /** Send a message to call a component of the Newgrounds API
      * @param {String}  component      - Name of the component
      * @param {Object}  [parameters=0] - Parameters to use for call

package/engine/engineParticles.js

@@ -15,9 +15,9 @@
  * let pos = vec2(2,3);
  * let particleEmiter = new ParticleEmitter
  * (
- *     pos, 1, 0, 500, PI,  // pos, emitSize, emitTime, emitRate, emiteCone
+ *     pos, 0, 1, 0, 500, PI,  // pos, angle, emitSize, emitTime, emitRate, emiteCone
  *     0, vec2(16),                            // tileIndex, tileSize
- *     new Color, new Color(0,0,0),            // colorStartA, colorStartB
+ *     new Color(1,1,1),   new Color(0,0,0),   // colorStartA, colorStartB
  *     new Color(1,1,1,0), new Color(0,0,0,0), // colorEndA, colorEndB
  *     2, .2, .2, .1, .05,  // particleTime, sizeStart, sizeEnd, particleSpeed, particleAngleSpeed
  *     .99, 1, 1, PI, .05,  // damping, angleDamping, gravityScale, particleCone, fadeRate, 
@@ -28,6 +28,7 @@ class ParticleEmitter extends EngineObject
 {
     /** Create a particle system with the given settings
      *  @param {Vector2} position           - World space position of the emitter
+     *  @param {Number}  [angle=0]          - Angle to rotate the object
      *  @param {Number}  [emitSize=0]       - World space size of the emitter (float for circle diameter, vec2 for rect)
      *  @param {Number}  [emitTime=0]       - How long to stay alive (0 is forever)
      *  @param {Number}  [emitRate=100]     - How many particles per second to spawn, does not emit if 0
@@ -57,6 +58,7 @@ class ParticleEmitter extends EngineObject
     constructor
     ( 
         pos,
+        angle,
         emitSize = 0,
         emitTime = 0,
         emitRate = 100,
@@ -84,7 +86,7 @@ class ParticleEmitter extends EngineObject
         renderOrder = additive ? 1e9 : 0
     )
     {
-        super(pos, new Vector2, tileIndex, tileSize, 0, undefined, renderOrder);
+        super(pos, new Vector2, tileIndex, tileSize, angle, undefined, renderOrder);
 
         // emitter settings
         /** @property {Number} - World space size of the emitter (float for circle diameter, vec2 for rect) */

package/engine/engineSettings.js

@@ -145,6 +145,11 @@ let inputWASDEmulateDirection = 1;
  *  @memberof Settings */
 let touchGamepadEnable = 0;
 
+/** True if touch gamepad should be analog stick or false to use if 8 way dpad
+ *  @default
+ *  @memberof Settings */
+let touchGamepadAnalog = 1;
+
 /** Size of virutal gamepad for touch devices in pixels
  *  @default
  *  @memberof Settings */

package/engine/engineWebGL.js

@@ -47,24 +47,24 @@ function glInit()
 
     // setup vertex and fragment shaders
     glShader = glCreateProgram(
-        'precision highp float;'+   // use highp for better accuracy, lowp for better perf
-        'uniform mat4 m;'+          // transform matrix
-        'attribute vec2 p,t;'+      // position, uv
-        'attribute vec4 c,a;'+      // color, additiveColor
-        'varying vec2 v;'+          // return uv
-        'varying vec4 d,e;'+        // return color, additiveColor
-        'void main(){'+             // shader entry point
-        'gl_Position=m*vec4(p,1,1);'+// transform position
-        'v=t;d=c;e=a;'+             // pass stuff to fragment shader
-        '}'                         // end of shader
+        'precision highp float;'+     // use highp for better accuracy, lowp for better perf
+        'uniform mat4 m;'+            // transform matrix
+        'attribute vec2 p,t;'+        // position, uv
+        'attribute vec4 c,a;'+        // color, additiveColor
+        'varying vec2 v;'+            // return uv
+        'varying vec4 d,e;'+          // return color, additiveColor
+        'void main(){'+               // shader entry point
+        'gl_Position=m*vec4(p,1,1);'+ // transform position
+        'v=t;d=c;e=a;'+               // pass stuff to fragment shader
+        '}'                           // end of shader
         ,
-        'precision highp float;'+            // use highp for better accuracy, lowp for better perf
-        'varying vec2 v;'+                   // uv
-        'varying vec4 d,e;'+                 // color, additiveColor
-        'uniform sampler2D j;'+              // texture
-        'void main(){'+                      // shader entry point
-        'gl_FragColor=texture2D(j,v)*d+e;'+  // modulate texture by color plus additive
-        '}'                                  // end of shader
+        'precision highp float;'+           // use highp for better accuracy, lowp for better perf
+        'varying vec2 v;'+                  // uv
+        'varying vec4 d,e;'+                // color, additiveColor
+        'uniform sampler2D s;'+             // texture
+        'void main(){'+                     // shader entry point
+        'gl_FragColor=texture2D(s,v)*d+e;'+ // modulate texture by color plus additive
+        '}'                                 // end of shader
     );
 
     // init buffers
@@ -276,44 +276,44 @@ function glDraw(x, y, sizeX, sizeY, angle, uv0X, uv0Y, uv1X, uv1Y, rgba=0xffffff
 
     // prepare to create the verts from size and angle
     const c = Math.cos(angle)/2, s = Math.sin(angle)/2;
-    const cX = c*sizeX, cY = c*sizeY, sX = s*sizeX, sY = s*sizeY;
+    const cx = c*sizeX, cy = c*sizeY, sx = s*sizeX, sy = s*sizeY;
         
     // setup 2 triangles to form a quad
     let offset = glBatchCount++ * gl_VERTICES_PER_QUAD * gl_INDICIES_PER_VERT;
 
     // vertex 0
-    glPositionData[offset++] = x - cX - sY;
-    glPositionData[offset++] = y - cY + sX;
+    glPositionData[offset++] = x - cx - sy;
+    glPositionData[offset++] = y - cy + sx;
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 1
-    glPositionData[offset++] = x + cX + sY;
-    glPositionData[offset++] = y + cY - sX;
+    glPositionData[offset++] = x + cx + sy;
+    glPositionData[offset++] = y + cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 2
-    glPositionData[offset++] = x - cX + sY;
-    glPositionData[offset++] = y + cY + sX;
+    glPositionData[offset++] = x - cx + sy;
+    glPositionData[offset++] = y + cy + sx;
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
     
     // vertex 0
-    glPositionData[offset++] = x - cX - sY;      
-    glPositionData[offset++] = y - cY + sX;  
+    glPositionData[offset++] = x - cx - sy;      
+    glPositionData[offset++] = y - cy + sx;  
     glPositionData[offset++] = uv0X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 
     // vertex 3
-    glPositionData[offset++] = x + cX - sY;
-    glPositionData[offset++] = y - cY - sX;
+    glPositionData[offset++] = x + cx - sy;
+    glPositionData[offset++] = y - cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv1Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 
     // vertex 1
-    glPositionData[offset++] = x + cX + sY;
-    glPositionData[offset++] = y + cY - sX;
+    glPositionData[offset++] = x + cx + sy;
+    glPositionData[offset++] = y + cy - sx;
     glPositionData[offset++] = uv1X; glPositionData[offset++] = uv0Y;
     glColorData[offset++]    = rgba; glColorData[offset++]    = rgbaAdditive;
 }