From 6fe85ef9dcebeb004e958dd36405f9ed28025b23 Mon Sep 17 00:00:00 2001 From: niranjanpatil1010 Date: Fri, 31 Oct 2025 17:39:45 +0530 Subject: [PATCH 1/4] Create Tic_Tak_Toe.html --- html/Tic_Tak_Toe.html | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 html/Tic_Tak_Toe.html diff --git a/html/Tic_Tak_Toe.html b/html/Tic_Tak_Toe.html new file mode 100644 index 0000000..eaee0de --- /dev/null +++ b/html/Tic_Tak_Toe.html @@ -0,0 +1,35 @@ + + + + + + Tic Tac Toe Game + + + +
+

Winner

+ +
+
+ +

Tic Tac Toe game

+
+
+ + + + + + + + + +
+
+ +
+ + + + From 8724d9acac7a826582df24f465d624f7c533a9d0 Mon Sep 17 00:00:00 2001 From: niranjanpatil1010 Date: Fri, 31 Oct 2025 17:41:14 +0530 Subject: [PATCH 2/4] Create Tic_Tak_Toe.css --- css/css/Tic_Tak_Toe.css | 70 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 70 insertions(+) create mode 100644 css/css/Tic_Tak_Toe.css diff --git a/css/css/Tic_Tak_Toe.css b/css/css/Tic_Tak_Toe.css new file mode 100644 index 0000000..f1fa2c4 --- /dev/null +++ b/css/css/Tic_Tak_Toe.css @@ -0,0 +1,70 @@ + +*{ + margin: 0; + padding: 0; +} + +body{ + background-color:rgb(6, 129, 145); + text-align: center; +} + +.cantainer{ + height: 70svh; +display: flex; + flex-wrap: wrap; + justify-content: center; + align-content: center; +} + +.game{ + height: 60vmin; + width: 60vmin; + display: flex; + flex-wrap: wrap; + justify-content: center; + align-content: center; + gap: 1.5vmin; +} + +.box{ + height: 18vmin; + width:18vmin; + border-radius:1rem ; + /* border: none; */ + box-shadow: 0 0 1rem rgb(6, 129, 145); + font-size: 8vmin; + color: rgb(246, 72, 86); + background-color: aliceblue; +} +#reset{ + padding: 1.5rem; + font-size: 1.25rem; + background-color: black; + color: aliceblue; + border: 1rem; +} +#newgame{ + padding: 1rem; + font-size: 1.25rem; + background-color: black; + color: aliceblue; + border: 1rem; + +} +.win{ + height :100vmin; + +} +#msg{ + font-size: 10vmin; + color: aliceblue; + display: flex; + justify-content: center; + align-items: center; + gap: 8rem; + +} +.hide{ + display: none; +} From 8be5d04324b381c7311e09af9399099a78ed0866 Mon Sep 17 00:00:00 2001 From: niranjanpatil1010 Date: Fri, 31 Oct 2025 17:45:14 +0530 Subject: [PATCH 3/4] Create Tic_Tak_Toe.js --- js/css/Tic_Tak_Toe.js | 112 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 js/css/Tic_Tak_Toe.js diff --git a/js/css/Tic_Tak_Toe.js b/js/css/Tic_Tak_Toe.js new file mode 100644 index 0000000..a66e2f8 --- /dev/null +++ b/js/css/Tic_Tak_Toe.js @@ -0,0 +1,112 @@ + +let boxes = document.querySelectorAll(".box"); +let reset = document.querySelector("#reset"); +let newgame = document.querySelector("#newgame"); +let win = document.querySelector(".win"); +let msg = document.querySelector("#msg"); +let turn0 = true; +let count = 0; +let draw=false; +const patterns = [ + + [0, 1, 2], + [0, 3, 6], + [0, 4, 8], + [1, 4, 7], + [2, 5, 8], + [2, 4, 6], + [3, 4, 5], + [6, 7, 8], +]; + +boxes.forEach((box) => { + box.addEventListener("click", () => { + if (turn0) { + box.innerText = "O"; + turn0 = false; + } + else { + box.innerText = "X"; + turn0 = true; + } + count++; + console.log(count); + box.disabled = true; + checkwin(); + }) +}) + +const resetbut = () => { + turn0 = true; + enablebox(); + win.classList.add("hide"); + count = 0; + draw=false; + + +} +const disablebox = () => { + for (box of boxes) { + box.disabled = true; + } +} + +const enablebox = () => { + for (box of boxes) { + box.disabled = false; + box.innerText = ""; + } +} +const show = (winner) => { + msg.innerText = `winner is ${winner}`; + win.classList.remove("hide"); + disablebox(); +} + + +const checkwin = () => { + for (pattern of patterns) { + pos1 = boxes[pattern[0]].innerText; + pos2 = boxes[pattern[1]].innerText; + pos3 = boxes[pattern[2]].innerText; + if (pos1 !== "" && pos2 !== "" && pos3 !== "") { + if ((pos1 === pos2 && pos2 === pos3)) { + console.log("winner", pos1); + show(pos1); + draw=true; + break; + + } + } + + } + + if (count === 9 && !draw) { + msg.innerText = "match draw"; + win.classList.remove("hide"); + disablebox(); + } + + } + + + + + +newgame.addEventListener("click", resetbut); +reset.addEventListener("click", resetbut); + + + + + + + + + + + + + + + From 691d48dabfaf4d6749c9b81ef2d24e66e0a572a6 Mon Sep 17 00:00:00 2001 From: niranjanpatil1010 Date: Fri, 31 Oct 2025 17:46:43 +0530 Subject: [PATCH 4/4] Update Contributor.md --- Contributor.md | 1 + 1 file changed, 1 insertion(+) diff --git a/Contributor.md b/Contributor.md index 5d22f63..20cc0ad 100644 --- a/Contributor.md +++ b/Contributor.md @@ -256,3 +256,4 @@ Added solution for custom range slider 45. Niranjan patil | [LinkedIn](https://www.linkedin.com/in/niranjan-patil-8512a1374) | [GitHub](https://github.com/niranjanpatil1010) - Added Solution for Leetcode Q35 search insert position -added solution for median of two sorted array + -added Tik tak toe game using Html,css,js