added voice functionality and increased avatar size
All checks were successful
Deploy FluentGerman.ai / deploy (push) Successful in 53s

This commit is contained in:
2026-02-18 10:11:13 +01:00
parent 6df7b17261
commit be366777d4
7 changed files with 59 additions and 11 deletions

View File

@@ -845,9 +845,20 @@ tr:hover td {
/* ── Avatar ───────────────────────────────────────────────────────── */
.avatar-container {
position: relative;
width: 72px;
height: 72px;
width: 120px;
height: 120px;
flex-shrink: 0;
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.avatar-container.speaking {
transform: scale(1.05);
}
.avatar-container.speaking .avatar-ring {
border-color: var(--accent);
box-shadow: 0 0 20px var(--accent-glow);
animation: avatarSpeakPulse 1.2s infinite;
}
.avatar-ring {
@@ -1199,4 +1210,21 @@ tr:hover td {
color: var(--text-muted);
opacity: 0.6;
font-family: monospace;
}
@keyframes avatarSpeakPulse {
0% {
transform: scale(1);
opacity: 0.8;
}
50% {
transform: scale(1.15);
opacity: 0.4;
}
100% {
transform: scale(1);
opacity: 0.8;
}
}

View File

@@ -30,7 +30,7 @@
<button type="submit" class="btn btn-primary btn-block">Sign In</button>
</form>
</div>
<span class="version-label">v0.1.1</span>
<span class="version-label">v0.2.0</span>
</div>
<script src="/js/api.js"></script>

View File

@@ -199,8 +199,19 @@ class VoiceManager {
const audioBlob = await response.blob();
const audioUrl = URL.createObjectURL(audioBlob);
const audio = new Audio(audioUrl);
// Visual feedback
const avatarContainer = document.querySelector('.avatar-container');
if (avatarContainer) avatarContainer.classList.add('speaking');
await audio.play();
return new Promise(resolve => { audio.onended = resolve; });
return new Promise(resolve => {
audio.onended = () => {
if (avatarContainer) avatarContainer.classList.remove('speaking');
resolve();
};
});
}
} catch (e) {
console.warn('[Voice] API TTS failed:', e);