diff options
| -rw-r--r-- | public/index.html | 8 | ||||
| -rw-r--r-- | public/make_move.js | 90 | ||||
| -rw-r--r-- | public/move.js | 6 | ||||
| -rw-r--r-- | public/style.css | 20 |
4 files changed, 122 insertions, 2 deletions
diff --git a/public/index.html b/public/index.html index 13c6e49..7131784 100644 --- a/public/index.html +++ b/public/index.html @@ -98,6 +98,14 @@ </div> </div> </div> + + <div id="promotion-window"> + <div id="queen" class="piece-option">Q</div> + <div id="rook" class="piece-option">R</div> + <div id="bishop" class="piece-option">B</div> + <div id="knight" class="piece-option">N</div> + </div> + <script rel="preconnect" src="move.js" crossorigin></script> <script rel="preconnect" src="sync_board.js" crossorigin></script> <script rel="preconnect" src="make_move.js" crossorigin></script> diff --git a/public/make_move.js b/public/make_move.js index d003f55..e480d14 100644 --- a/public/make_move.js +++ b/public/make_move.js @@ -33,7 +33,6 @@ function make_move(board, prev_y_x, new_y_x) { en_passant = prev_y_x[i][1] } - board[new_y_x[i][0]][new_y_x[i][1]] = board[prev_y_x[i][0]][prev_y_x[i][1]] } @@ -56,9 +55,98 @@ function make_move(board, prev_y_x, new_y_x) { board[prev_y_x[i][0]][prev_y_x[i][1]] = 0 } + if (board[new_y_x[0][0]][new_y_x[0][1]] == 6 && new_y_x[0][0] == 0 || board[new_y_x[0][0]][new_y_x[0][1]] == -6 && new_y_x[0][0] == 7) { + let color = board[new_y_x[0][0]][new_y_x[0][1]] > 0 + handle_promotion(color, new_y_x[0][0], new_y_x[0][1]) + } + check = check_check(board, to_move, check) if (check) { console.log("check") } } +function handle_promotion(color, y, x) { + let promotion_window = document.getElementById('promotion-window') + promotion_window.style.visibility = "visible" + + let queen_option = document.getElementById('queen') + + queen_option.onclick = () => { + let promotion_piece = color ? 2 : -2 + board[y][x] = promotion_piece + promotion_window.style.visibility = "hidden" + + let to_element = document.getElementById(`${y}${x}`) + while (to_element.firstChild) { + to_element.removeChild(to_element.firstChild) + } + + let piece = document.createElement('p') + + piece.classList.add(promotion_piece > 0 ? 'w' : 'b', 'piece') + piece.append('Q') + to_element.append(piece) + return + } + + let rook_option = document.getElementById('rook') + + rook_option.onclick = () => { + let promotion_piece = color ? 3 : -3 + board[y][x] = promotion_piece + promotion_window.style.visibility = "hidden" + + let to_element = document.getElementById(`${y}${x}`) + while (to_element.firstChild) { + to_element.removeChild(to_element.firstChild) + } + + let piece = document.createElement('p') + + piece.classList.add(promotion_piece > 0 ? 'w' : 'b', 'piece') + piece.append('R') + to_element.append(piece) + return + } + + let bishop_option = document.getElementById('bishop') + + bishop_option.onclick = () => { + let promotion_piece = color ? 4 : -4 + board[y][x] = promotion_piece + promotion_window.style.visibility = "hidden" + + let to_element = document.getElementById(`${y}${x}`) + while (to_element.firstChild) { + to_element.removeChild(to_element.firstChild) + } + + let piece = document.createElement('p') + + piece.classList.add(promotion_piece > 0 ? 'w' : 'b', 'piece') + piece.append('B') + to_element.append(piece) + return + } + + let knight_option = document.getElementById('knight') + + knight_option.onclick = () => { + let promotion_piece = color ? 5 : -5 + board[y][x] = promotion_piece + promotion_window.style.visibility = "hidden" + + let to_element = document.getElementById(`${y}${x}`) + while (to_element.firstChild) { + to_element.removeChild(to_element.firstChild) + } + + let piece = document.createElement('p') + + piece.classList.add(promotion_piece > 0 ? 'w' : 'b', 'piece') + piece.append('N') + to_element.append(piece) + return + } +} diff --git a/public/move.js b/public/move.js index d95f3f6..5b2ea58 100644 --- a/public/move.js +++ b/public/move.js @@ -23,7 +23,9 @@ let castle_black_long = true let en_passant = -1 let en_passant_move = -1 -function check_check(board, to_move, check) { +let promotion = 0 + +function check_check(board, to_move) { let king_position = [] if (!to_move) { @@ -572,3 +574,5 @@ function amelia_move(board, y, x) { return moves } + + diff --git a/public/style.css b/public/style.css index 86510ea..f93bb32 100644 --- a/public/style.css +++ b/public/style.css @@ -9,6 +9,7 @@ position: relative; user-select: none; } + .top-corner{ padding: 1px; position: absolute; @@ -23,6 +24,7 @@ .white{ /*background-color: #eaead2;*/ background-color: #EDD6B0; + /*background-color: #B88762;*/ color: #4b7299; } @@ -67,3 +69,21 @@ body{ .b { color: black; } + +.piece-option { + font-size: 8rem; + height: 10rem; + width: 10rem; + text-align: center; +} + +#promotion-window { + position: fixed; + height: 10rem; + width: 40rem; + background-color: white; + display: grid; + grid-template-columns: repeat(4,1fr); + visibility: hidden; +} + |