let fieldId;
let field;
let somethingIsSelected = false;

for(let i = 0; i < 64; i++){
    fieldId = i.toString();
    document.getElementById("field"+fieldId).selected = 0;                                                              //Sorgt dafür dass alle Felder die selected variable haben und diese 0 ist
    document.getElementById("field"+fieldId).piece = 0;                                                                 //Sorgt dafür dass alle Felder die piece variable haben und diese 0 ist
}
for(let i = 0; i < 8; i++){
    fieldId = i.toString();
    document.getElementById("field"+fieldId).piece = 1;                                                                 //Setzt die piece Variable von Feld 0 bis 8 auf 1 -> Diese Felder haben einen Spielstein von Spieler 1
}
for(let i = 56; i < 64; i++){
    fieldId = i.toString();
    document.getElementById("field"+fieldId).piece = 2;                                                                 //Setzt die piece Variable von Feld 0 bis 8 auf 1 -> Diese Felder haben einen Spielstein von Spieler 1
}
drawPieces();

function drawPieces() {
    for (let i = 0; i < 64; i++) {
        fieldId = i.toString();
        field = document.getElementById("field" + fieldId);
        if (field.piece === 0) {
            field.innerText = "";
        } else if (field.piece === 1) {
            field.innerText = "X";
        } else if (field.piece === 2) {
            field.innerText = "O";
        }
    }
}
function selectField(field){
    console.log(field.id);
    for(let i = 0; i < 64; i++){
        fieldId = i.toString();
        if(document.getElementById("field"+fieldId).selected === 1){
            somethingIsSelected = true;
        }
    }
    if(!somethingIsSelected) {
        field.style.backgroundColor = "rgb(227,8,8, 0.3)";
        field.selected = 1;
    } else if (field.selected === 1){
        field.style.backgroundColor = "rgb(255,255,255, 1)";
        field.selected = 0;
        somethingIsSelected = false;
    }
}