Skip to content

Sphere speed up during audio generation #40

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Blaizzy merged 4 commits into from
Mar 17, 2025
Merged

Sphere speed up during audio generation #40

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6a816ae
Evaluate the computation graph for audio and predicted duration befor…
ivanfioravanti Mar 15, 2025
e3261eb
Add faster rotation speed of the sphere during generation.
ivanfioravanti Mar 16, 2025
7f8b53c
Merge branch 'main' into main
Blaizzy Mar 17, 2025
7b4cf58
Merge branch 'main' into main
Blaizzy Mar 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 23 additions & 4 deletions mlx_audio/tts/audio_player.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -315,6 +315,11 @@ <h1>MLX-Audio Player</h1>
const glowMesh = new THREE.Mesh(glowGeometry, glowMaterial);
scene.add(glowMesh);

// Define rotation speed variables
let rotationSpeedY = 0.002;
let rotationSpeedX = 0.001;
let isGenerating = false;

// Tab functionality
function openTab(evt, tabName) {
// Hide all tabcontent
Expand Down Expand Up @@ -355,6 +360,11 @@ <h1>MLX-Audio Player</h1>
ttsErrorElement.style.display = 'none';
ttsStatusElement.textContent = 'Generating speech...';

// Increase rotation speed to indicate processing
isGenerating = true;
rotationSpeedY = 0.01;
rotationSpeedX = 0.005;

// Create form data
const formData = new FormData();
formData.append('text', text);
Expand All @@ -378,6 +388,11 @@ <h1>MLX-Audio Player</h1>
.then(data => {
ttsStatusElement.textContent = 'Speech generated successfully!';

// Reset rotation speed
isGenerating = false;
rotationSpeedY = 0.002;
rotationSpeedX = 0.001;

// Clean up previous audio resources
if (audioElement) {
audioElement.pause();
Expand Down Expand Up @@ -414,7 +429,11 @@ <h1>MLX-Audio Player</h1>
})
.catch(error => {
showTtsError(error.message);
ttsStatusElement.textContent = '';

// Reset rotation speed on error too
isGenerating = false;
rotationSpeedY = 0.002;
rotationSpeedX = 0.001;
});
});

Expand Down Expand Up @@ -576,9 +595,9 @@ <h1>MLX-Audio Player</h1>
// Get current time for pulsating effect
const time = performance.now() * 0.001; // Convert to seconds

// Rotate sphere slowly
sphere.rotation.y += 0.002;
sphere.rotation.x += 0.001;
// Rotate sphere with current speed
sphere.rotation.y += rotationSpeedY;
sphere.rotation.x += rotationSpeedX;
glowMesh.rotation.copy(sphere.rotation);

// Update visualization if audio is playing
Expand Down