[WGL/HW02] Added separation lines

1 files changed, 14 insertions, 6 deletions

diff --git a/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html b/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html
index e141f00..c174ff9 100644
--- a/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html
+++ b/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html
@@ -45,21 +45,27 @@
 

 			// от тук до края на функцията да се сложи код,

 			// който създава и рисува m цветни вълнообразни ленти

-			const aspectRatio = 600 / 400;

 			const resolution = 50;

 			const lineAreaWidths = 2 / 11;

-			const maxAmplitude = lineAreaWidths / 2.1;

+			const separatorWidth = 0.02;

+			const maxAmplitude = lineAreaWidths / 2.1 - separatorWidth;

 

 			const step = 2 / resolution;

 			var prevFrequency = 0;

-			for (var x = -1; x < 1; x += lineAreaWidths) {

+			for (var x = -1; x < 1.0001; x += lineAreaWidths) {

 				var frequency = Math.random() * 2.4 + 0.8; // [0.8, 3.2]

 				var colR = Math.random() + 0.2;

 				var colG = Math.random() + 0.2;

 				var colB = Math.random() + 0.2;

 				for (var y = 1; y > -1.0001; y -= step) {

-					data.push((x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency)), y, colR, colG, colB);

-					data.push((x + lineAreaWidths + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency)), y, colR, colG, colB);

+					data.push(x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency), y, colR, colG, colB);

+					data.push(x + lineAreaWidths - separatorWidth + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency), y, colR, colG, colB);

+				}

+				for (var y = 1; y > -1.0001; y -= step) {

+					data.push(x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency), y, 0, 0, 0);

+				}

+				for (var y = 1; y > -1.0001; y -= step) {

+					data.push(x + lineAreaWidths - separatorWidth + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency), y, 0, 0, 0);

 				}

 				prevFrequency = frequency;

 			}

@@ -75,7 +81,9 @@
 			var acc = 0;

 			for (var i = 0; i < m; i++) {

 				gl.drawArrays(gl.TRIANGLE_STRIP, acc, 2 * resolution + 2);

-				acc += 2 * resolution + 2;

+				gl.drawArrays(gl.LINE_STRIP, acc + 2 * resolution + 2, resolution + 1);

+				gl.drawArrays(gl.LINE_STRIP, acc + 3 * resolution + 3, resolution + 1);

+				acc += 4 * resolution + 4;

 			}

 		}

 	</script>