// Define this if you want the run to return a score:

const canvas = document.createElement('canvas');
document.body.appendChild(canvas)
canvas.style.margin = "50 0 0 50"
canvas.style.width = window.innerWidth / 2 +'px'
canvas.style.height = window.innerHeight / 2 +'px'
canvas.width = window.innerWidth / 2
canvas.height = window.innerHeight / 2
canvas.style.border = "solid 1px black"
const ctx = canvas.getContext('2d')


let player = ctx.fillRect(5,canvas.height / 2, 10, 95)
let comp = ctx.fillRect(canvas.width - 5,canvas.height / 2, -10, 95)

let line = 0 
for(let i = 0; i < 50; i++) {
    line += 10
    ctx.fillRect(canvas.width / 2, line , 3, 5)
}

ctx.arc(canvas.width / 2, canvas.height / 2, 10, 0 ,2 * Math.PI)

ctx.fill()

let playerPos = canvas.height / 2 

AB.world.getState = function()
{
    window.addEventListener('keydown', function(e) {
        if(e.keyCode == 38) {
            ctx.clearRect(5, playerPos ,10,95)
            playerPos -= 1
        }
        else if(e.keyCode == 40) {
            ctx.clearRect(5, playerPos ,10,95)
            playerPos += 1 
        }
    })

    return playerPos
}
AB.world.takeAction = function(action)
{
    console.log(action)
    ctx.fillRect(5,action, 10, 95)
}