// You can find the Turtle API reference here: https://turtletoy.net/syntax
Canvas.setpenopacity(1);

// Global code will be evaluated once.
const turtle = new Turtle();

// Adjustable variables.
const len = 5; // min=1, max=100, step=1
const space = 4; // min=1, max=100, step=.1
const rows = 20; // min=1, max=50, step=1
const columns = 20; // min=1, max=50, step=1
    
// The walk function will be called until it returns false.
function walk(i) {
    if(!(function() {
        var row = Math.floor(i / columns);
            column = i % columns;
        if(row >= rows)
            return false;
    
        // Position.
        turtle.jump(-((columns-1) * (len+space) / 2) + column * (len+space),-((rows-1) * (len+space) / 2) + row * (len+space));
    
        // Calculate rotation.
        let x = column - columns/2,
            y = row - rows/2,
            angle = Math.atan2(x,y) * 180 / Math.PI,
            distance = Math.sqrt(x*x + y*y) / (columns/2),
            rotation = Math.max(0,1 - distance) * 90 + angle;
            
        // Rotate.
        turtle.right(rotation);
        
        // Draw box.
        box();
        
        // Reset rotation.
        turtle.left(rotation);
    
        return true;
    })()) {
        finish();
        return false;
    }
    return true;
}

// Evaluated once at the end.
function finish() {
    // Cut the frame last.
    const frameWidth = columns * (len+space) + 8,
        frameHeight = rows * (len+space) + 8;
    turtle.jump(-frameWidth/2,-frameHeight/2);
    turtle.setheading(0);
    turtle.pendown();
    turtle.forward(frameWidth);
    turtle.right(90);
    turtle.forward(frameHeight);
    turtle.right(90);
    turtle.forward(frameWidth);
    turtle.right(90);
    turtle.forward(frameHeight);
}

function box() {
    turtle.penup();
    turtle.backward(len/2);
    turtle.left(90);
    turtle.forward(len/2);
    turtle.right(90);
    turtle.pendown();
    for(var i = 0; i < 4; i++) {
        turtle.forward(len);
        turtle.right(90);
    }
}