adc0cdff1c
- Three new Lottie companions: Wiggle Dog (摇尾狗), Butterfly (蝴蝶), Parrot (鹦鹉). Parrot is mirrored via a new `flip` flag on Companion, threaded through LottiePlayer (scaleX(-1)) since the asset faces left. - Mascot size now scales with the viewport: --petal-companion-size clamp(10rem, 17vw, 20rem); art, emoji fallback, and the sleep "z" all derive from it. - Larger, more legible tip bubble (1.4rem zh / 1.15rem en, wider bubble). - Bubbles linger longer for a bilingual ESL read: baseline 9s→14s, cheer 6s→9s, per-char 45→55ms, cap 20s→32s. Claude-Session: https://claude.ai/code/session_016Yr6jELuRc7hyzYLccQKZd
93 lines
2.4 KiB
TypeScript
93 lines
2.4 KiB
TypeScript
import type { Mood } from './useCompanion'
|
|
import sleepingCat from './animations/sleeping-cat.json'
|
|
import happyDog from './animations/happy-dog.json'
|
|
import wiggleDog from './animations/wiggle-dog.json'
|
|
import butterfly from './animations/butterfly.json'
|
|
import parrot from './animations/parrot.json'
|
|
|
|
export interface Companion {
|
|
id: string
|
|
name: string // English label
|
|
zh: string // Chinese label (she reads Mandarin — north star Note #17)
|
|
emoji: string // shown in the picker + used as the per-mood fallback base
|
|
// mood → Lottie asset. Unmapped moods fall back to the per-mood emoji.
|
|
animations: Partial<Record<Mood, object>>
|
|
// When true the mascot keeps its calm sway + drifting zzz regardless of mood
|
|
// (e.g. a cat that's always asleep but still talks in its sleep).
|
|
alwaysAsleep?: boolean
|
|
// When true the rendered animation is mirrored left↔right — for assets drawn
|
|
// facing the "wrong" way for our bottom-right corner (e.g. the parrot).
|
|
flip?: boolean
|
|
}
|
|
|
|
// The roster. Add a companion by dropping a pure-vector Lottie JSON into
|
|
// ./animations and appending an entry here — that's the whole change.
|
|
export const COMPANIONS: Companion[] = [
|
|
{
|
|
id: 'cat',
|
|
name: 'Sleepy Cat',
|
|
zh: '瞌睡猫',
|
|
emoji: '😴',
|
|
alwaysAsleep: true,
|
|
animations: {
|
|
idle: sleepingCat,
|
|
happy: sleepingCat,
|
|
talking: sleepingCat,
|
|
celebrate: sleepingCat,
|
|
sleeping: sleepingCat,
|
|
},
|
|
},
|
|
{
|
|
id: 'dog',
|
|
name: 'Happy Dog',
|
|
zh: '开心狗',
|
|
emoji: '🐶',
|
|
animations: {
|
|
idle: happyDog,
|
|
happy: happyDog,
|
|
talking: happyDog,
|
|
celebrate: happyDog,
|
|
// no sleeping clip → stays in its idle pose instead of visibly napping
|
|
},
|
|
},
|
|
{
|
|
id: 'wiggle-dog',
|
|
name: 'Wiggle Dog',
|
|
zh: '摇尾狗',
|
|
emoji: '🐕',
|
|
animations: {
|
|
idle: wiggleDog,
|
|
happy: wiggleDog,
|
|
talking: wiggleDog,
|
|
celebrate: wiggleDog,
|
|
},
|
|
},
|
|
{
|
|
id: 'butterfly',
|
|
name: 'Butterfly',
|
|
zh: '蝴蝶',
|
|
emoji: '🦋',
|
|
animations: {
|
|
idle: butterfly,
|
|
happy: butterfly,
|
|
talking: butterfly,
|
|
celebrate: butterfly,
|
|
},
|
|
},
|
|
{
|
|
id: 'parrot',
|
|
name: 'Parrot',
|
|
zh: '鹦鹉',
|
|
emoji: '🦜',
|
|
flip: true, // asset faces left; mirror it to face into the page
|
|
animations: {
|
|
idle: parrot,
|
|
happy: parrot,
|
|
talking: parrot,
|
|
celebrate: parrot,
|
|
},
|
|
},
|
|
]
|
|
|
|
export const DEFAULT_COMPANION = 'cat'
|