let size = 20; //min=8, max=50, step=2
let opacity = .45 //min=.1, max=.75, step=.05

Canvas.setpenopacity(opacity);
const turtle = new Turtle();

const canvasSize = 200;
const gridSize = Math.ceil(canvasSize / size) + (Math.ceil(canvasSize / size) % 2 == 0? 1: 0);
var diaSize = size / 4;

function drawCell(i) {
    var col = (i % gridSize) - ((gridSize / 2) | 0);
    var row = (i / gridSize | 0) - ((gridSize / 2) | 0);
    
    var x = (col * size) - (size / 2);
    var y = (row * size) - (size / 2);
    
    var subPattern = [0, 1, 1, 0, 1, 0, 0, 1];
    
    var color = i % 2 == 0;
    
    for(var yy = 0; yy < size; yy += .15) {
        if(color) {
            var xx = 0;
            if(yy < diaSize) { xx = diaSize - yy; } else if(yy > size - diaSize) { xx = yy - (3 * diaSize); }
            
            turtle.jump(x + xx, y + yy);
            turtle.goto(x + size - xx, y + yy);
        }
    }
    for(var k = 0; k < 2; k += opacity) { drawSubcell(x, y, diaSize, subPattern[((i / gridSize | 0) + (i % gridSize)) % subPattern.length]); }
}

function drawSubcell(x, y, size, isPrimary) {
    if(isPrimary) {
        drawCellet(x - (size / 2), y - (size / 2), size / 2);
        drawCellet(x - (size / 2), y + (size / 2), size / 2);
        return;
    }
    drawCellet(x, y, size / 2);
    drawCellet(x - size, y, size / 2);
}

function drawCellet(x, y, size) {
    for(var i = 0; i < size; i += .15) {
        turtle.jump(x + i, y - i);
        turtle.goto(x + size + i, y + size - i);
    }
}

function walk(i) {
    drawCell(i);
    return i < Math.pow(gridSize, 2) - 1;
}