Tutorials · Navigation and AI · Chapter 12

The watch, finished

A key and a way out

1. Select key, on the store room’s table. Under Groups, type key into Add group and press Enter.
2. Click Add component and choose AreaComponent. In its Shape, set Size to 12 and 12, clicking each box once, typing and pressing Enter. Every other field stays as it comes, as the pots’ Area did in chapter 6.
3. In Assets, press Create, choose New script, type key, and press Enter. In the Code tab, replace everything in key.rgs with the script below, and press Ctrl+S.
4. Select key, click Add component and choose Key. It has no fields.

/// The key on the store room's table. The thief takes it as she passes it;
/// caught, she loses it, and it is back on the table.
component Key : Area {
    fn on_enter(other: NodeId) {
        if in_group(other, "thief") {
            keep_number("key", 1.0);
            emit_to("word", "taken");
            hide();
        }
    }

    fn on_signal() {
        if heard("dropped") {
            show();
        }
    }
}

The key’s Area Shape Size

The box the key notices her with, in world units, about its middle: 12 by 12, the key’s picture and a little over, so she takes it by walking onto the table, not by brushing the wall beside it. A new Area’s is 64 by 64, which would reach across half the store room.

keep_number

Keeps a number under a name until the game closes, for any script to read with kept_number. keep_number("key", 1.0) says she has the key; 0 says she has not. It lands at the end of the step, as keep_point does, so the other scripts read it from the next step on.

kept_number

Reads a kept number as it was when the step began, or the default given if nothing was ever kept under that name. kept_number("key", 0.0) > 0.5 is the scripts’ way of asking whether she has the key: before she first takes it nothing is kept, and the default, 0, says no.

hide

Makes this node invisible, at once. An invisible Area overlaps nothing, so a hidden key cannot be taken again: she can stand on the empty table and nothing happens.

show

Makes this node visible again, and its Area notices her again. The key shows itself when it hears dropped.

taken and dropped

Two more signals. The key sends taken to the group word, the words across the top, when she takes it. Her own script sends dropped to the group key, and to the group word, when she is caught with it. Each is heard on the step after it is sent.

1. Select keep, press + Add node and choose Node. Rename it way_out.
2. Set its Position: click its x box once, type 600 and press Enter; then its y box, 312, the same way. That is her start.
3. Click Add component and choose AreaComponent. In its Shape, set Size to 32 and 32. Every other field stays as it comes.
4. In Assets, press Create, choose New script, type way_out, and press Enter. In the Code tab, replace everything in way_out.rgs with the script below, and press Ctrl+S.
5. Select way_out, click Add component and choose WayOut.

/// Where the thief came in. Back here with the key, she is away.
component WayOut : Area {
    fn on_enter(other: NodeId) {
        if in_group(other, "thief") && kept_number("key", 0.0) > 0.5 {
            emit_to("word", "away");
        }
    }
}

The way out’s Area Shape Size

32 by 32: two tiles square about the gate. Coming into the courtyard is not enough; she has to come back to the gate itself.

away

The signal the way out sends to the words when she steps onto it with the key. Without the key it sends nothing, and she can walk through the gate as often as she likes.

1. Click the Code tab, then thief.rgs in its Scripts list. Replace everything in it with the script below, and press Ctrl+S.
2. Select thief. Her Thief now shows Chances 3 and Caught 0, greyed, as the script declares them: nothing to type.
3. Press Ctrl+S.

/// The thief. Caught by a guard, she is put back where she came in, and the
/// key, if she had it, is back on its table. Caught too often, the watch has
/// won.
component Thief {
    /// Where she starts again when she is caught.
    #[hidden]
    start: Vec2,
    /// How many times she may be caught before the watch wins.
    chances: i32 = 3,
    /// How many times she has been caught.
    #[readonly]
    caught: i32 = 0,

    fn on_create() {
        start = position();
    }

    fn on_signal() {
        if heard("caught") {
            caught += 1;
            move_to(start);
            if kept_number("key", 0.0) > 0.5 {
                keep_number("key", 0.0);
                emit_to("key", "dropped");
                emit_to("word", "dropped");
            }
            if caught >= chances {
                emit_to("word", "lost");
            }
        }
    }
}

Chances

The Thief’s Chances: how many times she may be caught before the watch wins. 3, as the script gives it. 1 makes every catch the end of the night.

Caught

The Thief’s Caught, read-only: how many times a guard has caught her this game, counted by her script, live in the Inspector in Play.

lost

The signal her script sends to the words on the catch that uses up her last chance.

Words across the top

1. Select keep, press + Add node and choose Canvas. Rename it hud.
2. In its Canvas, set Scale Mode to ShrinkToFit. Reference Size stays 1280, 720, Space stays Screen and Use Safe Area stays ticked, as a new Canvas has them.

The Canvas’s Reference Size

The canvas’s own size in UI units: the window the words were laid out for. The keep’s window is 1280 by 720, as a new Canvas has it, so it stays. Every offset under the canvas is in these units.

The Canvas’s Scale Mode

How the canvas fits a window of another size. ShrinkToFit scales it to the largest 16 by 9 field that fits inside the window, so the words are never cut off however the window is shaped. A new Canvas has ScaleWithHeight.

The Canvas’s Space and Use Safe Area

Screen draws the canvas over the camera’s picture, as a HUD is. Use Safe Area keeps it inside the part of a phone’s screen nothing covers; both stay as they come.

1. Select hud, press + Add node and choose Label. Rename it word: it goes under hud.
2. Under Groups, type word into Add group and press Enter: it is the group the three scripts tell.
3. In its Rect, set Anchor Min and Anchor Max both to 0.5, 0, Offset Min to -480, 24, Offset Max to 480, 64, and Pivot to 0.5, 0, clicking each box once, typing and pressing Enter.
4. In its Text, select everything in Text and type Take the key from the store room, and get out the way you came in. Scale stays 2, as it comes. Set Align to Center.
5. Click Color. If the button at the top left of the picker that opens reads U8, press it so that it reads F: each channel then runs from 0 to 1. Set it to 0.8388, 0.7682, 0.6172, alpha 1, a pale beige.
6. Click Outline and set it the same way to 0.0497, 0.0194, 0.0307, alpha 1, a dark plum, and set Outline Width to 2.

Anchor Min, Anchor Max

The Rect’s two points of the canvas it is held to, as fractions of its width and height: 0, 0 is the top left corner, 1, 1 the bottom right. Both at 0.5, 0, the words are held to the middle of the top edge, whatever the window’s width.

Offset Min, Offset Max

The Rect’s top left and bottom right corners, in UI units from the anchors. -480, 24 and 480, 64 make a box 960 wide and 40 high, centred, 24 below the top.

Pivot

The point of the Rect, as fractions of its own size, that counts as its position. 0.5, 0 names the middle of its top edge, the point it is held by. It does not place the box: the anchors and offsets do.

Text

The Label’s words, as the game begins. The scripts change them as the night goes.

Scale

How big the letters are, as a share of the font’s own size. The keep has no font of its own, so the words are drawn in the built-in font; 2, as a new Text has it, reads across the top of a 1280 by 720 window without crowding it.

Align

Left, Center or Right: where the words sit across the box. The box is centred and wider than any of the four lines, so Center keeps each line in the middle of the screen. A new Text is Left.

Color

The letters’ colour, as red, green, blue and alpha, each 0 to 1 in the picker’s F mode. 0.8388, 0.7682, 0.6172 is Tiny Dungeon’s pale beige.

Outline, Outline Width

A ring of colour drawn behind each letter, and how far it reaches, in UI units. 2 units of Tiny Dungeon’s dark plum, 0.0497, 0.0194, 0.0307, the colour its pictures are outlined in, keep the beige letters apart from whatever is behind them. A new Text’s width is 0, which draws none.

1. In Assets, press Create, choose New script, type word, and press Enter. In the Code tab, replace everything in word.rgs with the script below, and press Ctrl+S.
2. Select word, click Add component and choose Word. It has no fields.
3. Press Ctrl+S.

/// The words across the top of the screen: what the thief is to do, and how
/// the night ends. Caught, she has lost the key, so the words go back to the
/// first ones.
component Word {
    fn on_signal() {
        if heard("dropped") {
            set_text("TextComponent", "text", "Take the key from the store room, and get out the way you came in.");
        }
        if heard("taken") {
            set_text("TextComponent", "text", "Now out the way you came in.");
        }
        if heard("away") {
            set_text("TextComponent", "text", "Away with the key. The night is yours.");
            pause();
        }
        if heard("lost") {
            set_text("TextComponent", "text", "Caught once too often. The watch wins.");
            pause();
        }
    }
}

pause

Pauses the game at the end of the step. Nothing in the keep is set to run while paused, so everything stops where it is: the guards, the cat, the thief under your keys. The words stay on the screen. In Play, press F5 to stop; in the exported game, close its window.

1. Press F5. The words across the top say what to do.
2. Walk the thief up into the store room by its door off the corridor, and onto the key on its table. The key goes, and the words change.
3. Press F5 again to stop.

Debugging a guard

1. Press F5. Press Bake on the strip, and in the strip’s Gizmos menu leave Routes and Navigation ticked and untick the rest.
2. Walk the thief up into the corridor and west along the carpet, towards the corridor guard.
3. Select guard_corridor, type navagent into the Inspector’s search box and press Enter. Watch his Target and Speed as he notices her.

1. With guard_corridor still selected, type guard into the Inspector’s search box instead and press Enter. Keep the thief near him: Mode goes from Patrol to Suspicious to Chase, and Sees is ticked while she is in his cone.
2. Select bell, type bell into the search box and press Enter: Chased is ticked while he chases her, and Left counts down.
3. Select thief, type thief and press Enter: Caught counts his catches.
4. Press F5 again to stop.

1. Choose View → Panels → Problems. In the keep as you built it, the tab reads No problems: none of the rows below.

“This node has a Nav Agent and a Path Follow”

Two movers on one node: the Path Follow puts it back on its path after the agent walks, every step, so it never leaves its path. Keep one: remove the Path Follow, as chapters 5, 6 and 8 did. A Nav Agent or a Path Follow on a body Driven By Keys gets a row of its own: the keys move it instead. Set Driven By to Script.

“This Nav Agent stands outside every Nav Region”

The walker plans on the first region holding it, and none does, so it finds no way anywhere and stops as soon as it is sent. Move it onto the region, or grow the region’s Size to take it in.

“This Path Follow walks the Path on …” and “This Path Follow walks its parent’s Path …”

A follower whose path is missing. The first: its Path names a node that is not there, or one with no Path. The second: its Path is empty, and its parent has no Path, or it has no parent. It walks nothing. Pick the node in its Path, or move the follower under the Path it should walk.

“This Nav Region’s bake blocked nothing”

Solid boxes stand in the region, and its bake made none of them a wall, so walkers walk through them. It shows after a Bake, as chapter 2 showed. Tick Blocks nav on the walls’ tile layer, or put the walls on a collision layer the region’s Mask holds.

The watch, exported

1. Save with File → Save all: Export copies the files as they are on disk.
2. Click the Build tab, or choose View → Panels → Build if it is not there.
3. In its Export section, the line under Export says where the game will be written, ending in navigation-and-ai/dist/navigation-and-ai/navigation-and-ai: your project’s folder, then dist, then a folder and a file both named after it.
4. Press Export. When it is done, the editor opens the new folder in your file manager.
5. Double-click navigation-and-ai, or navigation-and-ai.exe on Windows. On Linux, if double-clicking does not start it, run ./navigation-and-ai in a terminal in that folder.

What the chapter set

Check it works