added more algorithms

Co-authored-by: Copilot <copilot@github.com>
2026-04-27 17:08:24 +00:00
parent d78ef16bff
commit 9a9080c155
10 changed files with 278 additions and 16 deletions
--- a/index.html
+++ b/index.html
@@ -1,17 +1,20 @@
 <!DOCTYPE html>
 <html lang="en">
 	<head>
-		<title>p5.js liberary</title>
+		<title>p5.js liberay</title>
 	</head>
 	<body>
-		<h1>p5.js liberary by me</h1>
-		<div id="liberary">
-			<iframe
+		<h1>p5.js liberay by me</h1>
+		<div style="width: 470px;">
+			<h2 >AbstractAlgorithms</h2>
+			<div id="liberay">
+				<iframe src="http://127.0.0.1:5500/liberay.html?sketches=Cubes.js,calmCircles.js,labyrinth.js,AbstractAlgorithm.js&size=200" frameborder="0"></iframe>
+			</div>
 		</div>
 	</body>
 	<script type="module" src="index.js"></script>
 	<style>
-		h1 {
+		h1, h2 {
 			text-align: center;
 			font-family: cursive, serif;
 		}
@@ -19,5 +22,17 @@
 			background-color: beige;
 		}

+		#liberay {
+			height: 600px;
+			width: 600px;
+		}
+
+		iframe {
+			height: 100%;
+			width: 100%;
+			border: none;
+			margin: 0;
+		}
+
 	</style>
 </html>
--- a/liberay.html
+++ b/liberay.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<title>Document</title>
+	</head>
+	<body>
+	</body>
+	<style>
+		body {
+			margin: 0;
+		}
+		iframe {
+			margin: 0;
+			margin: 10px;
+			padding: 0;
+			border-width: 5px;
+			border-color: rgb(67, 0, 67);
+			border-style:groove;
+			border-radius: 10%;
+			box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
+		}
+	</style>
+	<script>
+		const params = new URLSearchParams(window.location.search);
+		const sketchList = params.get('sketches'); // e.g. liberay.html?sketches=2images.js,calmCircles.js
+		const sketchSize = params.get('size');     // e.g. liberay.html?size=500
+		if (sketchList) {
+			const sketches = sketchList.split(',');
+			for (let sketch of sketches) {
+				const iframe = document.createElement('iframe');
+				iframe.src = `loader.html?sketch=${encodeURIComponent(sketch)}`;
+				// Apply size if provided
+				if (sketchSize) {
+					iframe.style.width = sketchSize + 'px';
+					iframe.style.height = sketchSize + 'px';
+				} else {
+					iframe.style.width = '500px';
+					iframe.style.height = '500px';
+				}
+				document.body.appendChild(iframe);
+			}
+		}
+	</script>
+</html>
--- a/loader.html
+++ b/loader.html
@@ -7,11 +7,25 @@
 			<script id="sketch"></script>
 			<script>
 				const params = new URLSearchParams(window.location.search);
-				const sketchName = "sketches/" + params.get('sketch');
+				let sketchName = "sketches/" + params.get('sketch');
+				if (sketchName == "sketches/") {
+					sketchName = "sketches/" + params.get('sketches');
+				}
 				if (sketchName) {
+					console.log(sketchName+" found");
+					if (!sketchName.endsWith('.js')) {
+						sketchName += '.js';
+					}
+
 					const script = document.getElementById('sketch');
 					script.src = sketchName;
 				}
 			</script>
 		</body>
+		<style>
+			body {
+				margin: 0;
+				overflow: hidden;
+			}
+		</style>
 </html>
--- a/sketches/2images.js
+++ b/sketches/2images.js
@@ -1,6 +1,6 @@
 function preload() {
-	img1 = loadImage('assets/wallpaper/dear.png');
-	img2 = loadImage('assets/wallpaper/elphantJap.jpg');
+	img1 = loadImage('../assets/wallpaper/dear.png');
+	img2 = loadImage('../assets/wallpaper/elphantJap.jpg');
 }

 function setup() {
--- a/sketches/AbstractAlgorithm.js
+++ b/sketches/AbstractAlgorithm.js
@@ -1,6 +1,6 @@
 const circleMaxSize = 30;
 const circleMinSize = 5;
-const maxcircleAmount = 1000;
+let maxcircleAmount = 2;
 const circleCords = [];
 let maxTries = 100;
 let area = [];
@@ -8,7 +8,10 @@ let moveToNextSpotVariable= [];
 let x, y, diameter, circleCordsConst, isCircleCollided, tries, insideTry = 0;

 function setup() {
-	createCanvas(500, 500);
+	createCanvas(windowWidth, windowHeight);
+	maxcircleAmount = maxTries = floor(width);
+	console.log(maxTries);
+	console.log(maxcircleAmount);
 	background(255, 255, 255);
 	//randomSeed(99);

--- a/sketches/Cubes.js
+++ b/sketches/Cubes.js
@@ -4,7 +4,7 @@ var randomY = 0
 var mouseIndex = 0

 function setup() {
-	createCanvas(500, 500);
+	createCanvas(windowWidth, windowHeight);
 	background(255, 255, 255)
 	noFill();
 	for (i = 0; i < 30; i++) {
--- a/sketches/L-System.js
+++ b/sketches/L-System.js
@@ -0,0 +1,184 @@
+let angle = 3.141592653589*1.5;
+let angleDecrement = 1;
+let stepSize = 10;
+let widthIncrement = 1;
+let currentWidth = 1;
+let currentPosition = [501 / 2, 500];
+let fractalst = "FF+[+F-F-F]-[-F+F+F]";
+let stackList = [];
+let lineLenghtScaleFactor = 1.5;
+let swapPlusMinusState = false;
+let turningAngleIncrement = 0.1;
+
+//FF+[+F-F-F]-[-F+F+F] fork
+
+function setup() {
+	console.log("setup");
+	createCanvas(windowWidth, windowHeight);
+	background(255, 255, 255)
+	noFill();
+	stroke(0, 0, 0);
+	strokeWeight(1);
+	currentPosition = [width / 2, height];
+	generateFractal();
+}
+
+function generateFractal() {
+	for (let i = 0; i < fractalst.length; i++) {
+		let c = fractalst.charAt(i);
+		switch (c) {
+			case "F":
+				forward();
+				break;
+			case "+":
+				plus();
+				break;
+			case "-":
+				minus();
+				break;
+			case "f":
+				forwardNoLine();
+				break;
+			case "|":
+				reverseDirection();
+				break;
+			case "#":
+				lineWidthIncrement();
+				break;
+			case "!":
+				lineWidthDecrement();
+				break;
+			case "[":
+				pushStack(i);
+				break;
+			case "]":
+				popStack(i);
+				break;
+			case ">":
+				lineWidthMultiply();
+				break;
+			case "<":
+				lineWidthDivide();
+				break;
+			case "&":
+				swapPlusMinus();
+				break;
+			case "@":
+				drawDot();
+				break;
+			case ")":
+				angleIncrement();
+				break;
+			case "(":
+				angleDecrement();
+				break;
+			default:
+				console.log("unrecognized character",c);
+				break;
+		}
+	}
+}
+
+function minus() {
+	if (swapPlusMinusState) {
+		angle += angleDecrement;
+		return
+	}
+	angle -= angleDecrement;
+}
+
+function plus() {
+	if (swapPlusMinusState) {
+		angle -= angleDecrement;
+		return
+	}
+	angle += angleDecrement;
+}
+
+function lineWidthIncrement(){
+	currentWidth + widthIncrement;
+	strokeWeight(currentWidth);
+}
+
+function lineWidthDecrement(){
+	currentWidth - widthIncrement;
+	strokeWeight(currentWidth);
+}
+
+function forward() {
+	let x = currentPosition[0] + cos(angle) * stepSize;
+	let y = currentPosition[1] + sin(angle) * stepSize;
+	line(currentPosition[0], currentPosition[1], x, y);
+	currentPosition = [x, y];
+}
+
+function forwardNoLine(){
+	let x = currentPosition[0] + cos(angle) * stepSize;
+	let y = currentPosition[1] + sin(angle) * stepSize;
+	currentPosition = [x, y];
+}
+
+function backward() {
+	let x = currentPosition[0] - cos(angle) * stepSize;
+	let y = currentPosition[1] - sin(angle) * stepSize;
+	line(currentPosition[0], currentPosition[1], x, y);
+	currentPosition = [x, y];
+}
+
+function reverseDirection(){
+	angle - 3.14159265358979323;
+}
+
+function pushStack(i){
+	console.log(angle)
+	stackList.push([i,currentPosition[0],currentPosition[1],angle,currentWidth]);
+}
+
+function popStack(i){
+	stackToPop = stackList.length - 1;
+	console.log(stackList[stackToPop])
+	currentPosition = [stackList[stackToPop][1],stackList[stackToPop][2]];
+	angle = stackList[stackToPop][3];
+	strokeWeight[stackList[stackToPop][4]]
+}
+
+function lineWidthMultiply(){
+	currentWidth * lineLenghtScaleFactor;
+	strokeWeight(currentWidth);
+}
+
+function lineWidthDivide(){
+	currentWidth / lineLenghtScaleFactor;
+	strokeWeight(currentWidth);
+}
+
+function swapPlusMinus(){
+	if (swapPlusMinusState) {
+		swapPlusMinusState = false;
+		return
+	}
+	swapPlusMinusState = true;
+}
+
+function drawDot() {
+	let x = currentPosition[0];
+	let y = currentPosition[1];
+	strokeWeight(currentWidth);
+	point(x, y);
+}
+
+function angleIncrement() {
+	angle += turningAngleIncrement;
+}
+
+function angleDecrement() {
+	angle -= turningAngleIncrement;
+}
+
+function draw() {
+
+}
+
+function mousePressed() {
+
+}
--- a/sketches/calmCircles.js
+++ b/sketches/calmCircles.js
@@ -1,5 +1,5 @@
 function setup() {
-	createCanvas(500, 500);
+	createCanvas(windowWidth, windowHeight);
 }

 function draw() {
@@ -7,7 +7,7 @@ function draw() {

 	for (let i = 0; i <= width * sqrt(2); i += 10) {
 		stroke(random(255), random(255), random(255))
-		strokeWeight(2)
+		strokeWeight(width / 70)
 		noFill()
 		circle(width / 2 + random(0, 30), height / 2 + random(0, 30), i)

--- a/sketches/labyrinth.js
+++ b/sketches/labyrinth.js
@@ -14,7 +14,7 @@ var wallGrid = [];
 var rows, cols;

 function setup() {
-	createCanvas(500, 500);
+	createCanvas(windowWidth, windowHeight);
 	rows = ceil(height / gridSize);
 	cols = ceil(width / gridSize);

--- a/sketches/sketchList.txt
+++ b/sketches/sketchList.txt
@@ -1,2 +1,2 @@
-2images.js, calmCircles.js, Cubes.js, image.js, imageNoice.js, labyrinth.js,
-RecursiveCubes.js
+2images.js, AbstractAlgorithm.js, calmCircles.js, Cubes.js, image.js,
+imageNoice.js, labyrinth.js, L-System.js