From ffba43277327baf98d2882421c75928469c5aa86 Mon Sep 17 00:00:00 2001 From: riyarane46 <154919910+riyarane46@users.noreply.github.com> Date: Tue, 8 Oct 2024 23:24:37 +0530 Subject: [PATCH] added sudoku solver project --- Web_Development/sudoku_solver/Readme (1).md | 38 ++++++ Web_Development/sudoku_solver/index.html | 25 ++++ Web_Development/sudoku_solver/script.js | 124 ++++++++++++++++++++ Web_Development/sudoku_solver/style.css | 86 ++++++++++++++ 4 files changed, 273 insertions(+) create mode 100644 Web_Development/sudoku_solver/Readme (1).md create mode 100644 Web_Development/sudoku_solver/index.html create mode 100644 Web_Development/sudoku_solver/script.js create mode 100644 Web_Development/sudoku_solver/style.css diff --git a/Web_Development/sudoku_solver/Readme (1).md b/Web_Development/sudoku_solver/Readme (1).md new file mode 100644 index 0000000000..11d3b700e8 --- /dev/null +++ b/Web_Development/sudoku_solver/Readme (1).md @@ -0,0 +1,38 @@ +

đŸ’Ĩ Sudoku Solver đŸ’Ĩ

+ + + +

Tech Stack Used 🎮

+ + +
+ + ![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white) + ![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge&logo=css3&logoColor=white) + ![JavaScript](https://img.shields.io/badge/javascript-%23323330.svg?style=for-the-badge&logo=javascript&logoColor=%23F7DF1E) + +
+ + + + + +## :zap: Description 📃 + +
+ +

This is a Sudoku Solver project made using HTML , CSS & JS. This project automatically solves a Sudoku according to the inputs provided by the user.

+
+ + + + +## :zap: How to run it? 🕹ī¸ + + +- Fork this repository. +- Clone the forked repository. +- Open index.html in your web browser to start your culinary exploration. + + + diff --git a/Web_Development/sudoku_solver/index.html b/Web_Development/sudoku_solver/index.html new file mode 100644 index 0000000000..4ea16f0df5 --- /dev/null +++ b/Web_Development/sudoku_solver/index.html @@ -0,0 +1,25 @@ + + + + + + + + Sudoku Solver + + + + +

Sudoku Solver

+
+ + + +
+
+ + + + + + \ No newline at end of file diff --git a/Web_Development/sudoku_solver/script.js b/Web_Development/sudoku_solver/script.js new file mode 100644 index 0000000000..67cd780c56 --- /dev/null +++ b/Web_Development/sudoku_solver/script.js @@ -0,0 +1,124 @@ +document.addEventListener('DOMContentLoaded', function () { + const gridSize = 9; + const solveButton = document.getElementById("solve-btn"); + solveButton.addEventListener('click', solveSudoku); + + const sudokuGrid = document.getElementById("sudoku-grid"); + for (let row = 0; row < gridSize; row++) { + const newRow = document.createElement("tr"); + for (let col = 0; col < gridSize; col++) { + const cell = document.createElement("td"); + const input = document.createElement("input"); + input.type = "number"; + input.className = "cell"; + input.id = `cell-${row}-${col}`; + cell.appendChild(input); + newRow.appendChild(cell); + } + sudokuGrid.appendChild(newRow); + } +}); + +async function solveSudoku() { + const gridSize = 9; + const sudokuArray = []; + + // Fill the sudoku with grid values + for (let row = 0; row < gridSize; row++) { + sudokuArray[row] = []; + for (let col = 0; col < gridSize; col++) { + const cellId = `cell-${row}-${col}`; + const cellValue = document.getElementById(cellId).value; + if (cellValue !== "" && parseInt(cellValue) >= 10) { + alert("Enter valid numbers !"); + location.reload(); + } + sudokuArray[row][col] = cellValue !== "" ? parseInt(cellValue) : 0; + } + } + + // Identify user-input cells and mark them + for (let row = 0; row < gridSize; row++) { + for (let col = 0; col < gridSize; col++) { + const cellId = `cell-${row}-${col}`; + const cell = document.getElementById(cellId); + + if (sudokuArray[row][col] !== 0) { + cell.classList.add("user-input"); + } + } + } + + // Solve the sudoku + if (solveSudokuHelper(sudokuArray)) { + for (let row = 0; row < gridSize; row++) { + for (let col = 0; col < gridSize; col++) { + const cellId = `cell-${row}-${col}`; + const cell = document.getElementById(cellId); + + if (!cell.classList.contains("user-input")) { + cell.value = sudokuArray[row][col]; + cell.classList.add("solved"); + await sleep(20); + } + } + } + } else { + alert("No solution exists for the given Sudoku puzzle."); + } +} + +function solveSudokuHelper(board) { + const gridSize = 9; + + for (let row = 0; row < gridSize; row++) { + for (let col = 0; col < gridSize; col++) { + if (board[row][col] === 0) { + for (let num = 1; num <= 9; num++) { + if (isValidMove(board, row, col, num)) { + board[row][col] = num; + + // Recursively attempt to solve the Sudoku + if (solveSudokuHelper(board)) { + return true; // Puzzle solved + } + + board[row][col] = 0; // Backtrack + } + } + return false; // No valid number found + } + } + } + + return true; // All cells filled +} + +function isValidMove(board, row, col, num) { + const gridSize = 9; + + // Check row and column for conflicts + for (let i = 0; i < gridSize; i++) { + if (board[row][i] === num || board[i][col] === num) { + return false; // Conflict found + } + } + + // Check the 3*3 subgrid for conflicts + const startRow = Math.floor(row / 3) * 3; + const startCol = Math.floor(col / 3) * 3; + + for (let i = startRow; i < startRow + 3; i++) { + for (let j = startCol; j < startCol + 3; j++) { + if (board[i][j] === num) { + return false; // Conflict found + } + } + } + + return true; // No conflicts found +} + +function sleep(ms) { + return new Promise(resolve => setTimeout(resolve, ms)); +} \ No newline at end of file diff --git a/Web_Development/sudoku_solver/style.css b/Web_Development/sudoku_solver/style.css new file mode 100644 index 0000000000..8d773bbb12 --- /dev/null +++ b/Web_Development/sudoku_solver/style.css @@ -0,0 +1,86 @@ +* { + margin: 0; + padding: 0; +} + +body { + font-family: Arial, Helvetica, sans-serif; + text-align: center; + background: #16222A; + background: -webkit-linear-gradient(to right, #3A6073, #16222A); + background: linear-gradient(to right, #3A6073, #16222A); + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + height: 100vh; +} + +h1 { + font-weight: 500; + color: #fff; + font-size: 3rem; +} + +.sudoku-container { + margin-top: 20px; + display: flex; + justify-content: center; +} + +table { + border-collapse: collapse; + border: 4px solid gold; +} + +.cell { + width: 40px; + height: 40px; + text-align: center; + font-size: 1.3rem; + border: 1px solid gold; + transition: all 0.3s ease-in-out; + font-weight: bold; +} + +table tr:nth-child(3n) td, +table tr:nth-child(3n+3) td { + border-bottom: 2px solid gold; +} + +table td:nth-child(3n) { + border-right: 2px solid gold; + /* border-right: 2px solid #000; */ +} + +input { + outline: none; +} + +input::-webkit-outer-spin-button, +input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} + +button { + margin-top: 20px; + padding: 10px 20px; + font-size: 16px; + background-color: #039be5; + color: #fff; + border: none; + cursor: pointer; + border-radius: 4px; + transition: all 0.3s ease; +} + +button:hover { + background-color: #0056b3; +} + +.solved { + background-color: rgb(242, 5, 64); + /* color: white; */ + transition: all 0.2s ease-in-out; +} \ No newline at end of file