fix: visual tests

sandbox/tests/collision/touching.ts

@@ -4,15 +4,13 @@ var game = new ex.Engine({
   height: 200,
   width: 800
 });
-var paddle = new ex.Actor({x: 150, y: game.drawHeight - 40, width: 200, height: 20});
-paddle.color = ex.Color.Chartreuse;
+var paddle = new ex.Actor({x: 150, y: game.drawHeight - 40, width: 200, height: 20, color: ex.Color.Chartreuse});
 paddle.body.collisionType = ex.CollisionType.Fixed;
 game.add(paddle);
 
 var speed = 300;
 
-var ball = new ex.Actor({x: 150, y: 50, width: 20, height: 20});
-ball.color = ex.Color.Red;
+var ball = new ex.Actor({x: 150, y: 50, radius: 10, color: ex.Color.Red});
 ball.vel.setTo(0, speed);
 ball.body.collisionType = ex.CollisionType.Active;
 ball.on('collisionstart', (evt: ex.CollisionStartEvent) => {
@@ -28,12 +26,5 @@ ball.on('postupdate', function() {
     ball.vel = ex.vec(0, speed);
   }
 });
-ball.draw = function(ctx, delta) {
-  ctx.fillStyle = this.color.toString();
-  ctx.beginPath();
-  ctx.arc(this.pos.x, this.pos.y, 10, 0, Math.PI * 2);
-  ctx.closePath();
-  ctx.fill();
-};
 game.add(ball);
 game.start();

sandbox/tests/group/group.ts

@@ -29,25 +29,25 @@ for (var i = 0; i < numActors; i++) {
 
   actor.body.collisionType = ex.CollisionType.Active;
   actor.body.group = blockGroup;
-  actor.on('postupdate', function(e: ex.PostUpdateEvent) {
-    if (this.pos.x < 0) {
-      this.vel.x = Math.abs(this.vel.x);
+  actor.on('postupdate', (e: ex.PostUpdateEvent) => {
+    if (actor.pos.x < 0) {
+      actor.vel.x = Math.abs(actor.vel.x);
     }
 
-    if (this.pos.y < 0) {
-      this.vel.y = Math.abs(this.vel.y);
+    if (actor.pos.y < 0) {
+      actor.vel.y = Math.abs(actor.vel.y);
     }
 
-    if (this.pos.x > width) {
-      this.vel.x = -1 * Math.abs(this.vel.x);
+    if (actor.pos.x > width) {
+      actor.vel.x = -1 * Math.abs(actor.vel.x);
     }
 
-    if (this.pos.y > height) {
-      this.vel.y = -1 * Math.abs(this.vel.y);
+    if (actor.pos.y > height) {
+      actor.vel.y = -1 * Math.abs(actor.vel.y);
     }
   });
 
-  actor.on('postcollision', function(e: ex.PostCollisionEvent) {
+  actor.on('postcollision', (e: ex.PostCollisionEvent) => {
     if (e.actor.currentDrawing instanceof ex.Sprite && e.other === player) {
       // TODO not supported in the current world order
       // e.actor.currentDrawing.colorize(ex.Color.Cyan);

sandbox/tests/trigger/trigger.ts

@@ -5,8 +5,8 @@ var game = new ex.Engine({
   height: 400
 });
 
-engine.debug.collider.showGeometry = true;
-engine.debug.collider.showBounds = true;
+game.debug.collider.showGeometry = true;
+game.debug.collider.showBounds = true;
 
 game.showDebug(true);
 

sandbox/tests/within/within.ts

@@ -108,24 +108,21 @@ blocks.forEach((b) => {
       b.color = ex.Color.Green;
     }
   };
-  b.onPostDraw = (ctx, delta) => {
+  b.graphics.onPostDraw = (ctx, delta) => {
     const closestPolygon = b.collider.get().getClosestLineBetween(floor.collider.get());
     const closestCircle = b.collider.get().getClosestLineBetween(circle.collider.get());
     const closestEdge = b.collider.get().getClosestLineBetween(edge.collider.get());
     ctx.restore();
     ctx.save();
-    ctx.fillStyle = ex.Color.Red.toString();
 
-    ctx.fillText('Closest polygon line length:' + closestPolygon.getLength(), b.pos.x + 20, b.pos.y + 50);
-    ex.Util.DrawUtil.line(ctx, ex.Color.Red, closestPolygon.begin.x, closestPolygon.begin.y, closestPolygon.end.x, closestPolygon.end.y, 3);
+    ctx.debug.drawText('Closest polygon line length:' + closestPolygon.getLength(), b.pos.add(ex.vec(20, 50)));
+    ctx.drawLine(closestPolygon.begin, closestPolygon.end, ex.Color.Red, 3);
 
-    ctx.fillStyle = ex.Color.Green.toString();
-    ctx.fillText('Closest circle line length:' + closestCircle.getLength(), b.pos.x + 20, b.pos.y + 65);
-    ex.Util.DrawUtil.line(ctx, ex.Color.Green, closestCircle.begin.x, closestCircle.begin.y, closestCircle.end.x, closestCircle.end.y, 3);
+    ctx.debug.drawText('Closest circle line length:' + closestCircle.getLength(), b.pos.add(ex.vec(20, 65)));
+    ctx.drawLine(closestCircle.begin, closestCircle.end, ex.Color.Green, 3);
 
-    ctx.fillStyle = ex.Color.Blue.toString();
-    ctx.fillText('Closest edge line length:' + closestEdge.getLength(), b.pos.x + 20, b.pos.y + 80);
-    ex.Util.DrawUtil.line(ctx, ex.Color.Blue, closestEdge.begin.x, closestEdge.begin.y, closestEdge.end.x, closestEdge.end.y, 3);
+    ctx.debug.drawText('Closest edge line length:' + closestEdge.getLength(), b.pos.add(ex.vec(20, 80)));
+    ctx.drawLine(closestEdge.begin, closestEdge.end, ex.Color.Blue, 3);
   };
 });
 if (block.within(floor, 200)) {