let playerAnim = [];
let tomAnim = [];
let enemyAnim = [];
let playerAnimState = 0;
let runDirection = 1;
let runSpeed = 5;
let currentPosition = 0;
let player = document.querySelector("#fuchs img");

fillArrays();
//currentPosition = window.getComputedStyle(player).left;

function fillArrays()
{
    fillArray("fuchs_", 8, playerAnim);
    fillArray("tom_", 3, tomAnim);
    fillArray("enemy_",3, enemyAnim);
}

playerAnim.forEach(function(player)
{
    console.log(player);
});

let start = setInterval(gameLoop, 100);

function gameLoop()
{
    move();
}

function playerRunAnim()
{
    if(playerAnimState == 8)
    {
         playerAnimState = 0;
    }
    player.src = playerAnim[playerAnimState];
    playerAnimState++;
}


document.addEventListener('keydown', function(event) {
    if(event.key == "d")
    {
        if(runDirection == -1)
        {
            player.style.transform = 'scaleX(1)';
        }
        runDirection = 1;
    }
    else if(event.key == "a")
    {
        if(runDirection == 1)
        {
            player.style.transform = 'scaleX(-1)';
        }
        runDirection = -1;
    }
});

function move()
{
    playerRunAnim();
    currentPosition = currentPosition + runDirection * runSpeed;
    player.style.left =  currentPosition + "px";
    console.log(currentPosition);
}