# Worlds and grid coordinates

Use `front` or `side`. Do not use `iso` or `depth` (in development).

| View | Look |
| --- | --- |
| `front` | Flat top-down squares |
| `side` | Side-scroller with platforms |

## Placement

```js
const scene = GameLib.defineWorld({
  columns: 12, rows: 12,
  objects: [
    {sprite: 'tree', x: 2, y: 3, solid: true},
    {sprite: 'stone', x: 4, y: 4, solid: true},
  ],
})
GameLib.drawWorld(g, scene, {time: world.time, objects: [{sprite: 'hero', x: 3, y: 3, pose: 'idle'}]})
```

- Cell `(0, 0)` is top-left. `x, y` is the object's feet, not its top-left. Anchors are handled per asset.
- Static objects use integers; moving objects may use fractions. Rounding happens only when drawing.
- One cell is 16x16 px. Assets are never scaled; for something bigger, use a bigger asset.
- Screen position: `x = origin.x + x * 16`, `y = origin.y + y * 16 - z * 16`.

## Grid movement

```js
const next = GameLib.moveOnGrid(scene, state, input.vector(), dt, {speed: 4})
return {...state, ...next}
```

Keep `target` in state. Use `snapToGrid` only for instant rounding.

## Side view

```js
const scene = GameLib.defineWorld({view: 'side', columns: 40, rows: 16, floor: false})
const game = {view: 'side', /* ... */}
```

- Set `game.view` and `scene.view` to the same value.
- The floor is off by default. Build the ground from platforms.
- The hero faces left or right.
- Use `movePlatformer`, `drawPlatforms` and `followCamera`. See [mechanics](/docs/mechanics.md).
- Side assets: `side-hero-*`, `side-tile`, `side-wall`, `side-<prop>`. Items, creatures and symbols are shared.

## Draw order

`drawWorld` draws floor, static objects, then the given objects. Lower `layer` is drawn first. In `front`, smaller `y` is drawn first, so nearer objects cover farther ones. In `side`, objects are drawn in the given order.