diff --git a/Catalogue/chatgpt/Spiral Accident2/index.html b/Catalogue/chatgpt/Spiral Accident2/index.html
new file mode 100644
index 0000000..70ce67e
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral Accident2/index.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
diff --git a/Catalogue/chatgpt/Spiral Accident2/script copy.js b/Catalogue/chatgpt/Spiral Accident2/script copy.js
new file mode 100644
index 0000000..a6ab22a
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral Accident2/script copy.js
@@ -0,0 +1,77 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.00000015;
+const time = 99999999;
+const fps = 60;
+
+let rotation = 0;
+let currentFrame = 0;
+
+function render() {
+ if (currentFrame < maxTime / (1 / fps)) {
+ setTimeout(() => {
+ render();
+ clearCanvas();
+
+ drawSpiral(rotation + 1);
+
+ rotation += degPerSec * fps;
+ currentFrame++;
+ }, 1000 / fps);
+ }
+}
+render();
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 2;
+ const maxIterations = 1000;
+
+ for (let n = 0; n < maxIterations; n++) {
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+ const nAngle = n * angle + Math.sin(angle * n * 3);
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+
+ ctx.beginPath();
+ ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.fillStyle = colourToText(nColor);
+ ctx.fill();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/chatgpt/Spiral Accident2/script.js b/Catalogue/chatgpt/Spiral Accident2/script.js
new file mode 100644
index 0000000..61614c6
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral Accident2/script.js
@@ -0,0 +1,103 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.0000015;
+const maxTime = 99999999;
+
+let startingRotation = 0.5;
+let currentFrame = 0;
+
+let fps = 0;
+let fpsCounter = 0;
+let lastTime = 0;
+
+function render(timestamp) {
+ if (!startTime) startTime = timestamp;
+ const elapsedTime = timestamp - startTime;
+
+ clearCanvas();
+ drawSpiral(startingRotation + degPerSec * elapsedTime);
+
+ if (elapsedTime < maxTime) {
+ requestAnimationFrame(render);
+ }
+
+ displayFPS(timestamp);
+}
+let startTime = null;
+requestAnimationFrame(render);
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 5;
+ const maxIterations = 200;
+ let cX = centerX;
+ let cY = centerY;
+ for (let n = 0; n < maxIterations; n++) {
+ ctx.beginPath();
+ ctx.moveTo(cX, cY);
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+
+ const nAngle = n * angle + Math.sin(angle * (n - angle * 100) * 3);
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+ ctx.lineTo(xCoord, yCoord);
+ cX = xCoord;
+ cY = yCoord;
+ // ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.strokeStyle = colourToText(nColor);
+ ctx.lineWidth = 5;
+ ctx.lineCap = "round";
+ ctx.stroke();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function displayFPS(timestamp) {
+ // Calculate FPS
+ fpsCounter++;
+ if (timestamp > lastTime + 1000) {
+ fps = Math.round((fpsCounter * 1000) / (timestamp - lastTime));
+ fpsCounter = 0;
+ lastTime = timestamp;
+ }
+
+ // Display FPS
+ ctx.fillStyle = "white";
+ ctx.font = "16px Arial";
+ ctx.fillText(`FPS: ${fps}`, 10, 30);
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/chatgpt/Spiral/index.html b/Catalogue/chatgpt/Spiral/index.html
new file mode 100644
index 0000000..70ce67e
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral/index.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
diff --git a/Catalogue/chatgpt/Spiral/script copy.js b/Catalogue/chatgpt/Spiral/script copy.js
new file mode 100644
index 0000000..a6ab22a
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral/script copy.js
@@ -0,0 +1,77 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.00000015;
+const time = 99999999;
+const fps = 60;
+
+let rotation = 0;
+let currentFrame = 0;
+
+function render() {
+ if (currentFrame < maxTime / (1 / fps)) {
+ setTimeout(() => {
+ render();
+ clearCanvas();
+
+ drawSpiral(rotation + 1);
+
+ rotation += degPerSec * fps;
+ currentFrame++;
+ }, 1000 / fps);
+ }
+}
+render();
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 2;
+ const maxIterations = 1000;
+
+ for (let n = 0; n < maxIterations; n++) {
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+ const nAngle = n * angle + Math.sin(angle * n * 3);
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+
+ ctx.beginPath();
+ ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.fillStyle = colourToText(nColor);
+ ctx.fill();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/chatgpt/Spiral/script.js b/Catalogue/chatgpt/Spiral/script.js
new file mode 100644
index 0000000..cd3381a
--- /dev/null
+++ b/Catalogue/chatgpt/Spiral/script.js
@@ -0,0 +1,98 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.000005;
+const maxTime = 99999999;
+
+let startingRotation = 0.5;
+let currentFrame = 0;
+
+let fps = 0;
+let fpsCounter = 0;
+let lastTime = 0;
+
+function render(timestamp) {
+ if (!startTime) startTime = timestamp;
+ const elapsedTime = timestamp - startTime;
+
+ clearCanvas();
+ drawSpiral(startingRotation + degPerSec * elapsedTime,elapsedTime);
+
+ if (elapsedTime < maxTime) {
+ requestAnimationFrame(render);
+ }
+
+ displayFPS(timestamp);
+}
+let startTime = null;
+requestAnimationFrame(render);
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle,elapsedTime) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 3;
+ const maxIterations = 200;
+// angle=0;
+ for (let n = 0; n < maxIterations; n++) {
+ ctx.beginPath();
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+
+ // const nAngle = n* angle ;
+ // const nAngle = n*angle+ Math.sin(rad(n*1+angle*4000))/1 ;
+ const nAngle = n*angle +Math.sin(rad(n*1+angle*40000))/2 ;
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+ ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.fillStyle = colourToText(nColor);
+ ctx.fill();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function displayFPS(timestamp) {
+ // Calculate FPS
+ fpsCounter++;
+ if (timestamp > lastTime + 1000) {
+ fps = Math.round((fpsCounter * 1000) / (timestamp - lastTime));
+ fpsCounter = 0;
+ lastTime = timestamp;
+ }
+
+ // Display FPS
+ ctx.fillStyle = "white";
+ ctx.font = "16px Arial";
+ ctx.fillText(`FPS: ${fps}`, 10, 30);
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/chatgpt/SpiralAccident/index.html b/Catalogue/chatgpt/SpiralAccident/index.html
new file mode 100644
index 0000000..70ce67e
--- /dev/null
+++ b/Catalogue/chatgpt/SpiralAccident/index.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
diff --git a/Catalogue/chatgpt/SpiralAccident/script copy.js b/Catalogue/chatgpt/SpiralAccident/script copy.js
new file mode 100644
index 0000000..a6ab22a
--- /dev/null
+++ b/Catalogue/chatgpt/SpiralAccident/script copy.js
@@ -0,0 +1,77 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.00000015;
+const time = 99999999;
+const fps = 60;
+
+let rotation = 0;
+let currentFrame = 0;
+
+function render() {
+ if (currentFrame < maxTime / (1 / fps)) {
+ setTimeout(() => {
+ render();
+ clearCanvas();
+
+ drawSpiral(rotation + 1);
+
+ rotation += degPerSec * fps;
+ currentFrame++;
+ }, 1000 / fps);
+ }
+}
+render();
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 2;
+ const maxIterations = 1000;
+
+ for (let n = 0; n < maxIterations; n++) {
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+ const nAngle = n * angle + Math.sin(angle * n * 3);
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+
+ ctx.beginPath();
+ ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.fillStyle = colourToText(nColor);
+ ctx.fill();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/chatgpt/SpiralAccident/script.js b/Catalogue/chatgpt/SpiralAccident/script.js
new file mode 100644
index 0000000..ff80044
--- /dev/null
+++ b/Catalogue/chatgpt/SpiralAccident/script.js
@@ -0,0 +1,97 @@
+const canvas = document.getElementById("myCanvas");
+const ctx = canvas.getContext("2d");
+let centerX, centerY;
+
+function setCanvasSize() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ centerX = canvas.width / 2;
+ centerY = canvas.height / 2;
+}
+
+setCanvasSize();
+window.addEventListener("resize", setCanvasSize);
+
+const degPerSec = 0.00000015;
+const maxTime = 99999999;
+
+let startingRotation = 1;
+let currentFrame = 0;
+
+let fps = 0;
+let fpsCounter = 0;
+let lastTime = 0;
+
+function render(timestamp) {
+ if (!startTime) startTime = timestamp;
+ const elapsedTime = timestamp - startTime;
+
+ clearCanvas();
+ drawSpiral(startingRotation + degPerSec * elapsedTime);
+
+ if (elapsedTime < maxTime) {
+ requestAnimationFrame(render);
+ }
+
+ displayFPS(timestamp);
+}
+let startTime = null;
+requestAnimationFrame(render);
+
+function clearCanvas() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "black";
+ ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+}
+
+function drawSpiral(angle) {
+ const startColor = [45, 129, 252];
+ const endColor = [252, 3, 98];
+ const distanceMultiplier = 2;
+ const maxIterations = 1000;
+
+ for (let n = 0; n < maxIterations; n++) {
+ const nColor = lerpRGB(startColor, endColor, Math.cos(rad(n / 2)));
+
+ const nAngle = n * angle + Math.sin(angle * n * 3);
+ const radius = distanceMultiplier * n;
+ const xCoord = radius * Math.cos(nAngle) + centerX;
+ const yCoord = radius * Math.sin(nAngle) + centerY;
+
+ ctx.beginPath();
+ ctx.arc(xCoord, yCoord, 8, 0, 2 * Math.PI);
+ ctx.fillStyle = colourToText(nColor);
+ ctx.fill();
+ }
+}
+
+function rad(degrees) {
+ return degrees * (Math.PI / 180);
+}
+
+function lerpRGB(a, b, t) {
+ const result = [0, 0, 0];
+ for (let i = 0; i < 3; i++) {
+ result[i] = (1 - t) * a[i] + t * b[i];
+ }
+ return result;
+}
+
+function displayFPS(timestamp) {
+ // Calculate FPS
+ fpsCounter++;
+ if (timestamp > lastTime + 1000) {
+ fps = Math.round((fpsCounter * 1000) / (timestamp - lastTime));
+ fpsCounter = 0;
+ lastTime = timestamp;
+ }
+
+ // Display FPS
+ ctx.fillStyle = "white";
+ ctx.font = "16px Arial";
+ ctx.fillText(`FPS: ${fps}`, 10, 30);
+}
+
+function colourToText(colour) {
+ return `rgb(${colour[0]}, ${colour[1]}, ${colour[2]})`;
+}
diff --git a/Catalogue/floral.html b/Catalogue/floral.html
index ad5f086..e58b35b 100644
--- a/Catalogue/floral.html
+++ b/Catalogue/floral.html
@@ -28,7 +28,7 @@
render();
render_clear();
- draw_floral(16, 200, rotation *0, centerX, centerY, "red");
+ draw_floral(8, 200, rotation *0, centerX, centerY, "red");
}, 1000 / fps);
@@ -50,6 +50,7 @@
ctx.beginPath();
ctx.arc(x + Math.cos(rad(90 + piv * i + rotation)) * radius, y + Math.sin(rad(90 + piv * i + rotation)) * radius, radius, stt, end, 0);
ctx.strokeStyle = colour;
+ ctx.lineWidth = 3;
ctx.stroke();
stt = end + -(rad(rot - piv)) //+rad(30);
diff --git a/Catalogue/floralPhyllo.html b/Catalogue/floralPhyllo.html
index 66be164..d9122cf 100644
--- a/Catalogue/floralPhyllo.html
+++ b/Catalogue/floralPhyllo.html
@@ -9,7 +9,7 @@
height="10"
style="display: block; box-sizing: border-box"
>
- Your browser does not support the HTML5 canvas tag.
+
+
+