# Snake

The dot-matrix classic as a handheld made of kit parts. Steer the snake round a field of amber LEDs and eat the blinking dot to grow; it gets quicker every five dots.

Object · With a Pass · https://tactileui.dev/objects/snake

> The code and styling for this object come with the Pass. Sign in if you have one. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Anatomy

Shared handheld case, Pointerdown keys, Dot matrix canvas, Fixed step loop, Swipe steering, Segment lcd digits, Concentric corners, Scale as an object

## Usage notes

A game you could hold, drawn from the kit's own parts. Steer the snake to the blinking dot to grow it; every five dots the step shortens, through eight speeds. A wall or its own tail ends the run, and the best score is kept on the visitor's device. The screen is the kit's matrix window driven dot by dot, so it takes the finish and the dot colour from the kit.

## Options

| Option | Type | Description |
| - | - | - |
| sound | boolean | The switch on the case. On, eating and a crash each have a tone once you have pressed a key (a browser allows sound only after a press). The visitor’s own setting is kept on their device. |
| label | text | What a screen reader calls the case. |

## Methods

- hooks
- update
- destroy

## States

1. **How to play**: Press Start (or Space). Steer the snake to the blinking dot and eat it to grow by one. Every five dots it goes faster. Hitting a wall or your own tail ends the run; a turn straight back into the snake is ignored.
2. **Keys**: The arrow keys or W A S D steer, and the D-pad keys go down while held. Space or Enter starts, pauses and resumes. On a phone, swipe on the screen to steer and tap it to start. Sound begins with the first press.
3. **Made of**: 
4. **Idle**: An S of a snake heads for its blinking dot on the screen.
5. **Playing**: Three dots long at the start, heading right. The head is the brightest dot and the body dims to the tail; each dot eaten runs down the body.
6. **Paused**: Start pauses and resumes, and a hidden tab pauses the run. The food stays lit and the LCD says Paused.
7. **Game over**: The snake stays where it died, dimmed, and after a moment the score comes up over it in dots. The LCD says New best or Game over; a new best is kept on this device.
8. **Sound**: A short beep to start, a high blip for each dot eaten and a low tone on a crash. The switch turns it off; the choice is remembered.
9. **Reduced motion**: A held key shades but does not move, the food stays lit and the dots switch at once; the snake still moves.
10. **Twelve finishes, two volumes**: The case reads the finish and volume tokens only, and the dots take the kit's matrix colour: aluminium, graphite and the other ten finishes, Tactile or Quiet.

## How it works

Original. The case is the library's shared handheld (originals/components/shared/handheld), drawn from the kit's parts at one size and scaled as an object. The screen draws into the kit's matrix window and imports /kit/parts/matrix.mjs, so it needs the Tactile UI Kit on the page; the Code tab's example links it from ./kit/.