Server authority
This commit is contained in:
+75
-185
@@ -1,27 +1,28 @@
|
||||
import { SLOT_SIZE } from "$/common/constants.ts";
|
||||
import { click_slot, Container } from "$/common/inventory.ts";
|
||||
import { ClientMessage, ContainerKey, CRAFTING_RESULT_SLOT } from "$/common/protocol.ts";
|
||||
import { point_inside_rec } from "../../common/utils.ts";
|
||||
import { AssetManager } from "../assets.ts";
|
||||
import { InputManager } from "../input_manager.ts";
|
||||
import { Inventory, ItemStack, PlayerInventory } from "../inventory.ts";
|
||||
import { ClientInventories } from "../inventory.ts";
|
||||
import { canvas, Texture } from "../renderer/mod.ts";
|
||||
import { draw_item, draw_nine_slice } from "../systems/rendering/render_utils.ts";
|
||||
|
||||
export class Slot {
|
||||
inventory: Inventory;
|
||||
container: ContainerKey;
|
||||
index: number;
|
||||
// relative to screen top left
|
||||
x: number;
|
||||
y: number;
|
||||
// can only be taken from, like the crafting or furnace result
|
||||
output: boolean;
|
||||
|
||||
constructor(inventory: Inventory, index: number, x: number, y: number) {
|
||||
this.inventory = inventory;
|
||||
constructor(container: ContainerKey, index: number, x: number, y: number, output = false) {
|
||||
this.container = container;
|
||||
this.index = index;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
}
|
||||
|
||||
get item(): ItemStack | undefined {
|
||||
return this.inventory.container.get_item(this.index);
|
||||
this.output = output;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -34,25 +35,32 @@ export abstract class GuiScreen {
|
||||
abstract on_close(): void;
|
||||
}
|
||||
|
||||
export class GuiInventoryScreen<Inv extends Inventory = Inventory, Properties = Record<string, unknown> | undefined>
|
||||
extends GuiScreen {
|
||||
inventory: Inv;
|
||||
player_inventory: PlayerInventory;
|
||||
properties: Properties;
|
||||
// a screen of slots. the server owns the contents: clicks are sent to it and guessed locally
|
||||
// so they feel instant, then whatever the server syncs back wins
|
||||
export class GuiInventoryScreen extends GuiScreen {
|
||||
inventories: ClientInventories;
|
||||
send: (message: ClientMessage) => void;
|
||||
|
||||
slots: Slot[] = [];
|
||||
hovering: Slot | undefined;
|
||||
inventory_width: number = 500;
|
||||
inventory_height: number = 500;
|
||||
|
||||
constructor(
|
||||
inventory: Inv,
|
||||
player_inventory: PlayerInventory,
|
||||
properties: Properties,
|
||||
) {
|
||||
constructor(inventories: ClientInventories, send: (message: ClientMessage) => void) {
|
||||
super();
|
||||
this.inventory = inventory;
|
||||
this.player_inventory = player_inventory;
|
||||
this.properties = properties;
|
||||
this.inventories = inventories;
|
||||
this.send = send;
|
||||
}
|
||||
|
||||
get_container(key: ContainerKey): Container | undefined {
|
||||
switch (key) {
|
||||
case "inventory":
|
||||
return this.inventories.inventory;
|
||||
case "crafting":
|
||||
return this.inventories.crafting;
|
||||
case "screen":
|
||||
return this.inventories.screen;
|
||||
}
|
||||
}
|
||||
|
||||
on_tick(_delta: number): void {
|
||||
@@ -60,20 +68,17 @@ export class GuiInventoryScreen<Inv extends Inventory = Inventory, Properties =
|
||||
this.y = canvas.height / 2 - (this.inventory_height / 2);
|
||||
|
||||
this.handle_interaction();
|
||||
|
||||
if (this.player_inventory.holding_item?.amount === 0) {
|
||||
this.player_inventory.holding_item = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
on_render(): void {
|
||||
const ui = AssetManager.instance.get<Texture>("bworld:ui");
|
||||
|
||||
for (const slot of this.slots) {
|
||||
const hovered = slot === this.hovering;
|
||||
draw_nine_slice(
|
||||
ui,
|
||||
slot.inventory.hovering_slot === slot.index ? 19 * 16 : 160 + 32,
|
||||
slot.inventory.hovering_slot === slot.index ? 16 : 0,
|
||||
hovered ? 19 * 16 : 160 + 32,
|
||||
hovered ? 16 : 0,
|
||||
16,
|
||||
16,
|
||||
4,
|
||||
@@ -88,198 +93,83 @@ export class GuiInventoryScreen<Inv extends Inventory = Inventory, Properties =
|
||||
}
|
||||
|
||||
for (const slot of this.slots) {
|
||||
const item = slot.item;
|
||||
const item = this.get_container(slot.container)?.get_item(slot.index);
|
||||
if (item) {
|
||||
draw_item(item, this.x + slot.x, this.y + slot.y);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.player_inventory.holding_item) {
|
||||
if (this.inventories.cursor.item) {
|
||||
const mouse = InputManager.get_mouse_position();
|
||||
draw_item(this.player_inventory.holding_item, mouse.x, mouse.y);
|
||||
draw_item(this.inventories.cursor.item, mouse.x, mouse.y);
|
||||
}
|
||||
}
|
||||
|
||||
on_close(): void {}
|
||||
on_close(): void {
|
||||
this.send({ type: "close_screen" });
|
||||
|
||||
// the server puts these back in the inventory, show it right away
|
||||
const { inventory, crafting, cursor } = this.inventories;
|
||||
for (let i = 0; i < CRAFTING_RESULT_SLOT; i++) {
|
||||
const item = crafting.get_item(i);
|
||||
if (item) {
|
||||
inventory.add_item(item);
|
||||
crafting.set_item(i, undefined);
|
||||
}
|
||||
}
|
||||
crafting.set_item(CRAFTING_RESULT_SLOT, undefined);
|
||||
if (cursor.item) {
|
||||
inventory.add_item(cursor.item);
|
||||
cursor.item = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
handle_interaction() {
|
||||
this.player_inventory.hovering_slot = -1;
|
||||
this.inventory.hovering_slot = -1;
|
||||
this.hovering = undefined;
|
||||
const mouse = InputManager.get_mouse_position();
|
||||
|
||||
for (const slot of this.slots) {
|
||||
const mouse = InputManager.get_mouse_position();
|
||||
const slot_x = slot.x + this.x;
|
||||
const slot_y = slot.y + this.y;
|
||||
const hovering = point_inside_rec(mouse.x, mouse.y, slot_x, slot_y, SLOT_SIZE, SLOT_SIZE);
|
||||
if (hovering) {
|
||||
slot.inventory.hovering_slot = slot.index;
|
||||
const hovering = point_inside_rec(mouse.x, mouse.y, this.x + slot.x, this.y + slot.y, SLOT_SIZE, SLOT_SIZE);
|
||||
if (!hovering) {
|
||||
continue;
|
||||
}
|
||||
this.hovering = slot;
|
||||
|
||||
if (InputManager.is_mouse_pressed(0)) {
|
||||
InputManager.consume_mouse(0);
|
||||
this.handle_left_click(slot);
|
||||
return;
|
||||
}
|
||||
|
||||
if (InputManager.is_mouse_pressed(2)) {
|
||||
InputManager.consume_mouse(2);
|
||||
this.handle_right_click(slot);
|
||||
for (const button of [0, 2]) {
|
||||
if (InputManager.is_mouse_pressed(button)) {
|
||||
InputManager.consume_mouse(button);
|
||||
this.click(slot, button);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
switch_item_with_holding(inventory: Inventory, index: number) {
|
||||
const container_slot = inventory.container.get_slot(index);
|
||||
const original_holding_item = this.player_inventory.holding_item;
|
||||
this.player_inventory.holding_item = container_slot.get_item();
|
||||
container_slot.set_item(original_holding_item);
|
||||
}
|
||||
click(slot: Slot, button: number) {
|
||||
this.send({ type: "click", container: slot.container, index: slot.index, button });
|
||||
|
||||
handle_left_click(slot: Slot) {
|
||||
const holding = this.player_inventory.holding_item;
|
||||
const inventory_slot = slot.inventory.container.get_slot(slot.index);
|
||||
const slot_item = inventory_slot.get_item();
|
||||
|
||||
// if you aren't holding anything
|
||||
// "swap" with nothing on your hand (pick it up)
|
||||
if (!holding) {
|
||||
this.switch_item_with_holding(slot.inventory, slot.index);
|
||||
return;
|
||||
}
|
||||
|
||||
// if you are holding something and slot type equals holding type
|
||||
// try to add to stack
|
||||
if (slot_item && inventory_slot.type_id === holding.type_id) {
|
||||
const space_left = inventory_slot.max_amount! - slot_item.amount!;
|
||||
const amount_to_add = Math.min(space_left, holding.amount);
|
||||
|
||||
slot_item.amount += amount_to_add;
|
||||
holding.amount -= amount_to_add;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// if something on hand but not the same
|
||||
// swap
|
||||
this.switch_item_with_holding(slot.inventory, slot.index);
|
||||
}
|
||||
|
||||
handle_right_click(slot: Slot) {
|
||||
const holding = this.player_inventory.holding_item;
|
||||
const inventory_slot = slot.inventory.container.get_slot(slot.index);
|
||||
const slot_item = inventory_slot.get_item();
|
||||
|
||||
// if holding something
|
||||
if (holding) {
|
||||
// and slot type equals holding type
|
||||
// add 1 to matching stack
|
||||
if (slot_item && inventory_slot.type_id === holding.type_id) {
|
||||
if (slot_item.amount < slot_item.max_amount!) {
|
||||
slot_item.amount += 1;
|
||||
holding.amount -= 1;
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// (actually the same as the last one but creates a new one techinically)
|
||||
// place 1 into empty slot
|
||||
if (!slot_item) {
|
||||
const new_item = holding.clone();
|
||||
new_item.amount = 1;
|
||||
inventory_slot.set_item(new_item);
|
||||
holding.amount -= 1;
|
||||
return;
|
||||
}
|
||||
|
||||
// if something on hand but not the same
|
||||
// swap
|
||||
this.switch_item_with_holding(slot.inventory, slot.index);
|
||||
return;
|
||||
}
|
||||
|
||||
// if player is holding nothing and clicks nothing, nothing happens
|
||||
if (!slot_item) {
|
||||
return;
|
||||
}
|
||||
|
||||
// pick up half of the stack
|
||||
const original_amount = slot_item.amount;
|
||||
const half = Math.floor(original_amount / 2);
|
||||
|
||||
slot_item.amount = half;
|
||||
|
||||
const picked_up = slot_item.clone();
|
||||
picked_up.amount = original_amount - half;
|
||||
|
||||
this.player_inventory.holding_item = picked_up;
|
||||
|
||||
if (slot_item.amount === 0) {
|
||||
inventory_slot.set_item(undefined);
|
||||
// output slots depend on server side things like recipes, just wait for the server
|
||||
const container = this.get_container(slot.container);
|
||||
if (container && !slot.output) {
|
||||
click_slot(container, slot.index, this.inventories.cursor, button);
|
||||
}
|
||||
}
|
||||
|
||||
/*handle_hotbar(world: ClientWorld, player_inventory: PlayerInventory) {
|
||||
const [player, player_hand] = world.get_tag("player")!;
|
||||
|
||||
const player_position = player.get(Position);
|
||||
const player_sprite = player.get(AnimatedSprite);
|
||||
const hand_position = player_hand.get(Position);
|
||||
const hand_sprite = player_hand.get(Sprite);
|
||||
|
||||
if (!player_position || !hand_position || !hand_sprite || !player_sprite) {
|
||||
return;
|
||||
}
|
||||
|
||||
// sync position
|
||||
hand_position.x = player_position.x + (player_sprite.flip_x ? 34 : 4);
|
||||
hand_position.y = player_position.y + 34;
|
||||
hand_sprite.flip_x = player_sprite.flip_x;
|
||||
|
||||
const maybe_item = player_inventory.container.get_item(player_inventory.hotbar_selected);
|
||||
if (maybe_item) {
|
||||
const region = get_sprite_region(maybe_item.type_id);
|
||||
hand_sprite.source_x = region.x * 16;
|
||||
hand_sprite.source_y = region.y * 16;
|
||||
hand_sprite.source_width = 16;
|
||||
hand_sprite.source_height = 16;
|
||||
hand_sprite.width = 32;
|
||||
hand_sprite.height = 32;
|
||||
} else {
|
||||
hand_sprite.width = 0;
|
||||
hand_sprite.height = 0;
|
||||
}
|
||||
}*/
|
||||
}
|
||||
|
||||
// generic methods that is often needed
|
||||
|
||||
export function add_player_inventory(
|
||||
handler: GuiInventoryScreen,
|
||||
player_inventory: PlayerInventory,
|
||||
offset_x: number,
|
||||
offset_y: number,
|
||||
) {
|
||||
export function add_player_inventory(handler: GuiInventoryScreen, offset_x: number, offset_y: number) {
|
||||
for (let i = 0; i < 3; ++i) {
|
||||
for (let l = 0; l < 9; ++l) {
|
||||
handler.slots.push(
|
||||
new Slot(
|
||||
player_inventory,
|
||||
l + i * 9 + 9,
|
||||
offset_x + l * SLOT_SIZE,
|
||||
offset_y + i * SLOT_SIZE,
|
||||
),
|
||||
new Slot("inventory", l + i * 9 + 9, offset_x + l * SLOT_SIZE, offset_y + i * SLOT_SIZE),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function add_player_hotbar(
|
||||
handler: GuiInventoryScreen,
|
||||
player_inventory: PlayerInventory,
|
||||
offset_x: number,
|
||||
offset_y: number,
|
||||
) {
|
||||
export function add_player_hotbar(handler: GuiInventoryScreen, offset_x: number, offset_y: number) {
|
||||
for (let i = 0; i < 9; ++i) {
|
||||
handler.slots.push(new Slot(player_inventory, i, offset_x + i * SLOT_SIZE, offset_y));
|
||||
handler.slots.push(new Slot("inventory", i, offset_x + i * SLOT_SIZE, offset_y));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user