From 83506392b1e61e2b38f025199ee3eac03e9862f0 Mon Sep 17 00:00:00 2001 From: purpzl Date: Sat, 8 Mar 2025 10:55:03 +0000 Subject: [PATCH 1/5] Update ASCII.js --- ASCII.js | 34 +++++++++++++++++++++++++++++----- 1 file changed, 29 insertions(+), 5 deletions(-) diff --git a/ASCII.js b/ASCII.js index 9add237..fecaade 100644 --- a/ASCII.js +++ b/ASCII.js @@ -120,6 +120,7 @@ var obj = { randomness: 15, invert: false, animationType: 'Random Text', + rotationAngle: 0 // Default rotation angle (0 degrees) }; var videoType = "Default"; @@ -172,6 +173,7 @@ gui.add(obj, "randomness").min(0).max(100).step(1).name('Randomness').onChange(r gui.add(obj, 'animationType', [ 'Random Text', 'User Text'] ).name('Text Type').onChange(refresh); gui.add(obj, "textInput").onFinishChange(refresh); +gui.add(obj, "rotationAngle").min(0).max(360).step(1).name('Rotation').onChange(refresh); obj['pausePlay'] = function () { togglePausePlay(); @@ -348,10 +350,32 @@ function renderText(){ if(invertToggle == false){ if(currentGrayValue/255 > adjustedThreshold){ - ctx.fillStyle = interpolateHex(fontColor,fontColor2,(currentGrayValue/255-adjustedThreshold) / (1-adjustedThreshold)) - ctx.fillText(char, col*pixelSize, row*(pixelSize) + pixelSize); - //ctx.strokeStyle = fontColor; - //ctx.strokeText(char, col*pixelSize + pixelSize/4, row*(pixelSize) + pixelSize/2); + if (currentGrayValue / 255 < (1 - adjustedThreshold)) { + // Save the context before rotating + ctx.save(); + + // Translate the context to the center of each character + ctx.translate(col * pixelSize + pixelSize / 2, row * pixelSize + pixelSize / 2); + + // Rotate the context based on the rotation angle from the slider + ctx.rotate(obj.rotationAngle * Math.PI / 180); // Convert degrees to radians + + // Set the fill style based on the gray value + ctx.fillStyle = interpolateHex(fontColor2, fontColor, (currentGrayValue / 255) / (1 - adjustedThreshold)); + + // Draw the rotated text + ctx.fillText(char, -pixelSize / 2, pixelSize / 2); + + // Restore the context to its original state + ctx.restore(); +} else { + // Set the fill style based on the other condition + ctx.fillStyle = interpolateHex(fontColor, fontColor2, (currentGrayValue / 255 - adjustedThreshold) / (1 - adjustedThreshold)); + + // Draw the text without rotation + ctx.fillText(char, col * pixelSize, row * pixelSize + pixelSize); +} + } } else { if(currentGrayValue/255 < (1-adjustedThreshold)){ @@ -981,4 +1005,4 @@ setTimeout(function(){ //MAIN METHOD refresh(); -startDefaultVideo(); \ No newline at end of file +startDefaultVideo(); From d08ee6072b2cf5262e4a29d53cce5293b0b64378 Mon Sep 17 00:00:00 2001 From: purpzl Date: Sat, 8 Mar 2025 11:22:11 +0000 Subject: [PATCH 2/5] Update ASCII_LFO ROTATE.js --- ASCII.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/ASCII.js b/ASCII.js index fecaade..20c1a40 100644 --- a/ASCII.js +++ b/ASCII.js @@ -121,6 +121,10 @@ var obj = { invert: false, animationType: 'Random Text', rotationAngle: 0 // Default rotation angle (0 degrees) + + // Add LFO parameters here + rotationLFOFrequency: 1, // Frequency of LFO (how fast the rotation oscillates) + rotationLFOAmplitude: 30, // Amplitude of LFO (how much the rotation oscillates) }; var videoType = "Default"; @@ -174,6 +178,8 @@ gui.add(obj, "randomness").min(0).max(100).step(1).name('Randomness').onChange(r gui.add(obj, 'animationType', [ 'Random Text', 'User Text'] ).name('Text Type').onChange(refresh); gui.add(obj, "textInput").onFinishChange(refresh); gui.add(obj, "rotationAngle").min(0).max(360).step(1).name('Rotation').onChange(refresh); +gui.add(obj, 'rotationLFOFrequency', 0.1, 10).name('LFO Frequency (Hz)'); +gui.add(obj, 'rotationLFOAmplitude', 0, 360).name('LFO Amplitude (degrees)'); obj['pausePlay'] = function () { togglePausePlay(); From 1ac73e01dd8b8106beabb984b1ff27e241ea844d Mon Sep 17 00:00:00 2001 From: purpzl Date: Sat, 8 Mar 2025 11:27:55 +0000 Subject: [PATCH 3/5] Update ASCII.js bug fix --- ASCII.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/ASCII.js b/ASCII.js index 20c1a40..bb1c916 100644 --- a/ASCII.js +++ b/ASCII.js @@ -121,8 +121,6 @@ var obj = { invert: false, animationType: 'Random Text', rotationAngle: 0 // Default rotation angle (0 degrees) - - // Add LFO parameters here rotationLFOFrequency: 1, // Frequency of LFO (how fast the rotation oscillates) rotationLFOAmplitude: 30, // Amplitude of LFO (how much the rotation oscillates) }; From a56f8b53dfb3813cf596be6ae4ede3cf67d9311b Mon Sep 17 00:00:00 2001 From: purpzl Date: Sat, 8 Mar 2025 11:34:45 +0000 Subject: [PATCH 4/5] Update ASCII.js --- ASCII.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/ASCII.js b/ASCII.js index bb1c916..280f6b4 100644 --- a/ASCII.js +++ b/ASCII.js @@ -120,9 +120,7 @@ var obj = { randomness: 15, invert: false, animationType: 'Random Text', - rotationAngle: 0 // Default rotation angle (0 degrees) - rotationLFOFrequency: 1, // Frequency of LFO (how fast the rotation oscillates) - rotationLFOAmplitude: 30, // Amplitude of LFO (how much the rotation oscillates) + rotationAngle: 0 // Default rotation angle (0 degrees) }; var videoType = "Default"; @@ -176,8 +174,6 @@ gui.add(obj, "randomness").min(0).max(100).step(1).name('Randomness').onChange(r gui.add(obj, 'animationType', [ 'Random Text', 'User Text'] ).name('Text Type').onChange(refresh); gui.add(obj, "textInput").onFinishChange(refresh); gui.add(obj, "rotationAngle").min(0).max(360).step(1).name('Rotation').onChange(refresh); -gui.add(obj, 'rotationLFOFrequency', 0.1, 10).name('LFO Frequency (Hz)'); -gui.add(obj, 'rotationLFOAmplitude', 0, 360).name('LFO Amplitude (degrees)'); obj['pausePlay'] = function () { togglePausePlay(); From 85ea78bc705d9ec3f14a7b9b2d3cbef3cf0add20 Mon Sep 17 00:00:00 2001 From: purpzl Date: Mon, 10 Mar 2025 13:43:36 +0000 Subject: [PATCH 5/5] Update ASCII.js