function makeNewPuzzle() {
//clear the table
document.getElementById("sudokuTable").innerHTML = "";
function shuffle(array) {
let currentIndex = array.length, randomIndex;
// While there remain elements to shuffle...
while (currentIndex != 0) {
// Pick a remaining element...
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex--;
// And swap it with the current element.
[array[currentIndex], array[randomIndex]] = [
array[randomIndex], array[currentIndex]];
}
return array;
}
function shiftToArrayEnd(array, from, to, loops){
for(let i = 0; i < loops; i++) {
// Delete the item from it's current position
let item = array.splice(from, 1);
// Move the item to its new position
array.splice(to, 1, item[0]);
}
}
function buildSudokuRow(sudokuSize){
for(let i = 1; i <= sudokuSize; i++) {
sudokuRow.push(i);
}
shuffle(sudokuRow);
}
function createTable(tableData) {
var table = document.getElementById("sudokuTable");
tableData.forEach(function(rowData) {
var row = document.createElement('tr');
rowData.forEach(function(cellData) {
var cell = document.createElement('td');
cell.className = "cell"+Math.floor((Math.random() * 3) + 1);
cell.appendChild(document.createTextNode(cellData));
row.appendChild(cell);
});
table.appendChild(row);
});
}
var sudokuRow = [];
var sudokuGrid = [];
buildSudokuRow(9);
for(let i = 0; i < sudokuRow.length; i++) {
let shiftPatternArray = [2,3,3,2,3,3,2,3,3];
shiftToArrayEnd(sudokuRow,0,8,shiftPatternArray[i]);
sudokuGrid.push([sudokuRow.slice(0)]);
}
for(let i = 0; i < sudokuGrid.length; i++) {
createTable(shuffle(sudokuGrid[i]));
}
/* Function to add style element */
function addStyle(styles) {
/* Create style document */
var css = document.createElement('style');
css.type = 'text/css';
css.appendChild(document.createTextNode(styles));
/* Append style to the tag name */
document.getElementsByTagName("head")[0].appendChild(css);
}
/* Set the style */
var styles = '.cell3, .cell1 { color: white } #spacer {width:100%;height:2rem;}';
addStyle(styles);
}
function downloadImagePuzzle(){
var container = document.getElementById("sudokuTable");
/* Function to add style element */
function addStyle(styles) {
/* Create style document */
var css = document.createElement('style');
css.type = 'text/css';
css.appendChild(document.createTextNode(styles));
/* Append style to the tag name */
document.getElementsByTagName("head")[0].appendChild(css);
}
/* Set the style */
var styles = '.cell3, .cell1 { color: white }';
addStyle(styles);
html2canvas(container,{allowTaint : true}).then(function(canvas) {
var link = document.createElement("a");
document.body.appendChild(link);
link.download = "9x9sudokuPuzzle.png";
link.href = canvas.toDataURL("image/png");
link.target = '_blank';
link.click();
});
}
function downloadImageAnswer(){
var container = document.getElementById("sudokuTable");
/* Function to add style element */
function addStyle(styles) {
/* Create style document */
var css = document.createElement('style');
css.type = 'text/css';
css.appendChild(document.createTextNode(styles));
/* Append style to the tag name */
document.getElementsByTagName("head")[0].appendChild(css);
}
/* Set the style */
var styles = '.cell3, .cell1 { color: black }';
addStyle(styles);
html2canvas(container,{allowTaint : true}).then(function(canvas) {
var link = document.createElement("a");
document.body.appendChild(link);
link.download = "9x9sudokuAnswer.png";
link.href = canvas.toDataURL("image/png");
link.target = '_blank';
link.click();
});
}
window.onload = makeNewPuzzle;