Skip to content

Commit 95fe073

Browse files
committed
Adding Day #49
1 parent 0aa632a commit 95fe073

20 files changed

+265
-0
lines changed

Day #49 - Chess Game/README.md

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
# Day #49
2+
3+
### Chess Game (VS Computer)
4+
In this tutorial ([Open in Youtube](https://youtu.be/XaFYLIEq4E8)), I am gonna showing to you how to code a chess game with javascript. in this javascript chess game you can play with computer, flip board and set position. in this code you will learn to use chessboardjs and chess.js library❗️
5+
6+
# FEN Notation
7+
8+
FEN (Forsyth-Edwards Notation) is a standard notation used to represent a particular chessboard position. It provides a concise and human-readable way to describe the placement of chess pieces on the board, as well as other important information about the position. Here's how FEN notation works:
9+
10+
A FEN string consists of six fields separated by spaces:
11+
12+
1. **Piece Placement (8 ranks)**: This field represents the positions of the pieces on the board. Each rank is represented by a series of characters, where:
13+
- `K` represents a white king.
14+
- `Q` represents a white queen.
15+
- `R` represents a white rook.
16+
- `B` represents a white bishop.
17+
- `N` represents a white knight.
18+
- `P` represents a white pawn.
19+
- `k` represents a black king.
20+
- `q` represents a black queen.
21+
- `r` represents a black rook.
22+
- `b` represents a black bishop.
23+
- `n` represents a black knight.
24+
- `p` represents a black pawn.
25+
- Digits (1-8) represent empty squares, with the number indicating the count of consecutive empty squares.
26+
27+
For example, `rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR` represents the starting position of a chess game.
28+
29+
2. **Active Color (1 character)**: This field indicates which player's turn it is to move. `w` represents White's turn, and `b` represents Black's turn.
30+
31+
3. **Castling Availability (1-4 characters)**: This field indicates whether castling is still available for each player. The characters used are:
32+
- `K` for White kingside castling.
33+
- `Q` for White queenside castling.
34+
- `k` for Black kingside castling.
35+
- `q` for Black queenside castling.
36+
- `-` if no castling is possible.
37+
38+
4. **En Passant Target Square (1-2 characters)**: If a pawn has just moved two squares forward from its starting position, this field represents the square where the opposing pawn can capture en passant. Otherwise, it is represented as `-`.
39+
40+
5. **Halfmove Clock (1-2 characters)**: This field represents the number of half-moves (ply) since the last pawn move or capture. It is used for the fifty-move rule.
41+
42+
6. **Fullmove Number (1-2 characters)**: This field represents the number of full moves (complete turns) in the game. It starts at 1 and is incremented after Black's move.
43+
44+
Here's an example FEN string:
45+
```
46+
rnbqkb1r/ppp1pppp/5n2/3p4/3P4/8/PPP2PPP/RNBQKBNR w KQkq - 0 4
47+
```
48+
This FEN represents a specific board position where it's White's turn to move, both sides have the potential to castle kingside and queenside, there's no en passant target square, the halfmove clock is 0, and the fullmove number is 4.
49+
50+
You can use FEN notation to record and share specific chess positions and use them for various purposes, including setting up custom positions for analysis or practice.
51+
52+
# Screenshot
53+
Here we have project screenshot :
54+
55+
![screenshot](screenshot.jpg)

Day #49 - Chess Game/css/chessboard-1.0.0.min.css

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading
Loading

Day #49 - Chess Game/index.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<link rel="stylesheet" href="style.css">
8+
<link rel="stylesheet" href="css/chessboard-1.0.0.min.css">
9+
<title>Day #49 - Chess Game | AsmrProg</title>
10+
</head>
11+
12+
<body>
13+
14+
<div class="container">
15+
<h1>AsmrProg Chess Game</h1>
16+
<div class="board" id="board"></div>
17+
<div class="buttons">
18+
<button class="play-again">Play Again</button>
19+
<button class="set-pos">Set Position</button>
20+
<button class="flip-board">Flip Board</button>
21+
</div>
22+
<div id="move-history" class="move-history"></div>
23+
</div>
24+
25+
26+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
27+
<script src="js/chessboard-1.0.0.min.js"></script>
28+
<script src="https://cdnjs.cloudflare.com/ajax/libs/chess.js/0.10.3/chess.min.js"></script>
29+
<script src="script.js"></script>
30+
</body>
31+
32+
</html>

Day #49 - Chess Game/js/chessboard-1.0.0.min.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Day #49 - Chess Game/screenshot.jpg

136 KB
Loading

0 commit comments

Comments
 (0)