From fbadf1d4362d89fcb21f843e65153a302071ddb4 Mon Sep 17 00:00:00 2001
From: satr14 <admin@satr14.my.id>
Date: Sat, 25 Jul 2026 15:21:30 +0700
Subject: [PATCH 1/4] add dump button

---
 src/routes/+page.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index bd4c54e..5d191f0 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -25,4 +25,5 @@
     fen:
     <input type="text" onkeypress={(e) => e.key === 'Enter' && board.loadFEN(fen)} bind:value={fen} />
   </label>
+  <button onclick={() => console.log(board)}>dump game to console</button>
 </div>
\ No newline at end of file

From 3d7802fa6e5cff094b5fb81e57f62b4cfb902590 Mon Sep 17 00:00:00 2001
From: satr14 <admin@satr14.my.id>
Date: Sat, 25 Jul 2026 16:09:26 +0700
Subject: [PATCH 2/4] FEN parser

---
 src/lib/chess/utils.ts | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/lib/chess/utils.ts b/src/lib/chess/utils.ts
index c597548..6f2e7f8 100644
--- a/src/lib/chess/utils.ts
+++ b/src/lib/chess/utils.ts
@@ -5,6 +5,7 @@ import { Piece } from "./types";
 
 export const startFEN = "rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0";
 const CHAR_TO_PIECE: Record<string, number> = {
+  "-": Piece.EMPTY,
   "K": Piece.WHITE | Piece.KING,
   "Q": Piece.WHITE | Piece.QUEEN,
   "R": Piece.WHITE | Piece.ROOK,
@@ -31,13 +32,22 @@ export class Board {
     halfMove: 0,
     fullMove: 0,
   };
+  
   constructor() {
     this.loadFEN();
   }
 
   loadFEN(fen = startFEN) {
     const [position, turn, castling, enPassant, halfMove, fullMove] = fen.split(" ");
+    this.board.fill(Piece.EMPTY);
     
-    
+    position.split("/").forEach((row, rank) => {
+      let file = 0;
+      row.split("").forEach((char) => {
+        if (!isNaN(parseInt(char))) return file += parseInt(char);
+        this.board[rank * 8 + file] = CHAR_TO_PIECE[char]
+        file++;
+      });
+    });
   }
 }
\ No newline at end of file

From 86acb6b35052277d5ab75738140153b0e4effa48 Mon Sep 17 00:00:00 2001
From: satr14 <admin@satr14.my.id>
Date: Sat, 25 Jul 2026 16:09:43 +0700
Subject: [PATCH 3/4] view updater

---
 src/routes/+page.svelte | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 5d191f0..4eff4e1 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2,16 +2,22 @@
   import { Board, startFEN } from "$lib/chess/utils";
 
   const board = new Board();
+
+  let boardView = $state(Array.from(board.board));
   let showIndex = $state(false);
   let fen = $state(startFEN);
+
+  function updateView() {
+    boardView = Array.from(board.board);
+  }
 </script>
 
 <div class="grid grid-cols-8 gap-0 border-2">
-  {#each board.board as square, index}
+  {#each boardView as square, index}
     <div class="h-20 aspect-square flex justify-center items-center
       {index % 2 === Math.floor(index / 8) % 2 ? 'bg-orange-200 text-stone-800' : 'bg-amber-800 text-stone-200'}
     ">
-      {#if square}<img src="assets/{square}.svg" alt="p{square}" class="h-16 aspect-square"/>{/if}
+      {#if square}<img src="assets/{square}.svg" alt="p{square}" class="h-18 aspect-square"/>{/if}
       {showIndex ? index : ''}
     </div>
   {/each}
@@ -22,8 +28,9 @@
     <input type="checkbox" bind:checked={showIndex} />
   </label>
   <label class="block">
-    fen:
+    fen (enter to set):
     <input type="text" onkeypress={(e) => e.key === 'Enter' && board.loadFEN(fen)} bind:value={fen} />
   </label>
+  <button onclick={updateView}>update view</button>
   <button onclick={() => console.log(board)}>dump game to console</button>
 </div>
\ No newline at end of file

From ccd82c306e8f9fde42c56990ce2ede8ef646b8dd Mon Sep 17 00:00:00 2001
From: satr14 <admin@satr14.my.id>
Date: Sat, 25 Jul 2026 16:09:50 +0700
Subject: [PATCH 4/4] button styling

---
 src/routes/layout.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/routes/layout.css b/src/routes/layout.css
index e9704fd..46b5600 100644
--- a/src/routes/layout.css
+++ b/src/routes/layout.css
@@ -2,3 +2,5 @@
 
 html, body { @apply h-full; }
 body { @apply bg-gray-900 text-gray-100; }
+
+input, button { @apply bg-stone-200 text-stone-800 px-2 py-1 m-1 rounded; }
\ No newline at end of file