dreamstack/examples/game-snake.ds

-- DreamStack Snake Game (Streamed)
-- Move the snake with arrow buttons to eat the food!
-- Each button press moves one step.
--
-- Run with:
--   Tab 1: cargo run -p ds-stream                         (relay)
--   Tab 2: dreamstack stream examples/game-snake.ds       (source/player)
--   Tab 3: open the viewer HTML                           (viewer)

import { Card } from "../registry/components/card"
import { Badge } from "../registry/components/badge"

-- Snake head position (0-indexed on a conceptual 8x8 grid)
let headX = 4
let headY = 4
let score = 0
let moves = 0

-- Food position (changes when eaten — player sets manually for now)
let foodX = 2
let foodY = 2

-- Timer for excitement
let ticks = 0
every 1000 -> ticks += 1

-- Stream the game
stream snake on "ws://localhost:9100/peer/game" {
  mode: signal,
  output: headX, headY, score, moves, foodX, foodY, ticks
}

view snake_game = column [
  text "🐍 Snake Game" { variant: "title" }
  text "Move with arrows • Eat the 🍎" { variant: "subtitle" }

  -- Score bar
  row [
    Badge { label: "Score: {score}", variant: "success" }
    Badge { label: "Moves: {moves}", variant: "info" }
    Badge { label: "Time: {ticks}s", variant: "warning" }
    Badge { label: "🐍 ({headX},{headY})", variant: "default" }
    Badge { label: "🍎 ({foodX},{foodY})", variant: "error" }
  ]

  -- Game board — the previewer renders a visual grid from signals
  Card { title: "Board (12×12)" } [
    text "🐍 at ({headX},{headY})  🍎 at ({foodX},{foodY})"
  ]

  -- Directional controls
  Card { title: "Controls" } [
    row [
      text " "
      button "⬆️" { click: headY -= 1; moves += 1, variant: "primary" }
      text " "
    ]
    row [
      button "⬅️" { click: headX -= 1; moves += 1, variant: "primary" }
      button "⏹️" { variant: "secondary" }
      button "➡️" { click: headX += 1; moves += 1, variant: "primary" }
    ]
    row [
      text " "
      button "⬇️" { click: headY += 1; moves += 1, variant: "primary" }
      text " "
    ]
  ]

  -- Quick food placement
  row [
    button "🍎 Move Food" { click: foodX = ticks % 7; foodY = (ticks + 3) % 7, variant: "ghost" }
    button "🔄 Reset" { click: headX = 4; headY = 4; score = 0; moves = 0, variant: "destructive" }
  ]
]