zmiana w uruchamianiu proagramu

public/index.html

@@ -11,7 +11,7 @@
         <h1>Kółko i Krzyżyk</h1>
         <div class="board"></div>
         <div class="message"></div>
-        <button class="restart" onclick="restart()">Restart</button>
+        <button class="restart">Restart</button>
     </div>
 
    

public/script.js

@@ -1,3 +1,4 @@
+const $ = e =>document.querySelector(e);
 const board = Array(9).fill(0);
 const step = [];
 let fitstMove = true;
@@ -7,6 +8,8 @@ const winPatterns = [
     [0, 4, 8], [2, 4, 6]             // przekątne
 ];
 
+
+
 function restart(){ 
     board = Array(9).fill(0);
     step = [];
@@ -25,7 +28,7 @@ function checkWin(board) {
 }
 
 function initializeBoard() {
-    const boardElement = document.querySelector('.board');
+    const boardElement =$('.board');
     boardElement.innerHTML = '';
     
     for(let i = 0; i < 9; i++) {
@@ -43,7 +46,7 @@ function initializeBoard() {
 
 function updateBoardDisplay() {
     board.forEach((value, index) => {
-        const cell = document.getElementById('cell-' + index);
+        const cell = $('#cell-' + index);
         cell.className = 'cell';
         if (value === 1) {
             cell.classList.add('o');
@@ -53,7 +56,7 @@ function updateBoardDisplay() {
     });
 
     const winner = checkWin(board);
-    const messageElement = document.querySelector('.message');
+    const messageElement =$('.message');
     if (winner === 1) {
         messageElement.textContent = 'Komputer wygrał!';
     } else if (winner === -1) {
@@ -130,4 +133,8 @@ async function initGame() {
     initializeBoard();
 }
 
+$('.restart').addEventListener('click', ()=>{
+    restart();
+});
+
 initGame();