summaryrefslogtreecommitdiff
path: root/template/DIALOG_STATE_PATTERN.md
blob: 08f34b299c510a7091e1a58537f4ee48ae28d53f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
# Dialog State Pattern

This document explains how to implement Zelda-style dialog systems using the GameState push/pop stack pattern.

## Overview

The GameState system supports a **state stack** that allows you to temporarily push a new state (like a dialog) on top of the current game state, then pop back when done. This is perfect for:

- Dialog systems (Zelda-style text boxes)
- Pause menus
- Inventory screens
- Any UI that needs exclusive input control

## How It Works

```lua
GameState.push(newState)  -- Pushes current state to stack, switches to new state
GameState.pop()           -- Returns to previous state from stack
```

When you `push()` a state:
- Current state's `leave()` is called
- New state's `enter()` is called
- Current state remains in memory on the stack

When you `pop()`:
- Current state's `leave()` is called
- Previous state's `resume()` is called (not `enter()`)
- Previous state gets control back

## Example: Dialog System

### Step 1: Create Dialog State

Create `states/dialog.lua`:

```lua
local Object = require("lib.classic")
local GameState = require("lib.gamestate")
local DialogState = Object:extend()

function DialogState:new(dialogData)
  self.texts = dialogData.texts or {"Default dialog text"}
  self.currentIndex = 1
  self.characterName = dialogData.name or ""
  self.portrait = dialogData.portrait or nil
  self.textSpeed = dialogData.textSpeed or 50  -- chars per second
  self.currentCharIndex = 0
  self.displayedText = ""
  self.isComplete = false
end

function DialogState:enter(previous)
  print("Dialog opened")
  self.currentCharIndex = 0
  self.displayedText = ""
  self.isComplete = false
end

function DialogState:update(dt)
  local currentText = self.texts[self.currentIndex]
  
  -- Animate text reveal
  if not self.isComplete then
    self.currentCharIndex = self.currentCharIndex + self.textSpeed * dt
    if self.currentCharIndex >= #currentText then
      self.currentCharIndex = #currentText
      self.isComplete = true
    end
    self.displayedText = currentText:sub(1, math.floor(self.currentCharIndex))
  end
  
  -- Handle input
  if RL.IsKeyPressed(RL.KEY_ENTER) or RL.IsKeyPressed(RL.KEY_SPACE) then
    if not self.isComplete then
      -- Skip to end of current text
      self.currentCharIndex = #currentText
      self.displayedText = currentText
      self.isComplete = true
    else
      -- Move to next text or close dialog
      if self.currentIndex < #self.texts then
        self.currentIndex = self.currentIndex + 1
        self.currentCharIndex = 0
        self.displayedText = ""
        self.isComplete = false
      else
        -- Dialog finished, return to game
        GameState.pop()
      end
    end
  end
end

function DialogState:draw()
  local screenSize = RL.GetScreenSize()
  local boxHeight = 200
  local boxY = screenSize[2] - boxHeight - 20
  local padding = 20
  
  -- Draw dialog box
  RL.DrawRectangle({0, boxY, screenSize[1], boxHeight}, {20, 20, 30, 240})
  RL.DrawRectangleLines({0, boxY, screenSize[1], boxHeight}, 3, RL.WHITE)
  
  -- Draw character name if present
  if self.characterName ~= "" then
    local nameBoxWidth = 200
    local nameBoxHeight = 40
    RL.DrawRectangle({padding, boxY - nameBoxHeight + 5, nameBoxWidth, nameBoxHeight}, {40, 40, 50, 255})
    RL.DrawRectangleLines({padding, boxY - nameBoxHeight + 5, nameBoxWidth, nameBoxHeight}, 2, RL.WHITE)
    RL.DrawText(self.characterName, {padding + 15, boxY - nameBoxHeight + 15}, 20, RL.WHITE)
  end
  
  -- Draw portrait if present
  local textX = padding + 10
  if self.portrait then
    RL.DrawTexture(self.portrait, {padding + 10, boxY + padding}, RL.WHITE)
    textX = textX + self.portrait.width + 20
  end
  
  -- Draw text
  RL.DrawText(self.displayedText, {textX, boxY + padding}, 20, RL.WHITE)
  
  -- Draw continue indicator
  if self.isComplete then
    local indicator = "▼"
    if self.currentIndex < #self.texts then
      indicator = "Press ENTER to continue"
    else
      indicator = "Press ENTER to close"
    end
    local indicatorSize = 16
    local indicatorWidth = RL.MeasureText(indicator, indicatorSize)
    RL.DrawText(indicator, {screenSize[1] - indicatorWidth - padding, boxY + boxHeight - padding - 20}, indicatorSize, RL.LIGHTGRAY)
  end
end

function DialogState:leave()
  print("Dialog closed")
end

return DialogState
```

### Step 2: Use Dialog in Game State

Modify `states/game.lua`:

```lua
local Object = require("lib.classic")
local GameState = require("lib.gamestate")
local Animation = require("lib.animation")
local DialogState = require("states.dialog")
local GameState_Class = Object:extend()

-- ... (Player class code) ...

function GameState_Class:new()
  self.player = nil
  self.paused = false
end

function GameState_Class:enter(previous)
  print("Entered game state")
  
  local screenSize = RL.GetScreenSize()
  self.player = Player(screenSize[1] / 2 - 16, screenSize[2] / 2 - 16)
  
  -- Example: Show dialog when entering game (for testing)
  -- Remove this after testing
  local welcomeDialog = DialogState({
    name = "System",
    texts = {
      "Welcome to the game!",
      "Use WASD or Arrow keys to move around.",
      "Press ENTER to continue through dialogs."
    },
    textSpeed = 30
  })
  GameState.push(welcomeDialog)
end

function GameState_Class:update(dt)
  -- ESC pauses game
  if RL.IsKeyPressed(RL.KEY_ESCAPE) then
    self.paused = not self.paused
  end
  
  if self.paused then
    return
  end
  
  -- Example: Press T to trigger dialog (for testing)
  if RL.IsKeyPressed(RL.KEY_T) then
    local testDialog = DialogState({
      name = "NPC",
      texts = {
        "Hello traveler!",
        "This is an example dialog system.",
        "You can have multiple text boxes.",
        "Press ENTER to continue!"
      },
      textSpeed = 40
    })
    GameState.push(testDialog)
  end
  
  -- Update game objects (only when not in dialog)
  if self.player then
    self.player:update(dt)
  end
end

function GameState_Class:resume(previous)
  -- Called when returning from dialog
  print("Resumed game state from: " .. tostring(previous))
  -- You can handle post-dialog logic here
  -- Example: Give item, update quest state, etc.
end

function GameState_Class:draw()
  RL.ClearBackground({50, 50, 50, 255})
  
  -- Draw game objects
  if self.player then
    self.player:draw()
  end
  
  -- Draw pause overlay
  if self.paused then
    local screenSize = RL.GetScreenSize()
    local centerX = screenSize[1] / 2
    local centerY = screenSize[2] / 2
    
    RL.DrawRectangle({0, 0, screenSize[1], screenSize[2]}, {0, 0, 0, 128})
    
    local text = "PAUSED"
    local size = 40
    local width = RL.MeasureText(text, size)
    RL.DrawText(text, {centerX - width / 2, centerY - 20}, size, RL.WHITE)
  end
  
  -- Draw controls hint
  local hint = "WASD/ARROWS: Move  |  T: Test Dialog  |  ESC: Pause"
  local hintSize = 16
  local screenSize = RL.GetScreenSize()
  RL.DrawText(hint, {10, screenSize[2] - 30}, hintSize, RL.LIGHTGRAY)
end

function GameState_Class:leave()
  print("Left game state")
end

return GameState_Class
```

## Key Benefits**Clean Separation**: Dialog has its own file and logic
✅ **Input Control**: Dialog gets exclusive control when active
✅ **No Coupling**: Game doesn't need to know about dialog internals
✅ **Automatic Pause**: Game automatically stops updating when dialog is pushed
✅ **Easy Extension**: Add more dialog types (shops, menus) using same pattern
✅ **Post-Dialog Logic**: Use `resume()` callback to handle what happens after dialog closes

## Advanced: Passing Data Back to Game

You can pass data when popping:

```lua
-- In dialog state
function DialogState:update(dt)
  if playerMadeChoice then
    GameState.pop(choiceData)  -- Pass choice back to game
  end
end

-- In game state
function GameState_Class:resume(previous, choiceData)
  if choiceData then
    print("Player chose: " .. choiceData.choice)
    -- Handle the choice
  end
end
```

## State Stack Visual

```
Initial:   [Game State]
           
After push: [Game State] -> [Dialog State]  (Dialog has control)
           
After pop:  [Game State]                     (Game has control back)
```

## When to Use Push/Pop vs Flags

**Use Push/Pop for:**
- Dialog systems
- Pause menus
- Shop interfaces
- Inventory screens
- Any state that needs exclusive control

**Use Flags (self.paused, etc.) for:**
- Simple on/off toggles
- Quick state checks
- Non-blocking overlays
- Debug info displays

## See Also

- `lib/gamestate.lua` - Full GameState implementation
- `states/game.lua` - Example game state
- `states/menu.lua` - Example menu state