Interactables

The Interactable Component

Adding an Interactable component to an entity will automatically show UI when players are within the radius you specify.

The interaction radius scales with the entity's world scale, so keep the interactable root at scale 1 and scale a visual child when you want the interaction range to stay fixed.

To respond to the player pressing the interactable, you'll need to write CSL code.

An entity can have more than one Interactable. Use priority when multiple prompts might be available at the same time.

The most common pattern is:

• Create a class that inherits from Interactable
• Call this.set_listener(this) in ao_start
• Implement can_use and on_interact on your class

If you add a new interactable class in code, you still need to add that component to an entity in the editor (or spawn an entity and add the component at runtime).

Trash Example

// Get coins for picking up the trash :D
Trash :: class : Interactable {
    coins: s64 @ao_serialize;
    used: bool;

    ao_start :: method() {
        this.set_listener(this);
        this.set_text("Pick up trash");
        this.set_hold_text("Picking up...");
        required_hold_time = 0.25;
        radius = 1.25;
    }

    can_use :: method(player: Player) -> bool {
        if used return false;
        return true;
    }

    on_interact :: method(player: Player) {
        used = true;
        Economy.deposit_currency(player, "Coins", coins);
        entity.destroy();
    }
}

Grow Example

An interactable that “grows” an entity (once):

Grow_Button :: class : Interactable {
    scale_multiplier: float @ao_serialize;
    used: bool;

    ao_start :: method() {
        this.set_listener(this);
        this.set_text("Grow");
        radius = 1.25;
        required_hold_time = 0;
    }

    can_use :: method(player: Player) -> bool {
        return !used;
    }

    on_interact :: method(player: Player) {
        used = true;
        new_scale := entity.local_scale * scale_multiplier;
        entity.set_local_scale(new_scale);
        this.set_text("Already used");
    }
}

Prompt Purchase Example

An interactable that prompts a product purchase:

Buy_Admin_Pass :: class : Interactable {
    product_id: string @ao_serialize;

    ao_start :: method() {
        this.set_listener(this);
        this.set_text("Buy Admin Pass");
        radius = 1.25;
    }

    can_use :: method(player: Player) -> bool {
        // Example gate: hide if already owned (game pass)
        return !Purchasing.owns_product(player, product_id);
    }

    on_interact :: method(player: Player) {
        Purchasing.prompt_purchase(player, product_id);
    }
}

API Reference

Interactable :: class : Component {
    // Prompt text (tap interaction)
    get_text :: method() -> string;
    set_text :: method(text: string);

    // Prompt text while holding (for hold-to-interact)
    get_hold_text :: method() -> string;
    set_hold_text :: method(text: string);

    get_subtitle :: method() -> string;
    set_subtitle :: method(text: string);

    // Wire a listener object that implements:
    // - can_use(player: Player) -> bool
    // - on_interact(player: Player)
    // - on_holding(player: Player) [optional]
    set_listener :: method(new_listener: Component);

    // Common fields (set in editor or in code)
    offset: v2;
    prompt_offset: v2;
    radius: float;
    required_hold_time: float;
    priority: s64;
    subtitle_color: v4;
}

Optional player hooks (global rules)

You can also implement these on your Player class to enforce game-wide rules (e.g. can't use interactables before respawning):

Player :: class : Player_Base {
    ao_can_use_interactable :: method(interactable: Interactable) -> bool {
        return true;
    }

    ao_on_interactable_used :: method(interactable: Interactable) {
    }

    ao_on_holding_interactable :: method(interactable: Interactable) {
    }
}