Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

platret/chipstack

Repository files navigation

⬛ CHIPSTACK

A neon browser arcade — guideline-grade Tetris ×ばつ a play-money casino

×ばつ a play-money casino" href="#a-neon-browser-arcade--guideline-grade-tetris--a-play-money-casino">

tetr.io-quality stacking meets slots, blackjack, roulette & video poker. All chips are free. No real money. No accounts. No backend. Ever.

Vite React TypeScript Tailwind Canvas License


✦ What is this

ChipStack is a fast, polished, fully client-side arcade built around two pillars:

  • A real Tetris engine — fixed-timestep logic, full SRS with wall-kicks, 7-bag, tunable DAS/ARR/SDF, lock delay with move-reset, T-spins, back-to-back & combos. Rendered on a 2D canvas, not the DOM. The feel is the product.
  • A play-money casino — slots, blackjack, roulette and Jacks-or-Better video poker, each a self-contained module behind one shared wallet, with authentic house edges baked into the math (because the chips are free, the odds should still feel real).

There is no real-money payment of any kind. The signature feature is the opposite: an Add Chips button that drops any positive integer into your balance instantly — no cost, no limit, no friction.

✦ Features

Arcade Casino Shell
Modern guideline Tetris 5-reel slots, 20 paylines One persistent wallet HUD
Full SRS + I-kicks + 180° Blackjack (split / double, 3:2) Add Chips — any amount, instant
7-bag randomizer European single-zero roulette Fully rebindable keybinds
DAS / ARR / SDF handling Video Poker (9/6 Jacks-or-Better) DAS / ARR / SDF sliders
Ghost, hold, hard-drop Seeded RNG + real house edge 4 neon themes
T-spins, back-to-back, combos Staggered reels, card & chip SFX Persists to localStorage

✦ The Tetris engine

The hard part, done right:

  • Fixed-timestep loop — logic runs at a locked 60 Hz off an accumulator, decoupled from requestAnimationFrame render. The feel is identical at 60, 144 and 240 Hz.
  • SRS — canonical rotation states, separate I wall-kick table, plus a 180° kick set.
  • Movement — DAS and ARR are computed off the logic tick, never browser key-repeat. Defaults: DAS 133ms · ARR 0ms (instant) · SDF ×ばつ — all editable; ARR up to 83ms, SDF up to ∞.
  • Lock delay — ~500 ms with move-reset and a 15-move reset cap so you can't stall.
  • Gravity — guideline per-level curve; T-spin detection via the 3-corner rule (front-corner + kick upgrade for full vs mini); back-to-back ×ばつ1.5 and combo scoring.
  • Rendering — neon beveled blocks, smooth sub-cell fall, ghost, hard-drop & line-clear particles — all on canvas, with shadowBlur limited to the active piece for 60fps.

✦ Controls (all rebindable in Settings)

Action Default Action Default
Move left / right Rotate CW / CCW / Z
Soft drop Rotate 180° A
Hard drop Space Hold C
Pause Esc Restart R

✦ Tech stack

  • Vite + React 19 + TypeScript (strict: verbatimModuleSyntax, erasableSyntaxOnly)
  • Tailwind v4 + shadcn-style primitives (Radix + cva) — synthwave design system
  • Zustand (+ persist) for wallet / settings / stats
  • Framer Motion for UI; GSAP for casino flourishes
  • HTML5 Canvas 2D for the playfield and reel / wheel animations
  • Web Audio API — a single manager synthesizes every SFX (no audio files)

✦ Run it

npm install
npm run dev # http://localhost:5173
npm run build # typecheck (tsc -b) + production build

No environment variables, no services. Everything is local.

✦ Project layout

src/
 games/tetris/ engine · pieces (SRS) · scoring · renderer · useTetris · shell
 games/{slots,blackjack,roulette,videopoker}/ casino modules
 store/ wallet · settings · stats (Zustand + persist)
 components/ui/ shadcn-style primitives
 lib/ rng (seeded) · audio · format · keys

See ARCHITECTURE.md for the module contracts and design-system/MASTER.md for the visual system.

✦ Responsible note

ChipStack uses fake chips only to recreate the feel of arcade and casino games. It has no real-money mechanics, no purchases, and no way to cash out. It is a toy.

Built with a multi-agent workflow. Tetris feel first; everything else after.

About

Neon browser arcade: tetr.io-grade Tetris + a play-money casino (slots, blackjack, roulette, video poker). React 19 + TS + Canvas. No real money.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

Contributors

AltStyle によって変換されたページ (->オリジナル) /