Getting Started docs are outdated/broken

I installed Excalibur v0.24.5 and started going through the getting started tutorial.

Issue # 1 (lastWorldPos does not exist)

In this code, evt.target.lastWorldPos does not exist in the current version:

// Add a mouse move listener
game.input.pointers.primary.on('move', function (evt) {
  paddle.pos.x = evt.target.lastWorldPos.x
})

I replaced it with paddle.pos.x = evt.pos.x and it seems to work.

Issue # 2 (confusing docs)

There are a few code blocks for the ball Actor. In the first code block it provides collision detection and custom drawing, then immediately after in the docs says how this code can be improved by using the already provided collision detection and custom drawing.

The collision detection and drawing code blocks aren’t needed since they are already provided. However, it might be helpful to break up that big code block for the ball Actor into smaller chunks, and move the comments out of the code and have it be documentation instead.

Issue # 3 (collision not working with provided code)

Just following the tutorial along as I go, this is the code I have so far. There is a paddle and a ball but the ball is not colliding with the paddle.

import * as ex from "excalibur";


const game = new ex.Engine({
    width: 800,
    height: 600
});

// Create an actor with x position of 150px,
// y position of 40px from the bottom of the screen,
// width of 200px, height and a height of 20px
const paddle = new ex.Actor({
    x: 150,
    y: game.drawHeight - 40,
    width: 200,
    height: 20
});

// Let's give it some color with one of the predefined
// color constants
paddle.color = ex.Color.Chartreuse;

// Make sure the paddle can partipate in collisions, by default excalibur actors do not collide
paddle.body.collider.type = ex.CollisionType.Fixed;

// `game.add` is the same as calling
// `game.currentScene.add`
game.add(paddle);

game.input.pointers.primary.on('move', function (evt) {
    paddle.pos.x = evt.pos.x;
})

// Create a ball
const ball = new ex.Actor(100, 300, 20, 20);

// Set the color
ball.color = ex.Color.Red;

// Set the velocity in pixels per second
ball.vel.setTo(100, 100);

// Set the collision Type to passive
// This means "tell me when I collide with an emitted event, but don't let excalibur do anything automatically"
ball.body.collider.type = ex.CollisionType.Passive;
// Other possible collision types:
// "ex.CollisionType.PreventCollision - this means do not participate in any collision notification at all"
// "ex.CollisionType.Active - this means participate and let excalibur resolve the positions/velocities of actors after collision"
// "ex.CollisionType.Fixed - this means participate, but this object is unmovable"

// Wire up to the postupdate event
ball.on("postupdate", () => {
    // If the ball collides with the left side
    // of the screen reverse the x velocity
    if (ball.pos.x < ball.width / 2) {
        ball.vel.x *= -1;
    }

    // If the ball collides with the right side
    // of the screen reverse the x velocity
    if (ball.pos.x + ball.width / 2 > game.drawWidth) {
        ball.vel.x *= -1;
    }

    // If the ball collides with the top
    // of the screen reverse the y velocity
    if (ball.pos.y < ball.height / 2) {
        ball.vel.y *= -1;
    }
});

// Draw is passed a rendering context and a delta in milliseconds since the last frame
ball.draw = (ctx, delta) => {
    // Optionally call original 'base' method
    // ex.Actor.prototype.draw.call(this, ctx, delta)

    // Custom draw code
    ctx.fillStyle = ball.color.toString();
    ctx.beginPath();
    ctx.arc(ball.pos.x, ball.pos.y, 10, 0, Math.PI * 2);
    ctx.closePath();
    ctx.fill();
};

// Add the ball to the current scene
game.add(ball);

ball.on('exitviewport', function () {
    alert('You lose!')
})

game.start();

[zskamljic]

1. is still not fixed, I’ve tried using the suggested fix, but there’s an error at runtime: Uncaught TypeError: Cannot read property 'x' of undefined trying to log evt.target results in: , implying that a wrong type is used in event.

[eonarheim]

@Kangaroux @gideongrinberg @zskamljic new getting started page is live, it’s now tied directly to the sample with snippet comments!

Let me know if you have additional feedback https://excaliburjs.com/docs/getting-started