window.addEventListener("load", function (event) {
    console.log(event);
    window.addEventListener('keydown' ,keyPressed);
});

let posTop = 0;
let posLeft = 0;
var gravity = 0;
var jump = 50;

function keyPressed(event) {
    const gamecharacter = document.getElementById("character");
    console.log(gamecharacter);
    console.log(event);
    console.log(posTop);
    console.log(posLeft);

if (event.key === "a"){
    posLeft -=10;
    gamecharacter.style.left = posLeft + 'px';
}
if (posLeft <= 0) {
    posLeft = 0;
    gamecharacter.style.left = posLeft + 'px';
}
if (posLeft >= 1160) {
    posLeft = 1160;
    gamecharacter.style.left = posLeft + 'px';
}
if (event.key === "d") {
    posLeft += 10;
    gamecharacter.style.left = posLeft + 'px';
}
if (event.key === "s") {
    posTop += 10;
    gamecharacter.style.top = posTop + 'px';
}
if (posTop >= 470) {
    posTop = 470;
    gamecharacter.style.top = posTop + 'px';
}
if (event.key === "w") {
    jump();
    gamecharacter.style.top = posTop + 'px';
}
if (posTop <=0) {
    posTop = 0;
    gamecharacter.style.top = posTop + 'px';
}

}
function jump(){

}

state = {
    gamecharacter: false
};
gamecharacter = () => {
    this.setState({gamecharacter: this.state.gamecharacter});
};