Clamp pet wander to lower-third ground zone.

Restrict Y to 66–90% and X to 15–85% with bottom-anchored positioning so the avatar stays on grass instead of sky or walls.
This commit is contained in:
2026-05-24 05:08:03 -06:00
parent 3616cc5c5b
commit 7dab056eba
2 changed files with 23 additions and 7 deletions

View File

@@ -4,6 +4,10 @@ import { useEffect, useState } from "react";
import { CharacterLayerPreview } from "@/components/character/character-layer-preview"; import { CharacterLayerPreview } from "@/components/character/character-layer-preview";
import type { AvatarCustomization } from "@/lib/avatar-customization-storage"; import type { AvatarCustomization } from "@/lib/avatar-customization-storage";
import {
PET_WANDER_BOUNDS,
PET_WANDER_START,
} from "@/lib/pet-wander-bounds";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
type AnimatedPetSpriteProps = { type AnimatedPetSpriteProps = {
@@ -17,10 +21,8 @@ type WanderPosition = {
facing: "left" | "right"; facing: "left" | "right";
}; };
const MIN_X = 24; const { minX: MIN_X, maxX: MAX_X, minY: MIN_Y, maxY: MAX_Y } =
const MAX_X = 72; PET_WANDER_BOUNDS;
const MIN_Y = 34;
const MAX_Y = 62;
function randomPosition(current?: WanderPosition): WanderPosition { function randomPosition(current?: WanderPosition): WanderPosition {
let next: WanderPosition = { let next: WanderPosition = {
@@ -52,8 +54,8 @@ export function AnimatedPetSprite({
className, className,
}: AnimatedPetSpriteProps) { }: AnimatedPetSpriteProps) {
const [position, setPosition] = useState<WanderPosition>({ const [position, setPosition] = useState<WanderPosition>({
x: 48, x: PET_WANDER_START.x,
y: 48, y: PET_WANDER_START.y,
facing: "right", facing: "right",
}); });
@@ -82,7 +84,7 @@ export function AnimatedPetSprite({
style={{ style={{
left: `${position.x}%`, left: `${position.x}%`,
top: `${position.y}%`, top: `${position.y}%`,
transform: "translate(-50%, -50%)", transform: "translate(-50%, -100%)",
transition: "left 1.8s steps(10), top 1.8s steps(10)", transition: "left 1.8s steps(10), top 1.8s steps(10)",
}} }}
> >

14
lib/pet-wander-bounds.ts Normal file
View File

@@ -0,0 +1,14 @@
/** Percentage bounds for pet wander within the LCD viewport. */
export const PET_WANDER_BOUNDS = {
/** Horizontal inset — keep pet off side walls */
minX: 15,
maxX: 85,
/** Lower third of LCD — ground where hills/grass/floor render */
minY: 66,
maxY: 90,
} as const;
export const PET_WANDER_START = {
x: 50,
y: 78,
} as const;