xxxxxxxxxx
132
let font;
let pg;
let tX, tY, sp, dspx, dspy, fct;
let loopTime = 100480; // Duración del loop aumentada (8 segundos a 60 FPS)
let currentFrame = 0; // Frame actual en el ciclo de animación
let loopCount = 0; // Contador de ciclos
// Variables para captura
let capturer;
let recording = false;
function setup() {
createCanvas(400, 400);
createSliders();
pg = createGraphics(400, 400);
// Configurar el capturador para GIF
capturer = new CCapture({
format: "gif",
framerate: 60,
verbose: true,
});
// Crear un botón para iniciar/detener la grabación
let recordButton = createButton("Start Recording");
recordButton.position(20, height + 200);
recordButton.mousePressed(toggleRecording);
}
function draw() {
background(0);
// PGraphics
pg.background(0);
pg.fill(255);
pg.textSize(100);
pg.push();
pg.translate(width / 2, height / 2);
pg.textAlign(CENTER, CENTER);
pg.text("About", 0, 0);
pg.pop();
let tilesX = tX.value();
let tilesY = tY.value();
let tileW = int(width / tilesX);
let tileH = int(height / tilesY);
// Calcular desplazamiento dinámico
let displacementX = map(sin(TWO_PI * currentFrame / loopTime), -1, 1, 2, 8);
currentFrame++;
if (currentFrame >= loopTime) {
currentFrame = 0;
loopCount++;
console.log(`Loop completado: ${loopCount}`);
}
for (let y = 0; y < tilesY; y++) {
for (let x = 0; x < tilesX; x++) {
let waveX = int(
sin(frameCount * sp.value() + (x * y) * displacementX) * fct.value()
);
let waveY = int(
sin(frameCount * sp.value() + (x * y) * dspy.value()) * fct.value()
);
if (dspx.value() === 0) {
waveX = 0;
}
if (dspy.value() === 0) {
waveY = 0;
}
let sx = x * tileW + waveX;
let sy = y * tileH + waveY;
let sw = tileW;
let sh = tileH;
let dx = x * tileW;
let dy = y * tileH;
let dw = tileW;
let dh = tileH;
copy(pg, sx, sy, sw, sh, dx, dy, dw, dh);
}
}
// Si está grabando, capturar el frame
if (recording) {
capturer.capture(canvas);
}
}
function toggleRecording() {
if (!recording) {
recording = true;
capturer.start();
} else {
recording = false;
capturer.stop();
capturer.save(); // Guardar el archivo GIF
}
}
function createSliders() {
tX = createSlider(1, 80, 16, 1);
tX.position(20, height + 40);
createP("Tiles X").position(20, height);
tY = createSlider(1, 80, 16, 1);
tY.position(20, height + 100);
createP("Tiles Y").position(20, height + 60);
sp = createSlider(0, 1, 0.005, 0.01);
sp.position(20, height + 160);
createP("Speed").position(20, height + 120);
dspx = createSlider(0, 0.1, 0.05, 0.001);
dspx.position(180, height + 40);
createP("Displacement X").position(180, height);
dspy = createSlider(0, 0.2, 0, 0.01);
dspy.position(180, height + 100);
createP("Displacement Y").position(180, height + 60);
fct = createSlider(0, 300, 100, 1);
fct.position(180, height + 160);
createP("Offset").position(180, height + 120);
}