Sierpinski/public/data/scripts/sketch.js

let debug = false,
	viewPort = {x: 0, y: 0, v: 0};

let positions = [],
	triangles = [],
	squares = [],
	curves = [],
	algorithm = "";

function setup(){
	setFrameRate(240);
	let c = createCanvas($("#canvasHolder").width(), $("#canvasHolder").height());
	c.parent("canvasHolder");
	
	background(0);
	stroke(255);
	strokeWeight(1);
}

function draw(){
	background(0);
	
	if (algorithm == "chaos"){
		stroke(255);
		if (points.length < 15000) for (let i = 0; i < 5; i++) points.push(p5.Vector.add(points[int(random(3))], points[points.length - 1]).div(2));
		for (let p of points) point(p.x, p.y);
	}
	
	if (algorithm == "classic"){
		fill(255);
		let tr = triangles[0];
		triangle(tr.a.x, tr.a.y, tr.b.x, tr.b.y, tr.c.x, tr.c.y);
		fill(0);
		for (let t of triangles){
			if (triangles.indexOf(t) == 0) continue;
			triangle(t.a.x, t.a.y, t.b.x, t.b.y, t.c.x, t.c.y);
		}
	}
	
	if (algorithm == "carpet"){
		fill(255);
		let sq = squares[0];
		rect(sq.center.x - sq.length / 2, sq.center.y - sq.length / 2, sq.length, sq.length);
		fill(0)
		for (let s of squares){
			if (squares.indexOf(s) == 0) continue;
			rect(s.center.x - s.length / 2, s.center.y - s.length / 2, s.length, s.length);
		}
	}
	
	if (algorithm == "curve"){
		fill(255);
		let c1 = curves[0];
		rect(c1.center.x - c1.length / 2, c1.center.y - c1.length / 2, c1.length, c1.length);
		noFill();
		stroke(0);
		for (let c of curves){
			if (curves.indexOf(c) == 0) continue;
			beginShape();
			for (let s in c){
				if (!c.hasOwnProperty(s)) continue;
				for (let p in c[s]){
					if (!c[s].hasOwnProperty(p)) continue;
					vertex(c[s][p].x, c[s][p].y);
				}
			}
			vertex(c.a.a.x, c.a.a.y);
			endShape();
		}
	}
	
	if (debug) debugInformation();
}

function startSierspinski(){
	let alg = $("input[name=algorithm]:checked", "form").val();
	let a = createVector(width / 2, 50),
		b = createVector(width / 2 - (height - 100) * sin(radians(30)) / sin(radians(60)), height - 50),
		c = createVector(width / 2 + (height - 100) * sin(radians(30)) / sin(radians(60)), height - 50);
	let center = createVector(width / 2, height / 2),
    	length = height * 0.9 > width ? width * 0.9 : height * 0.9;
	switch (alg){
		case "chaos":
			points = [a, b, c];
			break;
		case "classic":
			triangles = [{a: a, b: b, c: c}];
			spTriangle(a, b, c);
			break;
		case "carpet":
			squares = [{center: center, length: length}];
			spCarpet(center, length / 3, 0);
			break;
		case "curve":
			curves = [{center: center, length: length}];
			spCurve(center, length);
			break;
	}
	algorithm = alg;
}

function spTriangle(p1, p2, p3){
	if (dist(p1.x, p1.y, p2.x, p2.y) > 7){
		let newP1 = p5.Vector.add(p1, p2).div(2);
		let newP2 = p5.Vector.add(p1, p3).div(2);
		let newP3 = p5.Vector.add(p3, p2).div(2);
		triangles.push({a: newP1, b: newP2, c: newP3});
		window.setTimeout(function(){spTriangle(p1, newP1, newP2);}, 300);
		window.setTimeout(function(){spTriangle(newP1, p2, newP3);}, 300);
		window.setTimeout(function(){spTriangle(newP2, newP3, p3);}, 300);
	}
}

function spCarpet(center, length, counter){
	if (counter < 5){
		squares.push({center: center, length: length});
		for (let i = 0; i < TWO_PI; i += QUARTER_PI){
			let dispo = createVector(sin(i), -cos(i));
			if (i % HALF_PI == QUARTER_PI) dispo.mult(length * sqrt(2));
			else dispo.mult(length);
			let newCenter = p5.Vector.add(center, dispo);
			window.setTimeout(function(){spCarpet(newCenter, length / 3, counter + 1)}, 500);
		}
	}
}

function spCurve(center, length){
	if (length > 50){
		
		let centerA = createVector(center.x - length / 4, center.y - length / 4),
			centerB = createVector(center.x + length / 4, center.y - length / 4),
			centerC = createVector(center.x + length / 4, center.y + length / 4),
			centerD = createVector(center.x - length / 4, center.y + length / 4);
		
		let newLength = sqrt(pow(length / 2, 2));
		
		let sa = {a: createVector(center.x - length / 4, center.y - length / 8), b: createVector(center.x - length / 8 * 3, center.y - length / 4), c: createVector(center.x - length / 4, center.y - length / 8 * 3), d: createVector(center.x - length / 8, center.y - length / 4)},
		sb = {a: createVector(center.x + length / 8, center.y - length / 4), b: createVector(center.x + length / 4, center.y - length / 8 * 3), c: createVector(center.x + length / 8 * 3, center.y - length / 4), d: createVector(center.x + length / 4, center.y - length / 8)},
		sc = {a: createVector(center.x + length / 4, center.y + length / 8), b: createVector(center.x + length / 8 * 3, center.y + length / 4), c: createVector(center.x + length / 4, center.y + length / 8 * 3), d: createVector(center.x + length / 8, center.y + length / 4)},
		sd = {a: createVector(center.x - length / 8, center.y + length / 4), b: createVector(center.x - length / 4, center.y + length / 8 * 3), c: createVector(center.x - length / 8 * 3, center.y + length / 4), d: createVector(center.x - length / 4, center.y + length / 8)};
		
		curves.push({a: sa, b: sb, c: sc, d: sd});
		
		window.setTimeout(function(){spCurve(centerA, newLength);}, 1000);
		window.setTimeout(function(){spCurve(centerB, newLength);}, 1000);
		window.setTimeout(function(){spCurve(centerC, newLength);}, 1000);
		window.setTimeout(function(){spCurve(centerD, newLength);}, 1000);
	}
}