/* * * @ Javier Felipe Toribio 2019-04-01 * * challenge * * Sudoku validator * */ window.onload = () => { // Remove error colors const cleanColors = square => { square.classList.remove ("repeatedInRow", "repeatedInColumn", "repeatedInSubmatrix"); } // Remove colors and content in sudoku inputs const clean = square => { square.value = ""; cleanColors(square); } // Avoid wrong inputs const filterInput = (e) => { const code = e.which ? e.which : e.keyCode; const valid = code >= 49 && code <= 57 && e.target.value.length === 0; return valid } // create sudoku matrix const createMatrix = () => { const container = document.querySelector(".sudoku"); // Create 3 x 3 submatrixes for(let i=0;i<3;i++) { for(let j=0;j<3;j++) { const submatrix = document.createElement("div"); submatrix.setAttribute ("class","submatrix"); submatrix.setAttribute ("id","s"+i+"-"+j); container.appendChild(submatrix); } } // Create inputs in each submatrix for(let i=0;i<9;i++) { for(let j=0;j<9;j++) { const submatrix_id = `s${parseInt(i/3)}-${parseInt(j/3)}`; const submatrix = document.getElementById(submatrix_id); const square = document.createElement("input"); const id = i+"-"+j; square.setAttribute("id",id); square.setAttribute("class","square"); square.setAttribute("type","number"); square.setAttribute("min","1"); square.setAttribute("max","9"); square.onkeypress = filterInput; submatrix.appendChild(square); } } } // Check if there are repeated elements // in rows const checkRows = () => { executeOnFields(cleanColors); let found = {} for(let i=0;i<9;i++) { for(let j=0;j<9;j++) { const id = `${i}-${j}`; const square = document.getElementById(id); const value = square.value; const foundValue = found[value]; if(foundValue) { document. getElementById(foundValue). classList.add("repeatedInRow"); square.classList.add ("repeatedInRow"); } else { found[value]=id; } } found=[]; } } // Check if there are repeated elements // in columns const checkColumns = () => { executeOnFields(cleanColors); let found = {} for(let j=0;j<9;j++) { for(let i=0;i<9;i++) { const id = `${i}-${j}`; const square = document.getElementById(id); const value = square.value; const foundValue = found[value]; if(foundValue) { document.getElementById (foundValue).classList.add ("repeatedInColumn"); square.classList.add ("repeatedInColumn"); } else { found[value]=id; } } found=[]; } } // Check if there are repeated elements // in each submatrix const checkSubmatrix = () => { executeOnFields(cleanColors); let found = {} for(let i=0;i<3;i++) { for(let j=0;j<3;j++) { const submatrix_id = `s${i}-${j}`; const submatrix = document.getElementById (submatrix_id); const squares = Array.from (submatrix. getElementsByClassName("square")); squares.forEach(function(square) { const value = square.value; const foundValue = found[value]; if(foundValue) { document.getElementById (foundValue).classList.add ("repeatedInSubmatrix"); square.classList.add ("repeatedInSubmatrix"); } else { found[value]=square.id; } }); found=[]; } } } // Execute given action in each sudoku input const executeOnFields = action => { const squares = Array.from (document.getElementsByClassName ("square")); squares.forEach(e => action(e)); } // fill sudoku with random numbers const fillWithRandom = square => { cleanColors(square); const random = Math.floor(Math.random() * 9) + 1; square.value = parseInt(random); } // Create sudoku matrix createMatrix(); // Add events for each dom element document.querySelector("#fillButton"). addEventListener ("click", () => executeOnFields(fillWithRandom)); document.querySelector("#cleanButton"). addEventListener ("click", () => executeOnFields(clean)); document.querySelector("#checkRow"). addEventListener ("click", () => checkRows()); document.querySelector("#checkColumn"). addEventListener ("click", () => checkColumns()); document.querySelector("#checkSubmatrix"). addEventListener ("click", () => checkSubmatrix()); }

[challenge] sudoku validator