125 lines
4.9 KiB
Markdown
125 lines
4.9 KiB
Markdown
# Task 9: Fix Climb/Descend Controls - Context Summary
|
|
|
|
**Status:** Partially done (spam prevention and re-entry resume implemented, button rename incomplete)
|
|
|
|
## 1. Climbing/Descending State in store.ts
|
|
|
|
### State Variables (lines 820, 2260):
|
|
- `spireMode: boolean` - Whether player is in Spire Mode
|
|
- `clearedFloors: Record<number, boolean>` - Tracks cleared floors for respawning
|
|
- `climbDirection: 'up' | 'down' | null` - Current climb direction (persisted for re-entry)
|
|
- `isDescending: boolean` - True when actively descending (prevents spam clicking)
|
|
|
|
### Key Actions:
|
|
- `enterSpireMode()` (line 2253): Sets `spireMode: true`, `currentAction: 'climb'`, `isDescending: false`
|
|
- `climbDownFloor()` (line 2267):
|
|
- Checks `isDescending` to prevent spam
|
|
- Decrements floor by 1 (min floor 1)
|
|
- Sets `isDescending: true` during descent
|
|
- Uses `setTimeout` to reset `isDescending: false` after 500ms
|
|
- Clears/resets floor state in `clearedFloors`
|
|
- `exitSpireMode()` (line 2311): Sets `spireMode: false`, `currentAction: 'meditate'`, `isDescending: false`
|
|
|
|
### Spam Prevention (COMPLETED):
|
|
- `isDescending` flag prevents multiple rapid clicks
|
|
- Button is disabled when `isDescending` is true
|
|
- 500ms timeout resets the flag after descent completes
|
|
|
|
### Re-entry Resume (COMPLETED):
|
|
- `climbDirection` is persisted in state
|
|
- `enterSpireMode()` resumes from `climbDirection` state
|
|
- `exitSpireMode()` allows exit at any floor, re-entry resumes at same floor
|
|
|
|
## 2. Buttons in SpireTab Components and page.tsx
|
|
|
|
### src/app/page.tsx (Spire Mode UI) - Lines 258-278:
|
|
|
|
**Climbing Indicator Badge (line 263-266):**
|
|
```tsx
|
|
{store.currentAction === 'climb' && !store.isDescending && (
|
|
<Badge className="bg-green-900/50 text-green-300 border-green-600">
|
|
Climbing
|
|
</Badge>
|
|
)}
|
|
```
|
|
|
|
**Descend/Climb Button (lines 267-278):**
|
|
```tsx
|
|
<Button
|
|
variant="outline"
|
|
className="border-blue-600/50 text-blue-400 hover:bg-blue-900/20"
|
|
onClick={() => store.climbDownFloor()}
|
|
disabled={store.isDescending}
|
|
>
|
|
<ChevronDown className="w-4 h-4 mr-2" />
|
|
{store.isDescending ? 'Descending…' :
|
|
store.currentAction === 'climb' ? 'Climbing' :
|
|
'Begin Descent'}
|
|
</Button>
|
|
```
|
|
|
|
**Current Button Label Logic:**
|
|
- When `isDescending` is true: Shows "Descending…" (with ellipsis) and button is disabled
|
|
- When `currentAction === 'climb'`: Shows "Climbing"
|
|
- Otherwise: Shows "Begin Descent"
|
|
|
|
**Enter Spire Mode Button (lines 211-221):**
|
|
```tsx
|
|
<Button
|
|
className="w-full bg-gradient-to-r from-amber-600 to-orange-600..."
|
|
onClick={() => store.enterSpireMode()}
|
|
disabled={!canEnterSpireMode(store)}
|
|
>
|
|
<Mountain className="w-5 h-5 mr-2" />
|
|
Climb the Spire
|
|
</Button>
|
|
```
|
|
|
|
### src/components/game/tabs/SpireTab.tsx:
|
|
- **No climb/descend buttons** - This component only displays floor info, spells, golems, and activity log
|
|
- Has "Enter Spire Mode" button (line 76) with label "Enter Spire Mode" (for non-Spire Mode view)
|
|
- Displays floor information, active spells, golems, and activity log in `simpleMode={true}`
|
|
|
|
## 3. What Needs to Change for Button Rename
|
|
|
|
**Requirement:** idle: 'Begin Descent', descending: 'Descending' disabled, climbing: 'Climbing'
|
|
|
|
**Current Issues:**
|
|
|
|
1. **"Descending…" vs "Descending"**: The button shows "Descending…" (with ellipsis) when descending, but requirement says "Descending" (without ellipsis)
|
|
|
|
2. **Button label when climbing**: The current logic shows "Climbing" when `currentAction === 'climb'`, but this is confusing because:
|
|
- The button's action is to descend (calls `climbDownFloor()`)
|
|
- The "Climbing" Badge already serves as a separate indicator
|
|
- When climbing, users may want to descend, so the button should probably say "Begin Descent"
|
|
|
|
3. **Possible correct implementation:**
|
|
- Remove the `currentAction === 'climb'` check from button label
|
|
- Button should always show "Begin Descent" when not descending
|
|
- Button shows "Descending" (disabled) when descending
|
|
- Keep the separate "Climbing" Badge as a status indicator
|
|
|
|
**Suggested Button Code Fix (in page.tsx, lines 274-277):**
|
|
```tsx
|
|
{store.isDescending ? 'Descending' : 'Begin Descent'}
|
|
```
|
|
(Remove the `store.currentAction === 'climb' ? 'Climbing' : 'Begin Descent'` part)
|
|
|
|
## 4. Summary of Files to Modify
|
|
|
|
| File | Change Needed |
|
|
|------|---------------|
|
|
| `src/app/page.tsx` | Fix button label logic (lines 274-277) to match requirements |
|
|
| `src/lib/game/store.ts` | No changes needed (spam prevention and re-entry resume implemented) |
|
|
| `src/components/game/tabs/SpireTab.tsx` | No changes needed (no climb/descend buttons) |
|
|
|
|
## 5. Verification Steps
|
|
|
|
After making changes:
|
|
1. Test spam prevention: Rapidly click descend button - should only descend once per 500ms
|
|
2. Test re-entry resume: Exit Spire Mode at floor X, re-enter - should resume at floor X
|
|
3. Test button labels:
|
|
- Idle (not climbing, not descending): Shows "Begin Descent"
|
|
- Descending: Shows "Descending" (disabled)
|
|
- Climbing: The separate Badge shows "Climbing", button shows "Begin Descent"
|