Add customer types. Add daily stats to summary.

src/assets/assets.ts

@@ -16,7 +16,7 @@ const images: Image[] = [
 	image('characters/worker', 'worker'),
 	// Small size customers
 	image('characters/smallCWalk1', 'small_customer_walk1'),
-	image('characters/smallCsit1', 'small_customer_sit1'),
+	image('characters/smallCSit1', 'small_customer_sit1'),
 	// Medium size customers
 	image('characters/medCWalk1', 'medium_customer_walk1'),
 	image('characters/medCSit1', 'medium_customer_sit1'),

src/components/Customer.ts

@@ -6,16 +6,18 @@ import { Timer } from "./Timer";
 import { interpolateColor } from "@/functions";
 import { ThoughtBubble } from "./ThoughtBubble";
 import { StationType } from "./StationData";
+import { CustomerData, CustomerId } from "./CustomerData";
 
 export interface CustomerType {
 	spr: string;
 	tags: string[];
 	antitags: string[];
 	budget: number;
-
 }
 
 export class Customer extends Button {
+	public customerId: CustomerId;
+
 	// Movement
 	public lastX: number; // Last position on the grid
 	public lastY: number;
@@ -53,10 +55,11 @@ export class Customer extends Button {
 	private angryImage: Phaser.GameObjects.Image;
 	private happinessTimer: Timer;
 
-	constructor(scene: GameScene, x: number, y: number) {
+	constructor(scene: GameScene, x: number, y: number, id: CustomerId) {
 		super(scene, x, y);
 		scene.add.existing(this);
 		this.scene = scene;
+		this.customerId = id;
 
 		this.lastX = x;
 		this.lastY = y;
@@ -75,7 +78,7 @@ export class Customer extends Button {
 
 		/* Sprite */
 		const size = 120;
-		this.sprite = this.scene.add.sprite(0, 0, "small_customer_walk1");
+		this.sprite = this.scene.add.sprite(0, 0, this.spriteKeys.sit);
 		this.sprite.setOrigin(0.5, 1.0);
 		this.sprite.y += size / 2;
 		this.sprite.setScale(size / this.sprite.width);
@@ -135,6 +138,7 @@ export class Customer extends Button {
 			if (this.happiness <= 0) {
 				this.leave();
 				this.thoughtBubble.showSymbol("sad");
+				this.emit("angry");
 			}
 		} else {
 			this.happinessTimer.setVisible(false);
@@ -145,6 +149,7 @@ export class Customer extends Button {
 	onDragStart(pointer: Phaser.Input.Pointer, dragX: number, dragY: number) {
 		this.emit("pickup");
 		this.dragged = true;
+		this.sprite.setTexture(this.spriteKeys.walk);
 	}
 
 	onDrag(pointer: Phaser.Input.Pointer, dragX: number, dragY: number) {
@@ -157,6 +162,8 @@ export class Customer extends Button {
 	onDragEnd(pointer: Phaser.Input.Pointer, dragX: number, dragY: number) {
 		this.dragged = false;
 		this.emit("drop");
+		this.sprite.setTexture(this.spriteKeys.sit);
+
 	}
 
 	snapTo(x: number, y: number) {
@@ -237,7 +244,21 @@ export class Customer extends Button {
 		});
 	}
 
+	/* Getters */
+
 	get isWaiting(): boolean {
 		return this.currentStation !== null && this.currentEmployee === null;
 	}
+
+	get spriteKeys() {
+		return CustomerData[this.customerId].spriteKeys;
+	}
+
+	get walkSpeed(): number {
+		return CustomerData[this.customerId].walkSpeed;
+	}
+
+	get workMultiplier(): number {
+		return CustomerData[this.customerId].workMultiplier;
+	}
 }

src/components/CustomerData.ts

@@ -0,0 +1,43 @@
+/* Specific customer instance data */
+
+export enum CustomerId {
+	Small,
+	Medium,
+	Large,
+}
+
+export interface CustomerInterface {
+	spriteKeys: {
+		walk: string;
+		sit: string;
+	};
+	walkSpeed: number; // Speed of the customer walking
+	workMultiplier: number; // Penalty multiplier for work (bigger is slower)
+}
+
+export const CustomerData: { [key in CustomerId]: CustomerInterface } = {
+	[CustomerId.Small]: {
+		spriteKeys: {
+			walk: "small_customer_walk1",
+			sit: "small_customer_sit1",
+		},
+		walkSpeed: 1,
+		workMultiplier: 1,
+	},
+	[CustomerId.Medium]: {
+		spriteKeys: {
+			walk: "medium_customer_walk1",
+			sit: "medium_customer_sit1",
+		},
+		walkSpeed: 2,
+		workMultiplier: 2,
+	},
+	[CustomerId.Large]: {
+		spriteKeys: {
+			walk: "large_customer_walk1",
+			sit: "large_customer_sit1",
+		},
+		walkSpeed: 3,
+		workMultiplier: 3,
+	},
+};

src/components/SummaryOverlay.ts

@@ -71,14 +71,24 @@ export class SummaryOverlay extends Phaser.GameObjects.Container {
 		this.okButton.update(time, delta);
 	}
 
-	open() {
+	open(dailyStats: {
+		money: number;
+		happyCustomers: number;
+		angryCustomers: number;
+	}) {
 		this.setVisible(true);
 		this.setAlpha(0);
 		this.scene.tweens.add({
 			targets: this,
 			alpha: 1,
 			duration: 200,
 		});
+
+		let text = "";
+		text += `Money earned: $${dailyStats.money}\n`;
+		text += `Customers served: ${dailyStats.happyCustomers}\n`;
+		text += `Angry customers: ${dailyStats.angryCustomers}`;
+		this.moneyText.setText(text);
 	}
 
 	close() {

src/scenes/GameScene.ts

@@ -2,6 +2,7 @@ import { BaseScene } from "@/scenes/BaseScene";
 import { Board } from "@/components/Board";
 import { Employee } from "@/components/Employee";
 import { Customer } from "@/components/Customer";
+import { CustomerId } from "@/components/CustomerData";
 import { Station } from "@/components/Station";
 import { UI } from "@/components/UI";
 import { StationId, StationType } from "@/components/StationData";
@@ -145,7 +146,12 @@ export class GameScene extends BaseScene {
 					this.timeOfDay > 0 &&
 					this.getAvailableWaitingSeat()
 				) {
-					this.addCustomer();
+					const type = Phaser.Math.RND.pick([
+						CustomerId.Small,
+						CustomerId.Medium,
+						CustomerId.Large,
+					]);
+					this.addCustomer(type);
 				}
 			},
 			loop: true,
@@ -187,7 +193,7 @@ export class GameScene extends BaseScene {
 		this.stations.forEach((s) => s.setClickable(isShopping));
 		this.employees.forEach((e) => e.setClickable(isShopping));
 		this.ui.setShoppingMode(isShopping);
-		if (isShopping) this.summaryOverlay.open();
+		if (isShopping) this.summaryOverlay.open(this.dailyStats);
 	}
 
 	// Load level data
@@ -254,7 +260,7 @@ export class GameScene extends BaseScene {
 		this.employees.forEach((e) => e.setDepth(0));
 
 		// TEMP: Add first customer
-		this.addCustomer();
+		this.addCustomer(CustomerId.Small);
 
 		// Setup daytime tween
 		this.tweens.add({
@@ -344,9 +350,9 @@ export class GameScene extends BaseScene {
 	}
 
 	// Add new customer
-	addCustomer() {
+	addCustomer(type: CustomerId) {
 		const coord = this.board.gridToCoord(-8, 0);
-		const customer = new Customer(this, coord.x, coord.y);
+		const customer = new Customer(this, coord.x, coord.y, type);
 		this.customers.push(customer);
 
 		// Place in available waiting seat
@@ -418,8 +424,15 @@ export class GameScene extends BaseScene {
 		// Customer completing their itinerary and paying
 		customer.on("pay", (money: number) => {
 			this.money += money;
+			this.dailyStats.money += money;
+			this.dailyStats.happyCustomers += 1;
 			this.ui.setMoney(this.money);
 		});
+
+		// Customer leaving angry
+		customer.on("angry", () => {
+			this.dailyStats.angryCustomers += 1;
+		});
 	}
 
 	// Get available seat for new customers to go to