const order = document.getElementById("graphOrder");
const test_bttn = document.getElementById("test_bttn");
const optionsScreen = document.getElementById("optionsScreen");
const gameScreen = document.getElementById("gameScreen");
const gameContainer = document.getElementById("game");

const testGame = {
    size: 7,
    finished: false,
    board: Array(7).fill(true),
    turn: 0,
    version: "0.0.0",
    human_turn: false,
    winner: ""
}

function createGame(length){
    const game = {
        size: length,
        finished: false,
        board: Array(length).fill(true),
        turn: 0,
        version: "0.0.0",
        human_turn: false,
        winner: ""
    }
    //TODO: create game in DOM
    gameContainer.innerText = ""
    game.board.forEach((status) => {
        let light = document.createElement("div");
        light.classList.add('vertex')
        gameContainer.appendChild(light)
    })
    return game;
}

function toggle_screen(){
    optionsScreen.classList.toggle('inactive');
    gameScreen.classList.toggle('inactive');
    renderGame(testGame)
}

async function humanPlay(game){

}

function renderGame(game){
    //TODO: update game in DOM
}

function displayMessage(text){

}

async function sendGame(game){
    let response = await fetch("https://jpappel.xyz/toggle/query", {
        method: "POST",
        body: JSON.stringify(game),
        headers: {
            "Accept": "application/json",
            "Content-Type": "application/json; charset=UTF-8"
        }
    })
    return response.json()
}

async function gameLoop(){

}

function playGame(){
    //const length = order.valueAsNumber;
    //let game = createGame(length);
    //game = sendGame(game);
    //window.alert("Game Play Not implemented yet")
    const game = createGame(7)
    renderGame(game)
    //while(!game.finished){
    //    humanPlay(game)
    //   // game.nextTurn(game.turn);
    //}
    // displayMessage(game.result);
}