Skip to content

Commit

Permalink
fixed selector bug
Browse files Browse the repository at this point in the history
  • Loading branch information
@99dino
99dino committed Aug 2, 2023
1 parent 23a03a1 commit 6244616
Show file tree
Hide file tree
Showing 3 changed files with 188 additions and 125 deletions.
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Chess-AI
# Chess-AI [Live_demo](https://99dino.github.io/chess-ai/)

Inspired by N-queen ( standard backtrack problem ), Let me present Chess-engine that follow the backtrack alogrithm plus some optimization methods.

Expand Down
307 changes: 184 additions & 123 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,7 @@
></script>

<!-- Chessboad CSS (slighly modified) -->
<link
rel="stylesheet"
href="css/chessboard.css"
/>
<link rel="stylesheet" href="css/chessboard.css" />
<!-- Chessboard JS -->
<script
defer
Expand Down Expand Up @@ -61,145 +58,209 @@

<!-- Custom JS -->
<script defer src="js/main.js"></script>

</head>
<body>
<main>
<div class="container h-100">
<div class="row align-items-center py-1 change h-100">
<div class="col-md-6 d-flex flex-column h-100 justify-content-evenly">
<h1 class="text-align-center change">Chess Engine</h1>
<div class="row justify-content-center">
<span id="position-count change">0</span class="change"> &nbsp positions evaluated in &nbsp <span class="change" id="time">0</span>s.
</div>
<div class="row mb-3 justify-content-center change">
That's &nbsp <span id="positions-per-s">0</span> &nbsp positions / s.
<div class="col-md-6 d-flex flex-column h-100 justify-content-evenly">
<h1 class="text-align-center change">Chess Engine</h1>
<div class="row justify-content-center">
<span id="position-count" class="change">0</span> &nbsp positions
evaluated in &nbsp <span class="change" id="time">0</span>s.
</div>
<div class="row mb-3 justify-content-center change">
That's &nbsp <span id="positions-per-s">0</span> &nbsp positions /
s.
</div>
<div id="accordion">
<div class="card bootifull">
<div class="card-header" id="settingsHeading">
<h2 class="text-align-center">
<button
class="btn btn-header no-outline"
data-toggle="collapse"
data-target="#settings"
aria-expanded="false"
aria-controls="settings"
>
Settings
</button>
</h2>
</div>
<div id="accordion">
<div class="card bootifull ">
<div class="card-header" id="settingsHeading">
<h2 class="text-align-center">
<button class="btn btn-header no-outline " data-toggle="collapse" data-target="#settings" aria-expanded="false" aria-controls="settings">
Settings
</button>
</h2>
</div>
</div>
<div id="settings" class="collapse " aria-labelledby="settingsHeading" data-parent="#accordion">
<div class="card-body">
<div class="row align-items-center justify-content-center">
<div class="form-group">
<label for="search-depth change">Search Depth (Black):</label>
<select id="search-depth">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
</div>
<div class="row align-items-center justify-content-center">
<div class="form-group">
<label for="search-depth-white change">Search Depth (White):</label>
<select id="search-depth-white">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
</div>
</div>
</div>
<div
id="settings"
class="collapse"
aria-labelledby="settingsHeading"
data-parent="#accordion"
>
<div class="card-body">
<div class="row align-items-center justify-content-center">
<div class="form-group">
<label for="search-depth change"
>Search Depth (Black):</label
>
<select id="search-depth">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
<div class="card bootifull">
<div class="card-header" id="openingPositionsHeading">
<h2 class="text-align-center">
<button class="btn btn-header no-outline" data-toggle="collapse" data-target="#openingPositions" aria-expanded="true" aria-controls="openingPositions">
Opening Positions
</button>
</h2>
</div>
</div>
<div id="openingPositions" class="collapse" aria-labelledby="openingPositionsHeading" data-parent="#accordion">
<div class="card-body">
<div class="row my-3 text-align-center">
<div class="col-md-4 my-2">
<button class="btn btn-primary change" id="ruyLopezBtn">Ruy Lopez</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-primary change" id="italianGameBtn">Italian Game</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-primary change" id="sicilianDefenseBtn">Sicilian Defense</button>
</div>
</div>
</div>
</div>
<div class="card bootifull">
<div class="card-header" id="compVsCompHeading">
<h2 class="text-align-center">
<button class="btn btn-header no-outline" data-toggle="collapse" data-target="#compVsComp" aria-expanded="true" aria-controls="compVsComp">
Computer vs. Computer
</button>
</h2>
</div>
</div>
<div id="compVsComp" class="collapse" aria-labelledby="compVsCompHeading" data-parent="#accordion">
<div class="card-body">
<div class="row text-align-center">
<div class="col-md-6 my-2">
<button class="btn btn-success" id="compVsCompBtn">Start Game</button>
</div>
<div class="col-md-6 my-2">
<button class="btn btn-danger" id="resetBtn">Stop and Reset</button>
</div>
</div>
</div>
</div>
</div>
<div class="row my-3 text-align-center">
<div class="col-md-12">
<h2>Advantage</h2>
<p><span id="advantageColor">Neither side</span> has the advantage
(+<span id="advantageNumber">0</span>).</p>
<div class="progress">
<div class="progress-bar bg-primary "
role="progressbar" aria-valuenow="0" style="width: 50%"
aria-valuemin="-2000" aria-valuemax="4000" id='advantageBar'>
</div>
</div>
</div>
</div>
<div class="row my-3 text-align-center">
<div class="col-md-12">
<h2>Status</h2>
<p><span id="status">No check, checkmate, or draw.</span></p>
</div>
<div class="row align-items-center justify-content-center">
<div class="form-group">
<label for="search-depth-white change"
>Search Depth (White):</label
>
<select id="search-depth-white">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-md-6 py-1 d-flex flex-column h-100 justify-content-evenly">
<div class="boardcontainer h-100 d-flex align-items-center justify-content-center">
<div id="myBoard" class="w-100"></div>
</div>
<div class="card bootifull">
<div class="card-header" id="openingPositionsHeading">
<h2 class="text-align-center">
<button
class="btn btn-header no-outline"
data-toggle="collapse"
data-target="#openingPositions"
aria-expanded="true"
aria-controls="openingPositions"
>
Opening Positions
</button>
</h2>
</div>
<div class="row my-3 text-align-center">
</div>
<div
id="openingPositions"
class="collapse"
aria-labelledby="openingPositionsHeading"
data-parent="#accordion"
>
<div class="card-body">
<div class="row my-3 text-align-center">
<div class="col-md-4 my-2">
<button class="btn btn-danger" id="undoBtn">Undo</button>
<button class="btn btn-primary change" id="ruyLopezBtn">
Ruy Lopez
</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-primary" id="startBtn">Start Position</button>
<button
class="btn btn-primary change"
id="italianGameBtn"
>
Italian Game
</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-success" id="redoBtn">Redo</button>
<button
class="btn btn-primary change"
id="sicilianDefenseBtn"
>
Sicilian Defense
</button>
</div>
</div>
</div>
</div>
<div class="card bootifull">
<div class="card-header" id="compVsCompHeading">
<h2 class="text-align-center">
<button
class="btn btn-header no-outline"
data-toggle="collapse"
data-target="#compVsComp"
aria-expanded="true"
aria-controls="compVsComp"
>
Computer vs. Computer
</button>
</h2>
</div>
</div>
<div
id="compVsComp"
class="collapse"
aria-labelledby="compVsCompHeading"
data-parent="#accordion"
>
<div class="card-body">
<div class="row text-align-center">
<div class="col-md-6 my-2">
<button class="btn btn-success" id="compVsCompBtn">
Start Game
</button>
</div>
<div class="col-md-6 my-2">
<button class="btn btn-danger" id="resetBtn">
Stop and Reset
</button>
</div>
</div>
</div>
</div>
</div>
<div class="row my-3 text-align-center">
<div class="col-md-12">
<h2>Advantage</h2>
<p>
<span id="advantageColor">Neither side</span> has the
advantage (+<span id="advantageNumber">0</span>).
</p>
<div class="progress">
<div
class="progress-bar bg-primary"
role="progressbar"
aria-valuenow="0"
style="width: 50%"
aria-valuemin="-2000"
aria-valuemax="4000"
id="advantageBar"
></div>
</div>
</div>
</div>
<div class="row my-3 text-align-center">
<div class="col-md-12">
<h2>Status</h2>
<p><span id="status">No check, checkmate, or draw.</span></p>
</div>
</div>
</div>
<div
class="col-md-6 py-1 d-flex flex-column h-100 justify-content-evenly"
>
<div
class="boardcontainer h-100 d-flex align-items-center justify-content-center"
>
<div id="myBoard" class="w-100"></div>
</div>
<div class="row my-3 text-align-center">
<div class="col-md-4 my-2">
<button class="btn btn-danger" id="undoBtn">Undo</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-primary" id="startBtn">
Start Position
</button>
</div>
<div class="col-md-4 my-2">
<button class="btn btn-success" id="redoBtn">Redo</button>
</div>
</div>
</div>
</div>
</div>
</main>
<script>
console.log($("#myBoard"));
</script>
</body>
</html>
4 changes: 3 additions & 1 deletion js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -394,7 +394,9 @@ function getBestMove(game, color, currSum) {
var positionsPerS = (positionCount * 1000) / moveTime;

// document.querySelector("#position-count").textContent = positionCount;
$("#position-count").text("hello");
$("#position-count").text(positionCount);
console.log(positionCount);

$("#time").text(moveTime / 1000);
$("#positions-per-s").text(Math.round(positionsPerS));

Expand Down

0 comments on commit 6244616

Please sign in to comment.