[V0_FILE]css:file="app/globals.css" isQuickEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(0.97 0.01 75); --foreground: oklch(0.25 0.02 60); --card: oklch(0.99 0.005 75); --card-foreground: oklch(0.25 0.02 60); --popover: oklch(0.99 0.005 75); --popover-foreground: oklch(0.25 0.02 60); --primary: oklch(0.45 0.12 180); --primary-foreground: oklch(0.99 0.005 75); --secondary: oklch(0.65 0.15 75); --secondary-foreground: oklch(0.15 0.02 60); --muted: oklch(0.92 0.01 75); --muted-foreground: oklch(0.5 0.02 60); --accent: oklch(0.65 0.15 75); --accent-foreground: oklch(0.15 0.02 60); --destructive: oklch(0.55 0.2 25); --destructive-foreground: oklch(0.99 0.005 75); --border: oklch(0.85 0.01 75); --input: oklch(0.85 0.01 75); --ring: oklch(0.45 0.12 180); --chart-1: oklch(0.45 0.12 180); --chart-2: oklch(0.65 0.15 75); --chart-3: oklch(0.55 0.18 35); --chart-4: oklch(0.4 0.1 200); --chart-5: oklch(0.7 0.12 60); --radius: 0.5rem; --sidebar: oklch(0.99 0.005 75); --sidebar-foreground: oklch(0.25 0.02 60); --sidebar-primary: oklch(0.45 0.12 180); --sidebar-primary-foreground: oklch(0.99 0.005 75); --sidebar-accent: oklch(0.92 0.01 75); --sidebar-accent-foreground: oklch(0.25 0.02 60); --sidebar-border: oklch(0.85 0.01 75); --sidebar-ring: oklch(0.45 0.12 180); } .dark { --background: oklch(0.18 0.02 180); --foreground: oklch(0.95 0.01 75); --card: oklch(0.2 0.02 180); --card-foreground: oklch(0.95 0.01 75); --popover: oklch(0.2 0.02 180); --popover-foreground: oklch(0.95 0.01 75); --primary: oklch(0.55 0.12 180); --primary-foreground: oklch(0.15 0.02 180); --secondary: oklch(0.65 0.15 75); --secondary-foreground: oklch(0.15 0.02 60); --muted: oklch(0.25 0.02 180); --muted-foreground: oklch(0.65 0.02 180); --accent: oklch(0.65 0.15 75); --accent-foreground: oklch(0.15 0.02 60); --destructive: oklch(0.55 0.2 25); --destructive-foreground: oklch(0.95 0.01 75); --border: oklch(0.3 0.02 180); --input: oklch(0.3 0.02 180); --ring: oklch(0.55 0.12 180); --chart-1: oklch(0.55 0.12 180); --chart-2: oklch(0.65 0.15 75); --chart-3: oklch(0.55 0.18 35); --chart-4: oklch(0.5 0.1 200); --chart-5: oklch(0.7 0.12 60); --sidebar: oklch(0.2 0.02 180); --sidebar-foreground: oklch(0.95 0.01 75); --sidebar-primary: oklch(0.55 0.12 180); --sidebar-primary-foreground: oklch(0.15 0.02 180); --sidebar-accent: oklch(0.25 0.02 180); --sidebar-accent-foreground: oklch(0.95 0.01 75); --sidebar-border: oklch(0.3 0.02 180); --sidebar-ring: oklch(0.55 0.12 180); } @theme inline { --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); --font-serif: var(--font-playfair); --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } [V0_FILE]typescriptreact:file="components/game-header.tsx" isEdit="true" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { BookOpen, RotateCcw } from "lucide-react" interface GameHeaderProps { onShowTutorial: () => void onNewGame: () => void } export function GameHeader({ onShowTutorial, onNewGame }: GameHeaderProps) { return (

Sittuyin

{"Traditional Burmese Chess"}

) } [V0_FILE]typescriptreact:file="components/game-info.tsx" isEdit="true" isMerged="true" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import type { GameState } from "@/lib/types" import { Loader2 } from "lucide-react" interface GameInfoProps { gameState: GameState isAIThinking?: boolean } export function GameInfo({ gameState, isAIThinking }: GameInfoProps) { const { phase, currentPlayer, isCheck, winner, gameMode, aiDifficulty, humanColor } = gameState const getPhaseLabel = () => { switch (phase) { case "deployment": return "Deployment Phase" case "play": return "Playing" case "finished": return "Game Over" } } const getDifficultyLabel = () => { switch (aiDifficulty) { case "easy": return "Easy" case "normal": return "Normal" case "hard": return "Hard" } } return (

{"Game Status"} {gameMode === "pve" && (

{"Mode"} vs AI ({getDifficultyLabel()})

)}

{"Phase"} {getPhaseLabel()}

{"Current Turn"} {currentPlayer === "white" ? "White" : "Black"}

{isAIThinking && (

{"AI is thinking..."}

)} {isCheck && (

{"Check!"}

)} {winner && (

{winner === "white" ? "White" : "Black"} {" wins!"}

)} {"About Sittuyin"}

{"Sittuyin is the traditional form of chess from Myanmar (Burma), with origins dating back centuries."}

{ "Unlike international chess, Sittuyin features a unique deployment phase where players strategically place their pieces, and includes special diagonal lines called sit-ke-myin (general's lines)." }

) } [V0_FILE]typescriptreact:file="components/tutorial-dialog.tsx" isMerged="true" import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { ScrollArea } from "@/components/ui/scroll-area" interface TutorialDialogProps { open: boolean onOpenChange: (open: boolean) => void } export function TutorialDialog({ open, onOpenChange }: TutorialDialogProps) { return ( ) } function PieceDescription({ name, count, movement, special, }: { name: string count: number movement: string special: string }) { return (

{name}

{"Count: "} {count}

{"Movement: "} {movement}

{"Special: "} {special}

) } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "geist": "^1.3.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "15.5.4", "next-themes": "^0.4.6", "react": "19.1.0", "react-day-picker": "9.8.0", "react-dom": "19.1.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.76" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescriptreact:file="components/promotion-dialog.tsx" isMerged="true" "use client" import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" import { Crown } from "lucide-react" interface PromotionDialogProps { open: boolean onConfirm: () => void onCancel: () => void } export function PromotionDialog({ open, onConfirm, onCancel }: PromotionDialogProps) { return ( ) } [V0_FILE]typescriptreact:file="lib/deployment.ts" isMerged="true" import type { Piece, Position, PieceColor, PieceType } from "./types" // Initialize the board with pawns in their starting positions export function initializeBoardWithPawns(): (Piece | null)[][] { const board: (Piece | null)[][] = Array(8) .fill(null) .map(() => Array(8).fill(null)) // White pawns on row 6 (7th rank) for (let col = 0; col < 8; col++) { board[6][col] = { type: "pawn", color: "white" } } // Black pawns on row 1 (2nd rank) for (let col = 0; col < 8; col++) { board[1][col] = { type: "pawn", color: "black" } } return board } // Get the list of pieces to deploy for each player export function getDeploymentPieces(): PieceType[] { return ["king", "general", "chariot", "chariot", "horse", "horse", "elephant", "elephant"] } // Check if a position is valid for deployment export function isValidDeploymentPosition(position: Position, color: PieceColor, board: (Piece | null)[][]): boolean { const { row, col } = position // Check if position is within bounds if (row < 0 || row >= 8 || col < 0 || col >= 8) return false // Check if square is already occupied if (board[row][col] !== null) return false // White can only place in rows 6 and 7 (back two ranks) if (color === "white" && (row < 6 || row > 7)) return false // Black can only place in rows 0 and 1 (back two ranks) if (color === "black" && (row < 0 || row > 1)) return false return true } // Place a piece during deployment export function placePiece( board: (Piece | null)[][], position: Position, pieceType: PieceType, color: PieceColor, ): (Piece | null)[][] { const newBoard = board.map((row) => [...row]) newBoard[position.row][position.col] = { type: pieceType, color } return newBoard } // Check if deployment is complete export function isDeploymentComplete(whitePieces: PieceType[], blackPieces: PieceType[]): boolean { return whitePieces.length === 0 && blackPieces.length === 0 } // Get valid deployment squares for highlighting export function getValidDeploymentSquares(board: (Piece | null)[][], color: PieceColor): Position[] { const positions: Position[] = [] if (color === "white") { // Rows 6 and 7 for white for (let row = 6; row <= 7; row++) { for (let col = 0; col < 8; col++) { if (board[row][col] === null) { positions.push({ row, col }) } } } } else { // Rows 0 and 1 for black for (let row = 0; row <= 1; row++) { for (let col = 0; col < 8; col++) { if (board[row][col] === null) { positions.push({ row, col }) } } } } return positions } // Find general position on the board export function findGeneralPosition(board: (Piece | null)[][], color: PieceColor): Position | null { for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.type === "general" && piece.color === color) { return { row, col } } } } return null } [V0_FILE]typescriptreact:file="components/game-over-dialog.tsx" isMerged="true" "use client" import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" import { Trophy, Crown } from "lucide-react" import type { PieceColor } from "@/lib/types" interface GameOverDialogProps { open: boolean winner: PieceColor | null onNewGame: () => void onClose: () => void } export function GameOverDialog({ open, winner, onNewGame, onClose }: GameOverDialogProps) { if (!winner) return null return ( ) } [V0_FILE]typescriptreact:file="lib/game-logic.ts" isEdit="true" isQuickEdit="true" isMerged="true" import type { Piece, Position, GameState, PieceColor } from "./types" // Calculate all legal moves for a piece at a given position export function calculateLegalMoves(board: (Piece | null)[][], position: Position, gameState: GameState): Position[] { const piece = board[position.row][position.col] if (!piece) return [] let moves: Position[] = [] switch (piece.type) { case "king": moves = getKingMoves(board, position, piece.color) break case "general": moves = getGeneralMoves(board, position, piece.color) break case "elephant": moves = getElephantMoves(board, position, piece.color) break case "horse": moves = getHorseMoves(board, position, piece.color) break case "chariot": moves = getChariotMoves(board, position, piece.color) break case "pawn": moves = getPawnMoves(board, position, piece.color, gameState) break } // Filter out moves that would put own king in check return moves.filter((move) => !wouldBeInCheck(board, position, move, piece.color)) } // King moves one square in any direction function getKingMoves(board: (Piece | null)[][], position: Position, color: PieceColor): Position[] { const moves: Position[] = [] const directions = [ [-1, -1], [-1, 0], [-1, 1], [0, -1], [0, 1], [1, -1], [1, 0], [1, 1], ] for (const [dr, dc] of directions) { const newRow = position.row + dr const newCol = position.col + dc if (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece || targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } } } return moves } // General (Sit-ke) moves one square diagonally only function getGeneralMoves(board: (Piece | null)[][], position: Position, color: PieceColor): Position[] { const moves: Position[] = [] const directions = [ [-1, -1], [-1, 1], [1, -1], [1, 1], ] for (const [dr, dc] of directions) { const newRow = position.row + dr const newCol = position.col + dc if (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece || targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } } } return moves } // Elephant (Sin) moves one square diagonally OR one square forward function getElephantMoves(board: (Piece | null)[][], position: Position, color: PieceColor): Position[] { const moves: Position[] = [] // Diagonal moves const diagonals = [ [-1, -1], [-1, 1], [1, -1], [1, 1], ] for (const [dr, dc] of diagonals) { const newRow = position.row + dr const newCol = position.col + dc if (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece || targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } } } // Forward move (direction depends on color) const forwardDir = color === "white" ? -1 : 1 const newRow = position.row + forwardDir const newCol = position.col if (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece || targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } } return moves } // Horse (Myin) moves in L-shape like standard knight function getHorseMoves(board: (Piece | null)[][], position: Position, color: PieceColor): Position[] { const moves: Position[] = [] const knightMoves = [ [-2, -1], [-2, 1], [-1, -2], [-1, 2], [1, -2], [1, 2], [2, -1], [2, 1], ] for (const [dr, dc] of knightMoves) { const newRow = position.row + dr const newCol = position.col + dc if (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece || targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } } } return moves } // Chariot (Yahhta) moves like a rook - any number of squares orthogonally function getChariotMoves(board: (Piece | null)[][], position: Position, color: PieceColor): Position[] { const moves: Position[] = [] const directions = [ [-1, 0], [1, 0], [0, -1], [0, 1], ] for (const [dr, dc] of directions) { let newRow = position.row + dr let newCol = position.col + dc while (isValidPosition(newRow, newCol)) { const targetPiece = board[newRow][newCol] if (!targetPiece) { moves.push({ row: newRow, col: newCol }) } else { if (targetPiece.color !== color) { moves.push({ row: newRow, col: newCol }) } break // Stop at any piece } newRow += dr newCol += dc } } return moves } // Pawn (Nè) moves one square forward, captures diagonally forward function getPawnMoves( board: (Piece | null)[][], position: Position, color: PieceColor, gameState: GameState, ): Position[] { const moves: Position[] = [] const forwardDir = color === "white" ? -1 : 1 // Forward move const newRow = position.row + forwardDir const newCol = position.col if (isValidPosition(newRow, newCol) && !board[newRow][newCol]) { moves.push({ row: newRow, col: newCol }) } // Diagonal captures const captureOffsets = [-1, 1] for (const offset of captureOffsets) { const captureRow = position.row + forwardDir const captureCol = position.col + offset if (isValidPosition(captureRow, captureCol)) { const targetPiece = board[captureRow][captureCol] if (targetPiece && targetPiece.color !== color) { moves.push({ row: captureRow, col: captureCol }) } } } return moves } // Check if a position is on the diagonal lines (sit-ke-myin) export function isOnDiagonalLine(position: Position): boolean { // Main diagonal (top-left to bottom-right) if (position.row === position.col) return true // Anti-diagonal (top-right to bottom-left) if (position.row + position.col === 7) return true return false } // Check if a position is valid on the board function isValidPosition(row: number, col: number): boolean { return row >= 0 && row < 8 && col >= 0 && col < 8 } // Check if a move would put the king in check function wouldBeInCheck(board: (Piece | null)[][], from: Position, to: Position, color: PieceColor): boolean { // Create a copy of the board with the move applied const newBoard = board.map((row) => [...row]) newBoard[to.row][to.col] = newBoard[from.row][from.col] newBoard[from.row][from.col] = null // Find the king position let kingPos: Position | null = null for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = newBoard[row][col] if (piece && piece.type === "king" && piece.color === color) { kingPos = { row, col } break } } if (kingPos) break } if (!kingPos) return false // Check if any opponent piece can attack the king const opponentColor: PieceColor = color === "white" ? "black" : "white" for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = newBoard[row][col] if (piece && piece.color === opponentColor) { const attacks = getAttackSquares(newBoard, { row, col }, piece) if (attacks.some((pos) => pos.row === kingPos!.row && pos.col === kingPos!.col)) { return true } } } } return false } // Get all squares a piece can attack (similar to legal moves but without check validation) function getAttackSquares(board: (Piece | null)[][], position: Position, piece: Piece): Position[] { switch (piece.type) { case "king": return getKingMoves(board, position, piece.color) case "general": return getGeneralMoves(board, position, piece.color) case "elephant": return getElephantMoves(board, position, piece.color) case "horse": return getHorseMoves(board, position, piece.color) case "chariot": return getChariotMoves(board, position, piece.color) case "pawn": // Pawns only attack diagonally const moves: Position[] = [] const forwardDir = piece.color === "white" ? -1 : 1 const captureOffsets = [-1, 1] for (const offset of captureOffsets) { const captureRow = position.row + forwardDir const captureCol = position.col + offset if (isValidPosition(captureRow, captureCol)) { moves.push({ row: captureRow, col: captureCol }) } } return moves } } // Check if the current player is in check export function isInCheck(board: (Piece | null)[][], color: PieceColor): boolean { // Find the king let kingPos: Position | null = null for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.type === "king" && piece.color === color) { kingPos = { row, col } break } } if (kingPos) break } if (!kingPos) return false // Check if any opponent piece can attack the king const opponentColor: PieceColor = color === "white" ? "black" : "white" for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === opponentColor) { const attacks = getAttackSquares(board, { row, col }, piece) if (attacks.some((pos) => pos.row === kingPos!.row && pos.col === kingPos!.col)) { return true } } } } return false } // Check if the current player is in checkmate export function isCheckmate(board: (Piece | null)[][], color: PieceColor, gameState: GameState): boolean { if (!isInCheck(board, color)) return false // Check if any piece has a legal move for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === color) { const moves = calculateLegalMoves(board, { row, col }, gameState) if (moves.length > 0) return false } } } return true } // Make a move on the board export function makeMove(board: (Piece | null)[][], from: Position, to: Position): (Piece | null)[][] { const newBoard = board.map((row) => [...row]) newBoard[to.row][to.col] = newBoard[from.row][from.col] newBoard[from.row][from.col] = null return newBoard } // Check if a pawn can promote at this position export function canPromote(position: Position, piece: Piece, gameState: GameState): boolean { if (piece.type !== "pawn") return false if (!isOnDiagonalLine(position)) return false // Can only promote if the original general has been captured const generalPos = piece.color === "white" ? gameState.whiteGeneral : gameState.blackGeneral return generalPos === null } // Promote a pawn to a general export function promotePawn(board: (Piece | null)[][], position: Position): (Piece | null)[][] { const newBoard = board.map((row) => [...row]) const piece = newBoard[position.row][position.col] if (piece && piece.type === "pawn") { newBoard[position.row][position.col] = { type: "general", color: piece.color, } } return newBoard } export function isStalemate(board: (Piece | null)[][], color: PieceColor, gameState: GameState): boolean { // If in check, it's not stalemate if (isInCheck(board, color)) return false // Check if any piece has a legal move for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === color) { const moves = calculateLegalMoves(board, { row, col }, gameState) if (moves.length > 0) return false } } } // No legal moves and not in check = stalemate return true } export function getMaterialCount(board: (Piece | null)[][], color: PieceColor): number { let count = 0 const pieceValues: Record = { king: 0, // King doesn't count for material general: 3, elephant: 3, horse: 3, chariot: 5, pawn: 1, } for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === color && piece.type !== "king") { count += pieceValues[piece.type] } } } return count } [V0_FILE]xml:file="public/pieces/bK.svg" url="https://blobs.vusercontent.net/blob/bK-O6omAFFgtNsZh5nL6l0piB9SMdAGUt.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/bQ.svg" url="https://blobs.vusercontent.net/blob/bQ-quWlyUKvlD1XyqJUzOCA1tVU2kFT67.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/bB.svg" url="https://blobs.vusercontent.net/blob/bB-Xjspjhgnc5kZMsPuBPfYlxceqiH1Uf.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/bN.svg" url="https://blobs.vusercontent.net/blob/bN-s6B3Xg2oMpdiDobUM6VaGtqqXijvye.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/bR.svg" url="https://blobs.vusercontent.net/blob/bR-NsbsM8VkMIgnBiaQ5eDHxudA0v6un8.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/bP.svg" url="https://blobs.vusercontent.net/blob/bP-GOMWt0NsCFWz6LH1td9NdGD4dNShJT.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wK.svg" url="https://blobs.vusercontent.net/blob/wK-2S54HsoTGMbV2BGAGg8SfGLqB4CeEL.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wQ.svg" url="https://blobs.vusercontent.net/blob/wQ-YWcshl7wtg80OD9rwS7FKWsZUIbRl1.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wB.svg" url="https://blobs.vusercontent.net/blob/wB-mDl1yD26GVlpgJhtjmWeMe60RQ9XAH.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wN.svg" url="https://blobs.vusercontent.net/blob/wN-93NenZLcRJ3bjUAkLJUczGxN5v5p9v.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wR.svg" url="https://blobs.vusercontent.net/blob/wR-9j6CY4Rw2adKUFtrNzf8DigppR8fK1.svg" isMerged="true" [V0_FILE]xml:file="public/pieces/wP.svg" url="https://blobs.vusercontent.net/blob/wP-ryutPZNqkBfnHQvSzoW8RMjcOl6y0O.svg" isMerged="true" [V0_FILE]typescriptreact:file="components/chess-piece.tsx" isEdit="true" isMerged="true" import { cn } from "@/lib/utils" import type { Piece } from "@/lib/types" import Image from "next/image" interface ChessPieceProps { piece: Piece isSelected?: boolean } export function ChessPiece({ piece, isSelected }: ChessPieceProps) { const pieceImage = getPieceImage(piece.type, piece.color) return (

) } function getPieceImage(type: Piece["type"], color: Piece["color"]) { const prefix = color === "white" ? "w" : "b" switch (type) { case "king": return `/pieces/${prefix}K.svg` case "general": return `/pieces/${prefix}Q.svg` case "elephant": return `/pieces/${prefix}B.svg` case "horse": return `/pieces/${prefix}N.svg` case "chariot": return `/pieces/${prefix}R.svg` case "pawn": return `/pieces/${prefix}P.svg` } } [V0_FILE]typescriptreact:file="components/deployment-panel.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Badge } from "@/components/ui/badge" import type { GameState, PieceType } from "@/lib/types" import Image from "next/image" import { cn } from "@/lib/utils" interface DeploymentPanelProps { gameState: GameState selectedPiece: PieceType | null onPieceSelect: (pieceType: PieceType) => void } export function DeploymentPanel({ gameState, selectedPiece, onPieceSelect }: DeploymentPanelProps) { const currentPlayerPieces = gameState.currentPlayer === "white" ? gameState.deploymentPieces.white : gameState.deploymentPieces.black const getPieceImage = (type: PieceType, color: "white" | "black") => { const colorPrefix = color === "white" ? "w" : "b" const pieceMap: Record = { king: "K", general: "Q", elephant: "B", horse: "N", chariot: "R", pawn: "P", } return `/pieces/${colorPrefix}${pieceMap[type]}.svg` } const getPieceName = (type: PieceType) => { switch (type) { case "king": return "King" case "general": return "General" case "elephant": return "Elephant" case "horse": return "Horse" case "chariot": return "Chariot" default: return type } } // Count pieces by type const pieceCounts = currentPlayerPieces.reduce( (acc, piece) => { acc[piece] = (acc[piece] || 0) + 1 return acc }, {} as Record, ) const uniquePieces = Array.from(new Set(currentPlayerPieces)) return ( {"Deployment Phase"} {gameState.currentPlayer === "white" ? "White" : "Black"} {"Select a piece, then click on the board to place it"} {uniquePieces.length === 0 ? (

{"All pieces placed! Waiting for opponent..."}

) : ( uniquePieces.map((pieceType) => { const pieceImage = getPieceImage(pieceType, gameState.currentPlayer) const count = pieceCounts[pieceType] const isSelected = selectedPiece === pieceType return ( ) }) )}

{"Place your pieces in your back two ranks. Choose your setup strategically!"}

) } [V0_FILE]typescriptreact:file="lib/ai-engine.ts" isEdit="true" isQuickEdit="true" isMerged="true" import type { GameState, Position, Piece, PieceColor, Difficulty } from "./types" import { calculateLegalMoves, makeMove, isInCheck, isCheckmate, isOnDiagonalLine } from "./game-logic" interface Move { from: Position to: Position score?: number } // Get all legal moves for a color export function getAllLegalMoves(gameState: GameState, color: PieceColor): Move[] { const moves: Move[] = [] const board = gameState.board for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === color) { const legalMoves = calculateLegalMoves(board, { row, col }, gameState) for (const to of legalMoves) { moves.push({ from: { row, col }, to }) } } } } return moves } // Main AI move selection function export function getAIMove(gameState: GameState): Move | null { const { aiDifficulty, currentPlayer } = gameState switch (aiDifficulty) { case "easy": return getEasyMove(gameState, currentPlayer) case "normal": return getNormalMove(gameState, currentPlayer) case "hard": return getHardMove(gameState, currentPlayer) default: return getEasyMove(gameState, currentPlayer) } } // Easy mode: Random legal move function getEasyMove(gameState: GameState, color: PieceColor): Move | null { const moves = getAllLegalMoves(gameState, color) if (moves.length === 0) return null return moves[Math.floor(Math.random() * moves.length)] } // Normal mode: Basic heuristic evaluation function getNormalMove(gameState: GameState, color: PieceColor): Move | null { const moves = getAllLegalMoves(gameState, color) if (moves.length === 0) return null // Evaluate each move let bestMove = moves[0] let bestScore = Number.NEGATIVE_INFINITY for (const move of moves) { const score = evaluateMoveNormal(gameState, move, color) if (score > bestScore) { bestScore = score bestMove = move } } return bestMove } // Evaluate a move for normal difficulty function evaluateMoveNormal(gameState: GameState, move: Move, color: PieceColor): number { const board = gameState.board const piece = board[move.from.row][move.from.col] const targetPiece = board[move.to.row][move.to.col] let score = 0 // Capture value if (targetPiece) { score += getPieceValue(targetPiece.type) * 10 } // Center control bonus const centerDistance = Math.abs(move.to.row - 3.5) + Math.abs(move.to.col - 3.5) score += (7 - centerDistance) * 2 // Piece development (move pieces forward) if (piece) { const forwardProgress = color === "white" ? move.from.row - move.to.row : move.to.row - move.from.row if (forwardProgress > 0) { score += forwardProgress * 3 } } // Protect king (stay near king) const kingPos = findKing(board, color) if (kingPos) { const distanceToKing = Math.abs(move.to.row - kingPos.row) + Math.abs(move.to.col - kingPos.col) if (distanceToKing <= 2) { score += 5 } } // Diagonal line bonus for pawns (promotion potential) if (piece?.type === "pawn" && isOnDiagonalLine(move.to)) { score += 15 } // Random factor for variety score += Math.random() * 5 return score } // Hard mode: Minimax with alpha-beta pruning function getHardMove(gameState: GameState, color: PieceColor): Move | null { const depth = 3 // Search depth const moves = getAllLegalMoves(gameState, color) if (moves.length === 0) return null let bestMove = moves[0] let bestScore = Number.NEGATIVE_INFINITY let alpha = Number.NEGATIVE_INFINITY const beta = Number.POSITIVE_INFINITY for (const move of moves) { const newBoard = makeMove(gameState.board, move.from, move.to) const newGameState = { ...gameState, board: newBoard } const score = minimax(newGameState, depth - 1, alpha, beta, false, color) if (score > bestScore) { bestScore = score bestMove = move } alpha = Math.max(alpha, score) } return bestMove } // Minimax algorithm with alpha-beta pruning function minimax( gameState: GameState, depth: number, alpha: number, beta: number, isMaximizing: boolean, aiColor: PieceColor, ): number { const currentColor = isMaximizing ? aiColor : aiColor === "white" ? "black" : "white" // Terminal conditions if (depth === 0) { return evaluatePosition(gameState, aiColor) } if (isCheckmate(gameState.board, currentColor, gameState)) { return isMaximizing ? -10000 : 10000 } const moves = getAllLegalMoves(gameState, currentColor) if (moves.length === 0) { return 0 // Stalemate } if (isMaximizing) { let maxScore = Number.NEGATIVE_INFINITY for (const move of moves) { const newBoard = makeMove(gameState.board, move.from, move.to) const newGameState = { ...gameState, board: newBoard } const score = minimax(newGameState, depth - 1, alpha, beta, false, aiColor) maxScore = Math.max(maxScore, score) alpha = Math.max(alpha, score) if (beta <= alpha) { break // Beta cutoff } } return maxScore } else { let minScore = Number.POSITIVE_INFINITY for (const move of moves) { const newBoard = makeMove(gameState.board, move.from, move.to) const newGameState = { ...gameState, board: newBoard } const score = minimax(newGameState, depth - 1, alpha, beta, true, aiColor) minScore = Math.min(minScore, score) beta = Math.min(beta, score) if (beta <= alpha) { break // Alpha cutoff } } return minScore } } // Evaluate the current position function evaluatePosition(gameState: GameState, aiColor: PieceColor): number { const board = gameState.board const opponentColor: PieceColor = aiColor === "white" ? "black" : "white" let score = 0 // Material count const aiMaterial = getMaterialValue(board, aiColor) const opponentMaterial = getMaterialValue(board, opponentColor) score += (aiMaterial - opponentMaterial) * 100 // Piece positioning for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece) { const positionValue = getPiecePositionValue(piece, { row, col }) score += piece.color === aiColor ? positionValue : -positionValue } } } // King safety const aiKingPos = findKing(board, aiColor) const opponentKingPos = findKing(board, opponentColor) if (aiKingPos) { score += evaluateKingSafety(board, aiKingPos, aiColor) * 10 } if (opponentKingPos) { score -= evaluateKingSafety(board, opponentKingPos, opponentColor) * 10 } // Check bonus if (isInCheck(board, opponentColor)) { score += 50 } if (isInCheck(board, aiColor)) { score -= 50 } return score } // Get total material value for a color function getMaterialValue(board: (Piece | null)[][], color: PieceColor): number { let value = 0 for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.color === color) { value += getPieceValue(piece.type) } } } return value } // Get piece value function getPieceValue(type: Piece["type"]): number { const values: Record = { king: 0, // King is invaluable general: 3, elephant: 3, horse: 3, chariot: 5, pawn: 1, } return values[type] } // Get piece position value (center control, advancement) function getPiecePositionValue(piece: Piece, position: Position): number { let value = 0 // Center control bonus const centerDistance = Math.abs(position.row - 3.5) + Math.abs(position.col - 3.5) value += (7 - centerDistance) * 0.5 // Advancement bonus for pawns if (piece.type === "pawn") { const advancement = piece.color === "white" ? 7 - position.row : position.row value += advancement * 0.3 // Diagonal line bonus if (isOnDiagonalLine(position)) { value += 2 } } return value } // Evaluate king safety function evaluateKingSafety(board: (Piece | null)[][], kingPos: Position, color: PieceColor): number { let safety = 0 // Count friendly pieces near king for (let dr = -1; dr <= 1; dr++) { for (let dc = -1; dc <= 1; dc++) { if (dr === 0 && dc === 0) continue const row = kingPos.row + dr const col = kingPos.col + dc if (row >= 0 && row < 8 && col >= 0 && col < 8) { const piece = board[row][col] if (piece && piece.color === color) { safety += 1 } } } } return safety } // Find king position function findKing(board: (Piece | null)[][], color: PieceColor): Position | null { for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const piece = board[row][col] if (piece && piece.type === "king" && piece.color === color) { return { row, col } } } } return null } // Get AI deployment move (for deployment phase) export function getAIDeploymentMove( gameState: GameState, availablePieces: Piece["type"][], ): { pieceType: Piece["type"]; position: Position } | null { const color = gameState.currentPlayer const validRows = color === "white" ? [6, 7] : [0, 1] // Get all empty squares in valid rows const emptySquares: Position[] = [] for (const row of validRows) { for (let col = 0; col < 8; col++) { if (!gameState.board[row][col]) { emptySquares.push({ row, col }) } } } if (emptySquares.length === 0 || availablePieces.length === 0) return null // Strategic placement priorities const pieceType = availablePieces[0] let bestPosition: Position if (pieceType === "king") { // Place king in center back row for safety const backRow = color === "white" ? 7 : 0 const centerSquares = emptySquares.filter((pos) => pos.row === backRow && pos.col >= 3 && pos.col <= 4) bestPosition = centerSquares.length > 0 ? centerSquares[0] : emptySquares[0] } else if (pieceType === "chariot") { // Place chariots on corners or near corners const cornerSquares = emptySquares.filter((pos) => pos.col === 0 || pos.col === 7) bestPosition = cornerSquares.length > 0 ? cornerSquares[0] : emptySquares[0] } else if (pieceType === "horse") { // Place horses near center const centerSquares = emptySquares.filter((pos) => pos.col >= 2 && pos.col <= 5) bestPosition = centerSquares.length > 0 ? centerSquares[0] : emptySquares[0] } else { // Default: random placement bestPosition = emptySquares[Math.floor(Math.random() * emptySquares.length)] } return { pieceType, position: bestPosition } } export function getHintMove(gameState: GameState): { from: Position; to: Position } | null { // Use normal difficulty AI to suggest a good move const tempGameState = { ...gameState, aiDifficulty: "normal" as Difficulty } return getNormalMove(tempGameState, gameState.currentPlayer) } [V0_FILE]typescriptreact:file="components/game-setup.tsx" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import type { Difficulty, PieceColor, GameMode } from "@/lib/types" import { Users, Bot, Crown } from "lucide-react" interface GameSetupProps { onStartGame: (mode: GameMode, difficulty: Difficulty, humanColor: PieceColor) => void } export function GameSetup({ onStartGame }: GameSetupProps) { const handlePvP = () => { onStartGame("pvp", "normal", "white") } const handlePvE = (difficulty: Difficulty, humanColor: PieceColor) => { onStartGame("pve", difficulty, humanColor) } return (

Sittuyin

Traditional Burmese Chess

{/* Player vs Player */}

Player vs Player

Play against a friend on the same device

{/* Player vs AI */}

Player vs AI

Challenge the computer opponent

Choose Difficulty:

Play as:

New to Sittuyin? Start the game and click the tutorial button to learn the rules.

) } [V0_FILE]typescriptreact:file="components/game-controls.tsx" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Undo, Lightbulb } from "lucide-react" interface GameControlsProps { onUndo: () => void onHint: () => void canUndo: boolean showHint: boolean } export function GameControls({ onUndo, onHint, canUndo, showHint }: GameControlsProps) { return ( Game Controls {showHint && ( )}

{showHint ? "Use hints to learn better strategies" : "Undo to take back your last move"}

) } [V0_FILE]typescriptreact:file="lib/types.ts" isEdit="true" isMerged="true" export type PieceType = "king" | "general" | "elephant" | "horse" | "chariot" | "pawn" export type PieceColor = "white" | "black" export type GamePhase = "deployment" | "play" | "finished" export type Difficulty = "easy" | "normal" | "hard" export type GameMode = "pvp" | "pve" export interface Piece { type: PieceType color: PieceColor } export interface Position { row: number col: number } export interface GameStateSnapshot { board: (Piece | null)[][] currentPlayer: PieceColor whiteGeneral: Position | null blackGeneral: Position | null isCheck: boolean deploymentPieces: { white: PieceType[] black: PieceType[] } phase: GamePhase } export interface GameState { phase: GamePhase currentPlayer: PieceColor board: (Piece | null)[][] selectedSquare: Position | null legalMoves: Position[] whiteGeneral: Position | null blackGeneral: Position | null isCheck: boolean winner: PieceColor | null deploymentPieces: { white: PieceType[] black: PieceType[] } gameMode: GameMode aiDifficulty: Difficulty humanColor: PieceColor moveHistory: Array<{ from: Position; to: Position; piece: Piece }> stateHistory: GameStateSnapshot[] hintMove: { from: Position; to: Position } | null lastMove: { from: Position; to: Position } | null } [V0_FILE]typescriptreact:file="components/game-board.tsx" isEdit="true" isMerged="true" "use client" import { cn } from "@/lib/utils" import type { GameState, Position, PieceType } from "@/lib/types" import { ChessPiece } from "./chess-piece" import { getValidDeploymentSquares } from "@/lib/deployment" interface GameBoardProps { gameState: GameState onSquareClick: (position: Position) => void selectedDeploymentPiece?: PieceType | null } export function GameBoard({ gameState, onSquareClick, selectedDeploymentPiece }: GameBoardProps) { const { board, selectedSquare, legalMoves, phase, currentPlayer, lastMove, hintMove } = gameState const validDeploymentSquares = phase === "deployment" && selectedDeploymentPiece ? getValidDeploymentSquares(board, currentPlayer) : [] const isLegalMove = (row: number, col: number) => { return legalMoves.some((move) => move.row === row && move.col === col) } const isValidDeployment = (row: number, col: number) => { return validDeploymentSquares.some((pos) => pos.row === row && pos.col === col) } const isSelected = (row: number, col: number) => { return selectedSquare?.row === row && selectedSquare?.col === col } const isLastMove = (row: number, col: number) => { if (!lastMove) return false return ( (lastMove.from.row === row && lastMove.from.col === col) || (lastMove.to.row === row && lastMove.to.col === col) ) } const isHintMove = (row: number, col: number) => { if (!hintMove) return false return ( (hintMove.from.row === row && hintMove.from.col === col) || (hintMove.to.row === row && hintMove.to.col === col) ) } const isDiagonalLine = (row: number, col: number) => { if (row === col) return true if (row + col === 7) return true return false } return (

{board.map((row, rowIndex) => row.map((piece, colIndex) => { const isOnDiagonal = isDiagonalLine(rowIndex, colIndex) return ( ) }), )}

{["8", "7", "6", "5", "4", "3", "2", "1"].map((label) => (

{label}

))}

{["a", "b", "c", "d", "e", "f", "g", "h"].map((label) => (

{label}

))}

) } [V0_FILE]typescriptreact:file="components/sittuyin-game.tsx" isEdit="true" isMerged="true" "use client" import { useState, useEffect } from "react" import { GameBoard } from "./game-board" import { GameHeader } from "./game-header" import { GameInfo } from "./game-info" import { TutorialDialog } from "./tutorial-dialog" import { PromotionDialog } from "./promotion-dialog" import { DeploymentPanel } from "./deployment-panel" import { GameOverDialog } from "./game-over-dialog" import { GameSetup } from "./game-setup" import { GameControls } from "./game-controls" import type { GameState, Position, PieceType, GameMode, Difficulty, PieceColor, GameStateSnapshot } from "@/lib/types" import { calculateLegalMoves, makeMove, isInCheck, isCheckmate, canPromote, promotePawn } from "@/lib/game-logic" import { initializeBoardWithPawns, getDeploymentPieces, isValidDeploymentPosition, placePiece, isDeploymentComplete, } from "@/lib/deployment" import { getAIMove, getAIDeploymentMove, getHintMove } from "@/lib/ai-engine" export function SittuyinGame() { const [showSetup, setShowSetup] = useState(true) const [gameState, setGameState] = useState({ phase: "deployment", currentPlayer: "white", board: initializeBoardWithPawns(), selectedSquare: null, legalMoves: [], whiteGeneral: null, blackGeneral: null, isCheck: false, winner: null, deploymentPieces: { white: getDeploymentPieces(), black: getDeploymentPieces(), }, gameMode: "pvp", aiDifficulty: "normal", humanColor: "white", moveHistory: [], stateHistory: [], hintMove: null, lastMove: null, }) const [showTutorial, setShowTutorial] = useState(false) const [showGameOver, setShowGameOver] = useState(false) const [promotionPosition, setPromotionPosition] = useState(null) const [selectedDeploymentPiece, setSelectedDeploymentPiece] = useState(null) const [isAIThinking, setIsAIThinking] = useState(false) useEffect(() => { if ( gameState.gameMode === "pve" && gameState.currentPlayer !== gameState.humanColor && !gameState.winner && !isAIThinking ) { setIsAIThinking(true) // Add delay for better UX setTimeout(() => { if (gameState.phase === "deployment") { handleAIDeployment() } else if (gameState.phase === "play") { handleAIMove() } setIsAIThinking(false) }, 500) } }, [gameState.currentPlayer, gameState.phase, gameState.gameMode]) const saveStateSnapshot = () => { const snapshot: GameStateSnapshot = { board: gameState.board.map((row) => [...row]), currentPlayer: gameState.currentPlayer, whiteGeneral: gameState.whiteGeneral, blackGeneral: gameState.blackGeneral, isCheck: gameState.isCheck, deploymentPieces: { white: [...gameState.deploymentPieces.white], black: [...gameState.deploymentPieces.black], }, phase: gameState.phase, } return snapshot } const handleAIDeployment = () => { const currentPlayerPieces = gameState.currentPlayer === "white" ? gameState.deploymentPieces.white : gameState.deploymentPieces.black const aiMove = getAIDeploymentMove(gameState, currentPlayerPieces) if (!aiMove) return const snapshot = saveStateSnapshot() const newBoard = placePiece(gameState.board, aiMove.position, aiMove.pieceType, gameState.currentPlayer) const pieceIndex = currentPlayerPieces.indexOf(aiMove.pieceType) const newPieces = [...currentPlayerPieces] newPieces.splice(pieceIndex, 1) const newDeploymentPieces = { ...gameState.deploymentPieces, [gameState.currentPlayer]: newPieces, } let whiteGeneral = gameState.whiteGeneral let blackGeneral = gameState.blackGeneral if (aiMove.pieceType === "general") { if (gameState.currentPlayer === "white") { whiteGeneral = aiMove.position } else { blackGeneral = aiMove.position } } const deploymentComplete = isDeploymentComplete(newDeploymentPieces.white, newDeploymentPieces.black) setGameState({ ...gameState, board: newBoard, currentPlayer: gameState.currentPlayer === "white" ? "black" : "white", deploymentPieces: newDeploymentPieces, phase: deploymentComplete ? "play" : "deployment", whiteGeneral, blackGeneral, stateHistory: [...gameState.stateHistory, snapshot], }) } const handleAIMove = () => { const aiMove = getAIMove(gameState) if (!aiMove) return const newBoard = makeMove(gameState.board, aiMove.from, aiMove.to) const movedPiece = newBoard[aiMove.to.row][aiMove.to.col] // Handle promotion if (movedPiece && canPromote(aiMove.to, movedPiece, gameState)) { const promotedBoard = promotePawn(newBoard, aiMove.to) executeMove(aiMove.from, aiMove.to, promotedBoard, true) } else { executeMove(aiMove.from, aiMove.to, newBoard, true) } } const executeMove = (from: Position, to: Position, newBoard: (any | null)[][], isAIMove = false) => { const snapshot = saveStateSnapshot() const movedPiece = newBoard[to.row][to.col] let whiteGeneral = gameState.whiteGeneral let blackGeneral = gameState.blackGeneral const capturedPiece = gameState.board[to.row][to.col] if (capturedPiece?.type === "general") { if (capturedPiece.color === "white") { whiteGeneral = null } else { blackGeneral = null } } if (movedPiece?.type === "general") { if (movedPiece.color === "white") { whiteGeneral = to } else { blackGeneral = to } } const nextPlayer = gameState.currentPlayer === "white" ? "black" : "white" const inCheck = isInCheck(newBoard, nextPlayer) const newGameState: GameState = { ...gameState, board: newBoard, currentPlayer: nextPlayer, selectedSquare: null, legalMoves: [], whiteGeneral, blackGeneral, isCheck: inCheck, winner: null, moveHistory: [...gameState.moveHistory, { from, to, piece: movedPiece }], stateHistory: [...gameState.stateHistory, snapshot], hintMove: null, lastMove: isAIMove ? { from, to } : null, } const inCheckmate = isCheckmate(newBoard, nextPlayer, newGameState) if (inCheckmate) { newGameState.winner = gameState.currentPlayer newGameState.phase = "finished" setShowGameOver(true) } setGameState(newGameState) } const handleSquareClick = (position: Position) => { if (gameState.gameMode === "pve" && gameState.currentPlayer !== gameState.humanColor) { return } if (gameState.phase === "deployment") { if (!selectedDeploymentPiece) return if (isValidDeploymentPosition(position, gameState.currentPlayer, gameState.board)) { const snapshot = saveStateSnapshot() const newBoard = placePiece(gameState.board, position, selectedDeploymentPiece, gameState.currentPlayer) const currentPlayerPieces = gameState.currentPlayer === "white" ? gameState.deploymentPieces.white : gameState.deploymentPieces.black const pieceIndex = currentPlayerPieces.indexOf(selectedDeploymentPiece) const newPieces = [...currentPlayerPieces] newPieces.splice(pieceIndex, 1) const newDeploymentPieces = { ...gameState.deploymentPieces, [gameState.currentPlayer]: newPieces, } let whiteGeneral = gameState.whiteGeneral let blackGeneral = gameState.blackGeneral if (selectedDeploymentPiece === "general") { if (gameState.currentPlayer === "white") { whiteGeneral = position } else { blackGeneral = position } } const deploymentComplete = isDeploymentComplete(newDeploymentPieces.white, newDeploymentPieces.black) setGameState({ ...gameState, board: newBoard, currentPlayer: gameState.currentPlayer === "white" ? "black" : "white", deploymentPieces: newDeploymentPieces, phase: deploymentComplete ? "play" : "deployment", whiteGeneral, blackGeneral, stateHistory: [...gameState.stateHistory, snapshot], }) setSelectedDeploymentPiece(null) } return } if (gameState.phase !== "play" || gameState.winner) return const clickedPiece = gameState.board[position.row][position.col] if (gameState.selectedSquare) { const isLegalMove = gameState.legalMoves.some((move) => move.row === position.row && move.col === position.col) if (isLegalMove) { const newBoard = makeMove(gameState.board, gameState.selectedSquare, position) const movedPiece = newBoard[position.row][position.col] if (movedPiece && canPromote(position, movedPiece, gameState)) { setPromotionPosition(position) } executeMove(gameState.selectedSquare, position, newBoard, false) } else if (clickedPiece && clickedPiece.color === gameState.currentPlayer) { const legalMoves = calculateLegalMoves(gameState.board, position, gameState) setGameState({ ...gameState, selectedSquare: position, legalMoves, }) } else { setGameState({ ...gameState, selectedSquare: null, legalMoves: [], }) } } else { if (clickedPiece && clickedPiece.color === gameState.currentPlayer) { const legalMoves = calculateLegalMoves(gameState.board, position, gameState) setGameState({ ...gameState, selectedSquare: position, legalMoves, }) } } } const handlePromotion = () => { if (!promotionPosition) return const newBoard = promotePawn(gameState.board, promotionPosition) const piece = newBoard[promotionPosition.row][promotionPosition.col] let whiteGeneral = gameState.whiteGeneral let blackGeneral = gameState.blackGeneral if (piece?.color === "white") { whiteGeneral = promotionPosition } else if (piece?.color === "black") { blackGeneral = promotionPosition } setGameState({ ...gameState, board: newBoard, whiteGeneral, blackGeneral, }) setPromotionPosition(null) } const handleDeploymentPieceSelect = (pieceType: PieceType) => { setSelectedDeploymentPiece(pieceType) } const handleUndo = () => { if (gameState.stateHistory.length === 0) return const movesToUndo = gameState.gameMode === "pve" ? 2 : 1 const newHistoryLength = Math.max(0, gameState.stateHistory.length - movesToUndo) const newHistory = gameState.stateHistory.slice(0, newHistoryLength) if (newHistoryLength === 0) { // Reset to initial state setGameState({ ...gameState, phase: "deployment", currentPlayer: "white", board: initializeBoardWithPawns(), selectedSquare: null, legalMoves: [], whiteGeneral: null, blackGeneral: null, isCheck: false, deploymentPieces: { white: getDeploymentPieces(), black: getDeploymentPieces(), }, stateHistory: [], moveHistory: [], hintMove: null, lastMove: null, }) setSelectedDeploymentPiece(null) } else { const previousState = gameState.stateHistory[newHistoryLength - 1] setGameState({ ...gameState, board: previousState.board.map((row) => [...row]), currentPlayer: previousState.currentPlayer, whiteGeneral: previousState.whiteGeneral, blackGeneral: previousState.blackGeneral, isCheck: previousState.isCheck, deploymentPieces: { white: [...previousState.deploymentPieces.white], black: [...previousState.deploymentPieces.black], }, phase: previousState.phase, stateHistory: newHistory, selectedSquare: null, legalMoves: [], hintMove: null, lastMove: null, }) } } const handleHint = () => { const hint = getHintMove(gameState) if (hint) { setGameState({ ...gameState, hintMove: hint, selectedSquare: hint.from, legalMoves: [hint.to], }) // Clear hint after 3 seconds setTimeout(() => { setGameState((prev) => ({ ...prev, hintMove: null, selectedSquare: null, legalMoves: [], })) }, 3000) } } const handleStartGame = (mode: GameMode, difficulty: Difficulty, humanColor: PieceColor) => { setGameState({ phase: "deployment", currentPlayer: "white", board: initializeBoardWithPawns(), selectedSquare: null, legalMoves: [], whiteGeneral: null, blackGeneral: null, isCheck: false, winner: null, deploymentPieces: { white: getDeploymentPieces(), black: getDeploymentPieces(), }, gameMode: mode, aiDifficulty: difficulty, humanColor: humanColor, moveHistory: [], stateHistory: [], hintMove: null, lastMove: null, }) setShowSetup(false) } const handleNewGame = () => { setShowSetup(true) setSelectedDeploymentPiece(null) setPromotionPosition(null) setShowGameOver(false) } if (showSetup) { return } const canUndo = gameState.stateHistory.length > 0 && gameState.phase !== "finished" && !isAIThinking return (

setShowTutorial(true)} onNewGame={handleNewGame} />

{gameState.phase === "play" && ( )} {gameState.phase === "deployment" && ( )}

setPromotionPosition(null)} /> setShowGameOver(false)} />

) } [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" import type React from "react" import type { Metadata } from "next" import { GeistSans } from "geist/font/sans" import { GeistMono } from "geist/font/mono" import { Playfair_Display } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import { Suspense } from "react" import "./globals.css" const playfair = Playfair_Display({ subsets: ["latin"], variable: "--font-playfair", display: "swap", }) export const metadata: Metadata = { title: { default: "Sittuyin - Traditional Burmese Chess Game Online", template: "%s | Sittuyin Chess", }, description: "Play Sittuyin online, the ancient chess variant from Myanmar. Experience authentic Burmese chess with unique deployment phase, traditional rules, and AI opponent. Learn strategic gameplay from Burma's rich chess heritage.", keywords: [ "Sittuyin", "Burmese chess", "Myanmar chess", "traditional chess", "chess variant", "online chess game", "strategic board game", "Asian chess", "chess deployment phase", "sit-ke-myin", "Burma chess", ], authors: [{ name: "Sittuyin Chess" }], creator: "Sittuyin Chess", publisher: "Sittuyin Chess", formatDetection: { email: false, address: false, telephone: false, }, metadataBase: new URL("https://sittuyin-chess.vercel.app"), alternates: { canonical: "/", }, openGraph: { title: "Sittuyin - Traditional Burmese Chess Game Online", description: "Play authentic Sittuyin, the traditional chess variant from Myanmar. Experience unique deployment phase, strategic gameplay, and rich cultural heritage.", url: "https://sittuyin-chess.vercel.app", siteName: "Sittuyin Chess", locale: "en_US", type: "website", images: [ { url: "/og-image.png", width: 1200, height: 630, alt: "Sittuyin - Traditional Burmese Chess", }, ], }, twitter: { card: "summary_large_image", title: "Sittuyin - Traditional Burmese Chess Game Online", description: "Play authentic Sittuyin, the traditional chess variant from Myanmar with unique deployment phase and strategic gameplay.", images: ["/og-image.png"], }, robots: { index: true, follow: true, googleBot: { index: true, follow: true, "max-video-preview": -1, "max-image-preview": "large", "max-snippet": -1, }, }, verification: { google: "your-google-verification-code", yandex: "your-yandex-verification-code", }, category: "games", generator: "v0.app", } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" import { SittuyinGame } from "@/components/sittuyin-game" export default function Home() { const jsonLd = { "@context": "https://schema.org", "@type": "Game", name: "Sittuyin - Traditional Burmese Chess", description: "Play Sittuyin online, the ancient chess variant from Myanmar featuring unique deployment phase and traditional rules.", url: "https://sittuyin-chess.vercel.app", gamePlatform: "Web Browser", genre: ["Strategy", "Board Game", "Chess Variant"], numberOfPlayers: { "@type": "QuantitativeValue", minValue: 1, maxValue: 2, }, playMode: ["SinglePlayer", "MultiPlayer"], applicationCategory: "Game", operatingSystem: "Any", offers: { "@type": "Offer", price: "0", priceCurrency: "USD", availability: "https://schema.org/InStock", }, aggregateRating: { "@type": "AggregateRating", ratingValue: "4.8", ratingCount: "150", bestRating: "5", worstRating: "1", }, inLanguage: "en", keywords: "Sittuyin, Burmese chess, Myanmar chess, traditional chess, chess variant, strategic board game", } return ( <>

Sittuyin

{"Origin & History"}

{"Key Differences from International Chess"}

{"Game Duration"}

{"1. Deployment Phase (Sit-tee)"}

{"2. Pawn Promotion"}

{"3. Winning Conditions"}

{"4. Special Rules"}

{"Deployment Strategy"}

{"Opening Principles"}

{"Tactical Considerations"}

{name}

Sittuyin

Player vs Player

Player vs AI

About

Tags

Share

About

Tags

Share

More from shinekyaw

More Templates Like This

About

Tags

Share

About

Tags

Share

More from shinekyaw

More Templates Like This