Canvas.setpenopacity(1);

const quality = 1;
const squareSize = 5;
const ballSize = 60;
const perspective = 10;

const canvasSize = 1024;
const coordSize = 200;
const step = coordSize/canvasSize/quality;
const halfCanvas = canvasSize/2;
const halfCoord = coordSize/2;
const turtle = new Turtle();

turtle.penup();
turtle.goto(-halfCoord, -halfCoord);
turtle.seth(0);

function square(x, y, perspective) {
    const sq = squareSize - squareSize*perspective*y/halfCoord/2;
    const xq = Math.round(x/sq);
    const yq = Math.round(perspective*y/sq);
    if (((xq+1)%2==0 && (yq+1)%2==0) || (xq%2==0 && yq%2==0)) {
        turtle.pendown();
        turtle.forward(step);
        turtle.penup();
    }
    else {
        turtle.forward(step);
    }
}

function ball(x, y, ballPos) {
    const sq = 2*squareSize - 1.725*squareSize*(ballPos/ballSize);
    const xq = Math.round(x/sq);
    const yq = Math.round(y/sq);
    if (((xq+1)%2==0 && (yq+1)%2==0) || (xq%2==0 && yq%2==0)) {
        turtle.pendown();
        turtle.forward(step);
        turtle.penup();
    }
    else {
        turtle.forward(step);
    }
}

function walk(i) {
    const x = turtle.x();
    const y = turtle.y();
    const ax = Math.abs(x);
    const ay = Math.abs(y);
    const ballPos = Math.sqrt(x*x+y*y);
    
    if (x > halfCoord) {
        turtle.goto(-halfCoord, y+step);
        return true;
    }

    if (ay < ballSize && ax < ballSize && ballPos < ballSize) {
        ball(x, y, ballPos);
    }
    else {
        square(x, y, (y > 0 ? -perspective : perspective));   
    }
    
    return y < halfCoord;
}