var sectionEl = document.getElementById('section');
var gridFactor = 5;
var centerSquareIndex = gridFactor * gridFactor / 2 - 0.5;
var masterArray = new Array();
var masterArrayOfWinningArrays = new Array();
var winningCombosCount = gridFactor * 2 + 2;
var freeText = 'FREE';
var squarePhrases = [
    "ai yah",
    "baht poh",
    "chaw see",
    "chee seen",
    "dai lo",
    "deem shurn",
    "gik say",
    "gwai lo",
    "jong gwai",
    "lau hey",
    "loh meng",
    "mm gun yew",
    "mm gwan ngo see",
    "mm sahm mm say",
    "mm teng wah",
    "mo bahn faht",
    "mo soh way",
    "nau",
    "ngau",
    "say la",
    "shurn la",
    "sik see",
    "sun ging",
    "tahm sum",
    "yow mo gow choy",
    "yum gung",
];

function pushFreeText() {
    masterArray.push(freeText);
}

// get the number of squares to set up subarrays of winning rows
var sectionEl = document.getElementById('section');
var squares = sectionEl.querySelectorAll('label');
for (d = 0; d < squares.length; d++) {
    if (d == centerSquareIndex) {
        pushFreeText();
    } else {
        masterArray.push(d);    
    }
    //console.log(masterArray);
}

// get index values to set up subarrays of winning columns
for (n = 0; n < gridFactor; n++) {
    for (m = 0; m < gridFactor; m++) {
        var columnValue = gridFactor * m + n;
        if (columnValue == centerSquareIndex) {
            pushFreeText();
        } else {
            masterArray.push(columnValue);
        }
    }
}

// get index values to set up subarrays of winning diagonals
for (m = 1; m <= gridFactor; m++) {
    var diagonalValue = gridFactor * m - m;
    if (diagonalValue == centerSquareIndex) {
        pushFreeText();
    } else {
        masterArray.push(diagonalValue);       
    }
}

for (m = 0; m < gridFactor; m++) {
    var diagonalValue = gridFactor * m + m;
    if (diagonalValue == centerSquareIndex) {
        pushFreeText();
    } else {
        masterArray.push(diagonalValue);       
    }
}

//console.log(masterArray);

// generate a subarray for each winning combo
for (s = 1; s <= winningCombosCount; s++) {
    var firstSliceIndex = gridFactor * (s - 1);
    var secondSliceIndex = gridFactor * s;
    masterArrayOfWinningArrays.push(masterArray.slice(firstSliceIndex, secondSliceIndex));
}

//console.log(masterArrayOfWinningArrays);

// randomize square phrases and populate them in each square
// using the Fisher-Yates algorithm
  for (let i = squarePhrases.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    const temp = squarePhrases[i];
    squarePhrases[i] = squarePhrases[j];
    squarePhrases[j] = temp;
  }

//console.log(squarePhrases);

var allLabelEls = document.querySelectorAll('label');

for (v = 0; v < allLabelEls.length; v++) {
    var squareValue = squarePhrases[v];
    //console.log(squareValue);
    var spanEl = document.createElement('span');
    
    if (v == centerSquareIndex) {
        var currentInputEl = allLabelEls[v].firstElementChild; // refactor
        //console.log(allLabelEls[v]);
        //console.log(currentInputEl);
        spanEl.append(freeText);
        allLabelEls[v].append(spanEl);
        currentInputEl.disabled = true;
    } else {
        spanEl.append(squareValue);
        allLabelEls[v].append(spanEl);        
    }

    //console.log(spanEl);
    //console.log(allLabelEls[v]);
}

//console.log(allLabelEls);

// find FREE in the winning combos and mark them
for (var y = masterArrayOfWinningArrays.length - 1; y >= 0; y--) {
    for (x = masterArrayOfWinningArrays[y].length - 1; x >= 0; x--) {
        if (masterArrayOfWinningArrays[y].[x] === freeText) {
            masterArrayOfWinningArrays[y].splice(x + 1, 0, 'marked');
        }
    }
}

//console.log(masterArrayOfWinningArrays);

function removeCheckedSquare(inputEl) {
    var modal = document.getElementById('winModal');
    var selectedNumber = inputEl.getAttribute("data-index");
    //console.log(selectedNumber);
    
    // mark the selected number in its array so we can keep track of it
    if (inputEl.checked) {        
        for (var c = masterArrayOfWinningArrays.length - 1; c >= 0; c--) {
            for (a = masterArrayOfWinningArrays[c].length - 1; a >= 0; a--) {
                if (masterArrayOfWinningArrays[c].[a] === +selectedNumber) {
                   masterArrayOfWinningArrays[c].splice(a + 1, 0, 'marked');
                }
            }
            //console.log(masterArrayOfWinningArrays[c]);
        }
    } else {
        // if user unselects a square, remove the marker added earlier
        for (var c = masterArrayOfWinningArrays.length - 1; c >= 0; c--) {
            for (a = masterArrayOfWinningArrays[c].length - 1; a >= 0; a--) {
                if (masterArrayOfWinningArrays[c].[a] === +selectedNumber) {
                   masterArrayOfWinningArrays[c].splice(a + 1, 1);
                }
            }
            //console.log(masterArrayOfWinningArrays[c]);
        }
    }
 
    // display bingo modal when user wins
    for (w = 0; w < masterArrayOfWinningArrays.length; w++) {
        if (masterArrayOfWinningArrays[w].length === gridFactor * 2) {            
            modal.classList.add('u-flex');
        }
    }
}

function resetGame() {
    // use these lines if you want to clear the board when user wins
    // var allCheckedInputs = document.querySelectorAll('input');
    // for (h = 0; h < allCheckedInputs.length; h++) {
    //     if (allCheckedInputs[h].checked) {
    //         allCheckedInputs[h].checked = false;
    //     }
    // }
    history.go(0);
}