Sorry, I’m new, and not great with code. I’ve looked through the forums, and the example patterns, but haven’t seen anything in the ballpark example wise of what I’m trying for.
I’ll explain and hopefully someone might be able to help?
So, I’ve started with a looping snake code, and tried to add a speed/color/saturation slider control, but the speed control is not working to control the loop speed.
Ultimately I’d love to have the ‘trailing tail length’ adjustable by slider, and have the speed start relatively slow, but ramp up, and then stay fast. If the ramp up time could be adjustable (at least in the code) that would be amazing.
Any ideas/help appreciated.
Blockquote
export function beforeRender(delta) {
t3 = time(spd)
}
var hue = .03
var sat = 1
var spd = 23
export function sliderHue(h) {
hue = h
}
export function sliderSat(s) {
sat = s
}
export function sliderSpeed(z) {
spd = z
}
distance = 5
export function beforeRender(delta) {
t1 = time(.05)
}
export function render(index) {
h = 0.03
s = .98
v = 1
head = t1 * 23
offset = (head - index + 100) % 100
Updated attempt. Doesn’t seem to be speeding up, but hey- the sliders are working?
Blockquote
var hue = 0.03;
var sat = 1;
var spd = 23;
var maxSpeedIncrease = 3.0; // Maximum speed increase capped at 100%
var currentSpeedIncrease = 0.0;
export function sliderHue(h) {
hue = +h; // Convert to a number using unary plus operator
}
export function sliderSat(s) {
sat = +s; // Convert to a number using unary plus operator
}
export function sliderSpeed(z) {
spd = +z; // Convert to a number using unary plus operator
}
var distance = 5;
var t1 = 0;
var speedFactor = 0.01; // Adjust this value to control the initial speed
export function beforeRender(delta) {
// Update the current speed increase with a maximum cap
if (currentSpeedIncrease + 0.01 <= maxSpeedIncrease) {
currentSpeedIncrease += 0.01;
}
// Update the speed factor based on current speed increase
speedFactor = 0.02 * (2.0 + currentSpeedIncrease);
// Update the animation time
t1 += delta * spd * speedFactor;
}
export function render(index) {
var h = hue;
var s = sat;
var v = 1;
var head = t1 * spd;
var offset = (head - index + 23) % 23;
Progress!!! Now I just need to solve the stutter as it increases speed!! Ideas?
Summary
var hue = 0.03;
var sat = 1;
var originalSpd = 23;
var spd = originalSpd;
var maxSpeedIncrease = 1.0; // Maximum speed increase capped at 100%
var currentSpeedIncrease = 0.0;
var cycleCount = 0;
var cyclesPerSpeedIncrease = 1; // Increase the speed every cycle
var maxSpeedIncreases = 5; // Maximum 5 speed increases
export function sliderHue(h) {
hue = +h; // Convert to a number using unary plus operator
}
export function sliderSat(s) {
sat = +s; // Convert to a number using unary plus operator
}
export function sliderSpeed(z) {
// Calculate the current speed increase percentage from the slider input
currentSpeedIncrease = z / 10; // 10% speed increase per slider unit
// Cap the speed increase to the maximum allowed value
if (currentSpeedIncrease > maxSpeedIncrease) {
currentSpeedIncrease = maxSpeedIncrease;
}
// Update the speed value directly
spd = originalSpd * (1.0 + currentSpeedIncrease);
// Reset the animation time when speed is increased
t1 = 0;
}
var distance = 5;
var t1 = 0;
var speedFactor = 0.00005; // Adjust this value to control the initial speed
export function beforeRender(delta) {
// Update the animation time
t1 += delta * spd * speedFactor;
// Check if a cycle has been completed
if (t1 * spd >= 100) {
cycleCount++;
// Increase the speed after every cycle, up to the maximum allowed speed increases
if (cycleCount % cyclesPerSpeedIncrease === 0 && currentSpeedIncrease < maxSpeedIncreases) {
currentSpeedIncrease += 0.1;
// Cap the speed increase to the maximum allowed value
if (currentSpeedIncrease > maxSpeedIncrease) {
currentSpeedIncrease = maxSpeedIncrease;
}
// Update the speed value directly
spd = originalSpd * (1.0 + currentSpeedIncrease);
// Reset the animation time when speed is increased
t1 = 0;
} else {
// Reset the animation time for the next cycle
t1 = 0;
}
}
}
export function render(index) {
var h = hue;
var s = sat;
var v = 1;
var head = t1 * spd;
var offset = (head - index + 23) % 23;
Alright, final edit, though I’d love advice /thoughts on what to alter?
var hue = 0.03;
var sat = 1;
var originalSpd = 23;
var spd = originalSpd;
var maxSpeedIncrease = 1.0; // Maximum speed increase capped at 100%
var currentSpeedIncrease = 0.0;
var cycleCount = 0;
var cyclesPerSpeedIncrease = 1; // Increase the speed every cycle
var maxSpeedIncreases = 5; // Maximum 5 speed increases
var maxSpeed = 50; // Maximum animation speed
var transitionSpeed = 0.1; // Transition speed for adjusting the animation speed
export function sliderHue(h) {
hue = +h; // Convert to a number using the unary plus operator
}
export function sliderSat(s) {
sat = +s; // Convert to a number using the unary plus operator
}
export function sliderStartSpeed(z) {
// Calculate the current speed increase percentage from the slider input
currentSpeedIncrease = z / 10; // 10% speed increase per slider unit
// Cap the speed increase to the maximum allowed value
if (currentSpeedIncrease > maxSpeedIncrease) {
currentSpeedIncrease = maxSpeedIncrease;
}
// Update the speed value directly
spd = originalSpd * (1.0 + currentSpeedIncrease);
// Reset the animation time when speed is increased
t1 = 0;
}
export function sliderMaxSpeed(maxSpd) {
// Update the maximum animation speed
maxSpeed = maxSpd;
}
export function sliderTransistionSpeed(transitionSpd) {
// Update the delay in between increased animation speed
transitionSpeed = transitionSpd;
}
var distance = 5;
var t1 = 0;
var speedFactor = 0.00005; // Adjust this value to control the initial speed
export function beforeRender(delta) {
// Update the animation time
t1 += delta * spd * speedFactor;
// Check if a cycle has been completed
if (t1 * spd >= 23) {
cycleCount++;
// Increase the speed after every cycle, up to the maximum allowed speed increases
if (cycleCount % cyclesPerSpeedIncrease === 0 && currentSpeedIncrease < maxSpeedIncreases) {
currentSpeedIncrease += 0.1;
// Cap the speed increase to the maximum allowed value
if (currentSpeedIncrease > maxSpeedIncrease) {
currentSpeedIncrease = maxSpeedIncrease;
}
// Update the speed value directly
spd = originalSpd * (1.0 + currentSpeedIncrease);
// Reset the animation time when speed is increased
t1 = 0;
} else {
// Reset the animation time for the next cycle
t1 = 0;
}
}
// Adjust the animation speed towards the maximum speed using the transition speed
if (spd < maxSpeed) {
spd += transitionSpeed * delta;
if (spd > maxSpeed) {
spd = maxSpeed;
}
} else if (spd > maxSpeed) {
spd -= transitionSpeed * delta;
if (spd < maxSpeed) {
spd = maxSpeed;
}
}
}
export function render(index) {
var h = hue;
var s = sat;
var v = 1;
var head = t1 * spd;
var offset = (head - index + 23) % 23;
hsv(h, s, clamp(1 - offset / distance, 0, 1));
}
I appreciate it. Currently the code works, but the transition speed slider and max speed slider don’t seem to impact things much at all. I’d love to get that to have a more impactful feel, but not sure what approach to take, after a few more hours of playing with it, it’s still the most functional version.
Doesn’t stutter, doesn’t turn into a blur motion wise. Seems fairly stable.
If anyone decides to tune it a bit to be a bit more dynamic on the sliders- that would be amazing. Otherwise I figure I’ll have to just accept it for what it is.