satr14/chess-framework
Watch
1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

piece display

Browse source
This commit is contained in:
Satria 2026-07-25 09:23:44 +07:00
commit 014d170e6a
16 changed files with 75 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/lib/chess/types.ts Normal file
View file

@ -0,0 +1,12 @@
export enum Piece {
EMPTY = 0,
KING = 1,
QUEEN = 2,
ROOK = 3,
BISHOP = 4,
KNIGHT = 5,
PAWN = 6,
WHITE = 8,
BLACK = 16,
}

48
src/lib/chess/utils.ts Normal file
View file

@ -0,0 +1,48 @@
import { Piece } from "./types";
// export function fen2array(fen: string): Int8Array<ArrayBuffer> {
// }
export class Board {
public board: Int8Array;
constructor() {
const board = new Int8Array(8**2);
board[0] = Piece.WHITE | Piece.ROOK;
board[1] = Piece.WHITE | Piece.KNIGHT;
board[2] = Piece.WHITE | Piece.BISHOP;
board[3] = Piece.WHITE | Piece.QUEEN;
board[4] = Piece.WHITE | Piece.KING;
board[5] = Piece.WHITE | Piece.BISHOP;
board[6] = Piece.WHITE | Piece.KNIGHT;
board[7] = Piece.WHITE | Piece.ROOK;
board[8] = Piece.WHITE | Piece.PAWN;
board[9] = Piece.WHITE | Piece.PAWN;
board[10] = Piece.WHITE | Piece.PAWN;
board[11] = Piece.WHITE | Piece.PAWN;
board[12] = Piece.WHITE | Piece.PAWN;
board[13] = Piece.WHITE | Piece.PAWN;
board[14] = Piece.WHITE | Piece.PAWN;
board[15] = Piece.WHITE | Piece.PAWN;
board[48] = Piece.BLACK | Piece.PAWN;
board[49] = Piece.BLACK | Piece.PAWN;
board[50] = Piece.BLACK | Piece.PAWN;
board[51] = Piece.BLACK | Piece.PAWN;
board[52] = Piece.BLACK | Piece.PAWN;
board[53] = Piece.BLACK | Piece.PAWN;
board[54] = Piece.BLACK | Piece.PAWN;
board[55] = Piece.BLACK | Piece.PAWN;
board[56] = Piece.BLACK | Piece.ROOK;
board[57] = Piece.BLACK | Piece.KNIGHT;
board[58] = Piece.BLACK | Piece.BISHOP;
board[59] = Piece.BLACK | Piece.QUEEN;
board[60] = Piece.BLACK | Piece.KING;
board[61] = Piece.BLACK | Piece.BISHOP;
board[62] = Piece.BLACK | Piece.KNIGHT;
board[63] = Piece.BLACK | Piece.ROOK;
this.board = board;
return this;
}
}

2
src/routes/+layout.svelte
View file

@ -6,6 +6,6 @@
</script>
<svelte:head><link rel="icon" href={favicon} /></svelte:head>
<div class="flex justify-center items-center min-h-full">
<div class="flex justify-center items-center gap-4 min-h-full">
{@render children()}
</div>

18
src/routes/+page.svelte
View file

@ -1,13 +1,23 @@
<script lang="ts">
const board = new Array(8**2);
import { Board } from "$lib/chess/utils";
const board = new Board();
let showIndex = $state(false);
</script>
<div class="grid grid-cols-8 gap-0 border-2">
{#each board as info, index}
{#each board.board as square, index}
<div class="h-20 aspect-square flex justify-center items-center
{index % 2 === Math.floor(index / 8) % 2 ? 'bg-stone-200 text-stone-800' : 'bg-stone-800 text-stone-200'}
{index % 2 === Math.floor(index / 8) % 2 ? 'bg-orange-200 text-stone-800' : 'bg-amber-800 text-stone-200'}
">
{index}
{#if square}<img src="assets/{square}.svg" alt="{square}" class="h-16 aspect-square"/>{/if}
{showIndex ? index : ''}
</div>
{/each}
</div>
<div>
<label>
show index
<input type="checkbox" bind:checked={showIndex} />
</label>
</div>