style: render a/v sync video from the mid-point

av-sync/render-audio.js

@@ -28,6 +28,9 @@ for (let i = 0; i < numberOfRepeats; i++) {
 	finalSamples.set(oneSecondChunk, i * sampleRate);
 }
 
+let halfSecondSilence = new Float32Array(sampleRate / 2).fill(0);
+finalSamples = Float32Array.from([...halfSecondSilence, ...finalSamples]);
+
 let finalBuffer = wav.encode([finalSamples], { sampleRate: sampleRate, float: true, bitDepth: 32 });
 
 fs.writeFileSync(options.output, finalBuffer);

av-sync/render-video.js

@@ -31,16 +31,19 @@ await page.evaluate(async (fps) => {
 }, options.fps);
 
 const totalFrames = parseInt(options.fps) * parseInt(options.cycles);
+const half = Math.floor(parseInt(options.fps) / 2);
 for (let frame = 0; frame < totalFrames; frame++) {
 	let start = Date.now();
 	await page.evaluate(async (n) => {
 		// @ts-ignore
 		await window.setFrame(n);
-	}, frame);
+	}, frame + half);
 	const path = `${options.output}/${frame.toString().padStart(Math.log10(totalFrames) + 1, '0')}.png`;
 	await page.screenshot({ path, omitBackground: true });
 	let end = Date.now();
-	console.log(`Captured frame ${frame + 1}/${totalFrames} (took ${end - start}ms)`);
+	console.log(
+		`Captured frame ${frame + half}: ${frame + 1}/${totalFrames} (took ${end - start}ms)`
+	);
 }
 
 console.log('Done.');