Star Patterns

sketch.js

var sliderA, sliderB
var dim = 20
function setup() {
    createCanvas(600, 600)
    sliderA = createSlider(0, dim, dim * 0.75, 1);
    sliderA.position(600, 0);
    sliderB = createSlider(0, dim * 2, dim * 0.25,  1);
    sliderB.position(600, 20);
}

function draw() {
    clear();
    drawFirstElement()
    repeatSample(0, 0, dim, dim)
}

function drawFirstElement () {
    push()
        line(sliderB.value(), 0, sliderA.value(), sliderA.value())
    pop()
    var a = get(0, 0, dim * 2, dim)
    push()
        translate(dim * 2, 0)
        scale(-1, 1)
        image(a, 0, 0)
    pop()
    var b = get(0, 0, dim * 2, dim * 2)
    push()
        translate(dim * 2, 0)
        rotate(radians(90))
        image(b, 0, 0)
    pop()
    push()
        translate(0, dim * 2)
        scale(1, -1)
        image(b, 0, 0)
    pop()
    push()
        translate(0, 0)
        rotate(radians(90))
        scale(1, -1)
        image(b, 0, 0)
    pop()
}

function repeatSample (x, y, w, h) {
	if (w > 500 ) return
	const sample = get(x, y, w * 2, h * 2)
	image(sample, x + w * 2, y, w * 2, h * 2)
	image(sample, x + w * 2, y + w * 2, w * 2, h * 2)
	image(sample, x, y + w * 2, w * 2, h * 2)
	repeatSample(x, y, w * 2, h * 2)
}