[Enhancement] Chess: Three.js display from partner chess3d; keep SpikerSoft logic #40

New Issue

2026-04-29T15:07:25Z

spikerj commented

2026-04-29 15:07:25 +00:00

Summary

Enhance SpikerSoft’s chess experience by adopting the Three.js visual display and rendering from our partner implementation (chess3d) so it aligns stylistically with our other games, while retaining SpikerSoft’s existing game logic (rules, state, networking, integrations, etc.).

Reference implementation

Repository: Sushant-Coder-01/chess3d (Three.js, GLB/GLTF pieces, orbit camera, modular src/ layout per README).

Scope

Incorporate: Board/scene setup, piece models/materials, camera/lighting patterns, interaction affordances tied to rendering (selection highlights, animations as applicable), and any adapters needed so our chess state feeds this view layer.
Preserve: Existing SpikerSoft chess logic layer — move validation, turn model, persisted state, platform hooks — refactor only where needed for a clean separation model vs. view.

Acceptance (high level)

Visual shell matches the quality and technical approach of our other Three.js-based games (consistent framing, performance targets, theming where applicable).
Game behavior remains driven by SpikerSoft logic; partner repo is used as rendering reference / asset pipeline, not as a drop-in replacement for rules.
Document licensing/attribution for reused assets or code paths derived from the partner repo.

Notes

Prefer a thin view adapter (our state → Three.js scene updates) so future logic changes do not require deep changes in the renderer.

## Summary Enhance SpikerSoft’s chess experience by adopting the **Three.js visual display and rendering** from our partner implementation ([chess3d](https://github.com/Sushant-Coder-01/chess3d)) so it **aligns stylistically with our other games**, while **retaining SpikerSoft’s existing game logic** (rules, state, networking, integrations, etc.). ## Reference implementation - **Repository:** [Sushant-Coder-01/chess3d](https://github.com/Sushant-Coder-01/chess3d) (Three.js, GLB/GLTF pieces, orbit camera, modular `src/` layout per README). ## Scope - **Incorporate:** Board/scene setup, piece models/materials, camera/lighting patterns, interaction affordances tied to rendering (selection highlights, animations as applicable), and any adapters needed so our chess state feeds this view layer. - **Preserve:** Existing SpikerSoft chess **logic layer** — move validation, turn model, persisted state, platform hooks — refactor only where needed for a clean separation **model vs. view**. ## Acceptance (high level) - [ ] Visual shell matches the quality and technical approach of our other Three.js-based games (consistent framing, performance targets, theming where applicable). - [ ] Game behavior remains driven by SpikerSoft logic; partner repo is used as **rendering reference / asset pipeline**, not as a drop-in replacement for rules. - [ ] Document licensing/attribution for reused assets or code paths derived from the partner repo. ## Notes Prefer a thin **view adapter** (our state → Three.js scene updates) so future logic changes do not require deep changes in the renderer.

spikerj referenced this issue

2026-05-05 20:19:56 +00:00

[Enhancement] Chess: user-generated piece models via Trellis3D pipeline #71

spikerj commented

2026-05-05 22:08:51 +00:00

Closing as complete. Implementation notes for posterity:

Architecture (answers the "thin view adapter" requirement)

ChessGameService is unchanged — rules, turn model, state, networking, and platform hooks all live where they always did.
ChessViewAdapter (chess-3d/chess-view-adapter.ts) is the only bridge: it reads game state and translates it into Three.js scene mutations. Raycaster picks from 3D map back into the existing Position API and feed the same engine methods the 2D path always used. There is no chess logic in the renderer.
ChessPieceModelProvider is an InjectionToken interface with one current implementation (StaticChessPieceModelProvider). This is the seam for #71 (Trellis3D-generated pieces) — a future provider can drop in without touching the adapter or scene.
Layout normalization (piece-models/piece-normalization.ts, piece-layout.ts) handles the chess3d GLBs' wildly different scales/rotations/origins by recentering geometry and auto-computing yPosition from TILE_TOP_Y + scaledHeight/2. Same pipeline will normalize whatever Trellis3D outputs.

What landed

2D ↔ 3D toggle persisted to localStorage; both views feed off the same game service.
3D scene: orbit camera with aspect-aware framing (computeOrientPosition, frameBoard, ensureBoardFits) so the board stays fully visible across viewport sizes and flips correctly for online play.
Piece interactions: selection highlights, legal-move highlights, capture animations (relative scaling + correct shelf placement so captures match their on-board size), historic move path hover (endpoints + intermediate squares, including castling rook swing).
Grid label modes (off / edge / tile-surface) wired to both 2D and 3D, with z-fighting fixes (polygonOffset for tile decals, depthTest: true for sprite labels).
Unified menubar (chess-menubar/) using Angular CDK Menu — same pattern as the rest of our tools — replaces the three legacy stacked bars and exposes the new options modal placeholder for #71.
Color normalization: chess3d source GLBs ship with mixed walnut/marble/ivory baked-in textures. tintPrototype now type-agnostically overrides every material's .color and strips the diffuse .map so each team reads as a uniform set, while preserving normal/AO/roughness maps for surface detail. This override is isolated to the static provider so user-generated Trellis3D models (#71) won't be repainted.

Tests added this round

move-path.spec.ts (17 tests) — sliding pieces, knights, pawn 1/2-step, en-passant pinning, kingside/queenside castling for both colors, defensive guards, and isPathEndpoint/isPathIntermediate overlap cases.
grid-label-mode.spec.ts (9 tests) — algebraic corners + full-board uniqueness, read/write round-trip, default fallback for missing/invalid values, and graceful handling of localStorage throws (Safari private mode / quota-exceeded).

Attribution

Licensing/attribution for the chess3d-derived assets is documented at assets/games/chess/models/ATTRIBUTION.md.

Closing as complete. Implementation notes for posterity: ## Architecture (answers the "thin view adapter" requirement) - **`ChessGameService` is unchanged** — rules, turn model, state, networking, and platform hooks all live where they always did. - **`ChessViewAdapter`** (`chess-3d/chess-view-adapter.ts`) is the only bridge: it reads game state and translates it into Three.js scene mutations. Raycaster picks from 3D map back into the existing `Position` API and feed the same engine methods the 2D path always used. There is no chess logic in the renderer. - **`ChessPieceModelProvider`** is an `InjectionToken` interface with one current implementation (`StaticChessPieceModelProvider`). This is the seam for #71 (Trellis3D-generated pieces) — a future provider can drop in without touching the adapter or scene. - **Layout normalization** (`piece-models/piece-normalization.ts`, `piece-layout.ts`) handles the chess3d GLBs' wildly different scales/rotations/origins by recentering geometry and auto-computing `yPosition` from `TILE_TOP_Y + scaledHeight/2`. Same pipeline will normalize whatever Trellis3D outputs. ## What landed - **2D ↔ 3D toggle** persisted to `localStorage`; both views feed off the same game service. - **3D scene**: orbit camera with aspect-aware framing (`computeOrientPosition`, `frameBoard`, `ensureBoardFits`) so the board stays fully visible across viewport sizes and flips correctly for online play. - **Piece interactions**: selection highlights, legal-move highlights, capture animations (relative scaling + correct shelf placement so captures match their on-board size), historic move path hover (endpoints + intermediate squares, including castling rook swing). - **Grid label modes** (off / edge / tile-surface) wired to both 2D and 3D, with z-fighting fixes (`polygonOffset` for tile decals, `depthTest: true` for sprite labels). - **Unified menubar** (`chess-menubar/`) using Angular CDK Menu — same pattern as the rest of our tools — replaces the three legacy stacked bars and exposes the new options modal placeholder for #71. - **Color normalization**: chess3d source GLBs ship with mixed walnut/marble/ivory baked-in textures. `tintPrototype` now type-agnostically overrides every material's `.color` and strips the diffuse `.map` so each team reads as a uniform set, while preserving normal/AO/roughness maps for surface detail. This override is **isolated to the static provider** so user-generated Trellis3D models (#71) won't be repainted. ## Tests added this round - `move-path.spec.ts` (17 tests) — sliding pieces, knights, pawn 1/2-step, en-passant pinning, kingside/queenside castling for both colors, defensive guards, and `isPathEndpoint`/`isPathIntermediate` overlap cases. - `grid-label-mode.spec.ts` (9 tests) — `algebraic` corners + full-board uniqueness, `read`/`write` round-trip, default fallback for missing/invalid values, and graceful handling of `localStorage` throws (Safari private mode / quota-exceeded). ## Attribution Licensing/attribution for the chess3d-derived assets is documented at `assets/games/chess/models/ATTRIBUTION.md`. ## Related - Future work for user-generated piece models: #71 (architecture is in place; the Trellis3D provider just needs to be wired up).

spikerj closed this issue

2026-05-05 22:08:55 +00:00

spikerj referenced this issue

2026-06-14 01:38:51 +00:00

## [Bug] Incorrect Mouse Click Behavior in HexTile Game # 2 #147

spikerj referenced this issue

2026-06-30 19:11:56 +00:00

[Epic][Bug] Localize lesson code-template comments (Spanish) across all playgrounds #296

spikerj referenced this issue

2026-06-30 19:31:03 +00:00

[Epic #296 follow-up] codeTemplate overlay never reaches C/C++/x86/SQL/Regex starters (plan-embedded, not BuiltAttempt.CodeTemplate) #299

spikerj referenced this issue